Community Forums › Forums › Archived Forums › Design Tips and Tricks › Executive Pro: header and nav bar issues
- This topic has 8 replies, 3 voices, and was last updated 10 years, 2 months ago by cybersavvy.
-
AuthorPosts
-
November 22, 2013 at 9:23 pm #75117cybersavvyMember
Hi
Two problems, possibly related
1) The logo is showing at 260 x100 and I want it larger. Plus I would like to put a phone number and social media icons in the right hand side of the header but the only option I can find for editing that area (I am not a coder!) is in the Header Right widget which is the only place I can find to put the primary navigation.
2) However, I would like the primary navigation and secondary navigation to be together in the centre of the page rather than one left aligned and one right aligned. Then, if at all possible, to round the corners of the nav bar but right now this seems the least of my problems!! (Example site: http://anotherturnusedbooks.com/)
Thanks
http://www.expressworld.co.uk/wordpressNovember 23, 2013 at 7:58 am #75168nutsandboltsMemberIf you select Primary Navigation for that menu instead of putting it in the header right widget area, it should display on top of the secondary navigation (under the header). Just check the box under Appearance > Menus for primary navigation like you did for the secondary.
I just put Executive Pro on a test site, set a primary and secondary nav with some random text in the header right area, and it looks like this:
Hope that helps!
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+November 23, 2013 at 8:43 am #75179cybersavvyMemberDoh! It really was that simple?!! Thank you!
Is there any way of centreing them as it all seems a bit unbalanced now?
Cheers
November 23, 2013 at 8:45 am #75180nutsandboltsMemberDon't feel bad - a fresh pair of eyes will find something you've spent hours on in a matter of seconds, every single time. It's rule #1 of working on websites. 🙂
To center the menus, find this:
.genesis-nav-menu { background-color: #f2f2f2; clear: both; color: #666; font-size: 14px; font-size: 1.4rem; line-height: 1.5; margin: 0; overflow: hidden; padding: 0; width: 100%; }
and change to this:
.genesis-nav-menu { background-color: #f2f2f2; clear: both; color: #666; font-size: 14px; font-size: 1.4rem; line-height: 1.5; margin: 0; overflow: hidden; padding: 0; width: 100%; text-align: center; }
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+November 23, 2013 at 9:13 am #75189cybersavvyMemberAh, simple!
If I want to round off the corners (as per link I put in OP), can I change padding in that code or is it not that easy?!
Thanks for this, I can feel a huge weight lifting off my shoulders 🙂
December 17, 2013 at 10:05 am #79777ATUBParticipantHi! I saw your link to my site and thought I'd tell you how the corners are rounded.
In defining the containers and such for each of the entities you'd like to round:
border-top-left-radius: 10px;
border-top-right-radius: 10px;
border-bottom-right-radius: 0px;
border-bottom-left-radius: 0px;to round the top of the top navigation bar.
border-top-left-radius: 0px;
border-top-right-radius: 10px;
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px;to round the bottom of the bottom navigation bar.
To round one navigation bar:
border-radius: 10px;
December 17, 2013 at 10:17 am #79779ATUBParticipantOops!
border-top-left-radius: 0px;
border-top-right-radius: 0px;
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px;to round the bottom of a nav bar.
Couldn't see how to edit my post above.
December 17, 2013 at 11:09 am #79788cybersavvyMemberFebruary 20, 2014 at 10:33 am #91415cybersavvyMemberOk, I have tried and tried to change the corners and sorry, but I need to ask for help again.
I am looking within my css on FTP, within the section entitled Site Navigation, but I cannot work out where exactly to put the code for rounding the corners. I've tried firebug on the ATUB site but that is proving as clear as mud to this newbie!
Can anyone give me any clues please as to where to put the code ATUB has been kind enough to give me?
Thanks
Oh, and I have also failed to make the top and bottom of the nav bar different colours so currently rounded corners will not show up anyway!
-
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.