Need help? Check out our Support site, then


Newsy theme: customize navigation bar

  1. Can someone help me with sample CSS for customizing the navbar in Newsy? I want to control:

    -- height dimension of the navbar
    -- choice and size of font
    -- addition of links to navbar beyond "home" and "about"

    The answers may be obvious, but after a dozen attempts based on examples I have found, I have failed.

    The blog I need help with is thebluetimes.com.

  2. Newsy is a premium theme and we Volunteers answering questions on this forum have no access to premium themes and no knowledge of how they are designed to operate. When you purchased your premium theme what came with that purchase was support directly from the theme designer in the Premium Theme Support Forum. There is a link for the specific Premium Theme support forum under Appearance -> Themes in your blog’s Dashboard, but the premium theme must be active and you must be signed in as the user who purchased it in order to see it.

    I also checked the forum threads and could not locate an answer for you in them > http://en.forums.wordpress.com/tags/newsy But don't despair, as there is Staff surpport for the custom design upgrade and they will help you.

  3. Newsy is a premium theme and we Volunteers answering questions on this forum have no access to premium themes and no knowledge of how they are designed to operate.

    Read-access to the premium themes forum is now open to all users.
    http://premium-themes.forums.wordpress.com/

  4. -- height dimension of the navbar

    I checked http://thebluetimes.com/ and the navbar looks pretty snug already. Here is an example for making it as small as possible. You can try adjusting the numbers to your liking:

    #access {
    	height: 31px;
    	min-height: 31px;
    	padding-top: 0px;
    }
  5. -- choice and size of font

    You can change the font family and size for the site title, headings, and body text from the Appearance → Custom Design → Fonts page. If you need to change something more specific, post back with a description of exactly which fonts you're looking to change.

  6. -- addition of links to navbar beyond "home" and "about"

    You can use the custom menu feature for that:
    http://en.support.wordpress.com/menus/

  7. @designsimply: Thank you for your kind help. I discovered the obvious fixes just before your post but no the height dimension fix. That is great to know. Thanks.

    I have moved the navbar out of the menu, not liking the look. This prompts a follow-up question, if you dont mind: how do I center the text elements inside the navbar? I have tired CSS schemes I have found here but I have been unsuccessful.

  8. Oh my. I must have been tired. I apologize for the indecipherable post above.

    I menat that I moved the search box out of the navbar and now would like to center the menu text in the navbar.

  9. One more I forgot. The fix for sizing the navbar works great but how do I prevent a gap from appearing between the navbar and the main content body? Thanks again in advance.

  10. How do I center the text elements inside the navbar?

    The text inside each menu item is already centered. To center the entire navbar menu list, give this a try:

    #access div {
    	display: block;
    	text-align: center;
    }
    
    #access ul.menu, #access div.menu > ul {
    	display: inline-block;
    	width: auto;
    }
  11. Done. Brilliant. Thank you.

    If you are up for one more: I have modified the height of the navbar, as I want it narrow and the fonts small. But how do I now eliminate the gap I created between the navbar and the main content body?

  12. I figured it out. Thanks for reading the posts. I appreciate all your help.

  13. Sure. You can remove the padding from #branding to get rid of the small bit of white space that is currently below the menu:

    #branding {
    	padding: 0;
    }

    To tighten up the spacing above the content itself, you can reduce the padding on #main like this:

    #main {
    	padding-top: 20px;
    }

    Adjust the numbers as necessary.

  14. Aha, I wrote my reply before I saw your note that you figured it out. :)

  15. Whoops. There is yet another "one more": how do I increase the space between the search bar (now located in the sidebar) and the header? Thanks in advance.

  16. how do I increase the space between the search bar (now located in the sidebar) and the header?

    :)

    One way would be to add some padding to the top of the sidebar. Give this a try:

    #secondary {
    	padding-top: 22px;
    }
  17. That's the charm! Thank you again. You have been very helpful. And I am learning some CSS along the way, thanks to your patience. So I don't later forget why I did some of these things -- the code is adding up -- how do I make short notes to myself that don't affect the code?

  18. The tinkering goes on. How do I nudge my menu items to the right so they are truly centered? Yes, I know: how does anyone live with this?

  19. how do I make short notes to myself that don't affect the code?

    Comments are stripped out by our CSS parser right now, but it's a planned future update to fix that.

  20. How do I nudge my menu items to the right so they are truly centered?

    It looks truly centered to me right now. Maybe it looks off-center to you because the text inside the header image is not perfectly centered and makes the menu feel off-centered to you in comparison?

    You can shift the menu over anyway if you'd like. To do it, find the "#access ul.menu,#access div.menu > ul" block in your Appearance → Custom Design → CSS page, and add a negative right margin like this:

    margin-right: -100px;

    Adjust the number as necessary.

  21. I have looked at it too long. If you are seeing it as OK, I am going to leave it. Thank you for the comment -- that's as helpful as the instruction. You're a good egg.

  22. Can you help me with links? I notice on my browsers -- Safari and Chrome -- the links are not coming through consistently. If you look at the first and second posts currently on the site, the names "Gaylord Nelson," "Edmund Muskie,"and "Henry Jackson" on the first, and "Russ Cussick" on the second, are all supposed to be blue links. At present, only "Gaylord Nelson" is showing as a blue link, the others are black type, though they show as links if you hover. Also, they all appear as underlined in the post edit window, but none do in the posted piece. I would like links to be underlined in the actual posts. Can you help? Yet again?

  23. The posts referred to above are now the second and third, which you would have figured out.

  24. I figured it out. It was so stupid, I don't want to talk about it.

  25. Glad to hear you figured it out! Sometimes it helps to post about something or get a 2nd person to help out before you figure something seemingly simple out. That's not stupid at all. :)

    Cheers.

  26. Absolutely true.

    BTW, loving your photos of one of my favorite parts of the state.

  27. Thanks! :)

Topic Closed

This topic has been closed to new replies.

About this Topic