Community Forums › Forums › Archived Forums › Design Tips and Tricks › Mag Pro: Include Logo in Primary Nav
Tagged: Logo, Magazine Pro, menu
- This topic has 14 replies, 3 voices, and was last updated 10 years, 5 months ago by nutsandbolts.
-
AuthorPosts
-
November 5, 2013 at 7:29 am #71040ithacaindyMember
I'd like to include our logo in the fixed primary nav menu of the Magazine Pro child theme. Is there a spot to the left of the menu items I can use, or can I use the logo image in place of the "home" menu item?
http://ithacaindy.comNovember 5, 2013 at 11:59 am #71071nutsandboltsMemberYou could add a CSS class to the Home menu item, then use that class to insert the logo as a background image via CSS.
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+November 5, 2013 at 3:25 pm #71114jmrallenMemberThat's exactly what I did on my site, Daily Game. I'm running a modified version of Magazine Pro there, and so far the logo in the primary nav is working great. Here's the tutorial I used to achieve the effect.
November 5, 2013 at 10:04 pm #71191ithacaindyMemberI have the image appearing as a class of the "home" menu, but the text "home" still appears behind the logo. How do I remove the text - or obscure it?
Thanks, again.
ithacaindy.com
November 5, 2013 at 10:06 pm #71192nutsandboltsMemberUnder Appearance > Menus, open the Home menu item and take out the Navigation Label. Save and you shouldn't see the text anymore (but let me know if you do for some reason).
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+November 5, 2013 at 10:12 pm #71193ithacaindyMemberI delete the text in the Navigation Label, then save - but the menu item vanishes, along with the logo image.
November 5, 2013 at 10:15 pm #71195nutsandboltsMemberOkay, so the next needs to come back. Can you put the label back and let me take a look?
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+November 5, 2013 at 10:50 pm #71200ithacaindyMemberIt's back.
November 5, 2013 at 10:54 pm #71201nutsandboltsMemberOkay, try adding this to your stylesheet:
.menu-item-26963 { text-indent: -9999px; }
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+November 6, 2013 at 8:24 am #71239ithacaindyMemberThat gets rid of the menu item text but cuts my logo image vertically in half.
November 6, 2013 at 8:25 am #71240nutsandboltsMemberHave you set a width in your CSS class?
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+November 6, 2013 at 9:22 am #71251ithacaindyMemberI fixed the width issue by adding the width parameter, but the issue of the menu item text not being pushed offscreen remains. Here are the two css descriptors:
.navlogo {
background: url(images/_Indy_Logo-White2.png) no-repeat left center;
padding: 3px 0 1px 20px;
width: 100px;
}.menu-item-26963 .nav-primary ul li a a:hover {
text-indent: -9999px;}
November 6, 2013 at 9:25 am #71252nutsandboltsMemberTry adding
text-indent: -9999px;
to your .navlogo rules - that works in Firebug (though, as we're seeing, it doesn't always translate in real life).
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+November 6, 2013 at 10:07 am #71261ithacaindyMemberThat did it. Thanks for the assist, Andrea.
November 6, 2013 at 10:09 am #71263nutsandboltsMemberGlad it's finally working! If you don't mind, please mark this topic as resolved so we'll know you've been helped. 🙂
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+ -
AuthorPosts
- The topic ‘Mag Pro: Include Logo in Primary Nav’ is closed to new replies.