Second menu

[Thomas Wadham-Gagnon]

Hello,

I would like to add menu items in the page header..So far I’ve added the following last line in functions.php:

register_nav_menus( array(
‘side’ => __( ‘Sidebar Navigation’, ‘organizedthemes’ ),
‘mobile’ => __( ‘Mobile Navigation’, ‘organizedthemes’ ),
‘Top’ => __( ‘Top Navigation’ ),

Then i added in header.php:

‘Top’, ‘container_id’ => ’topmenu’) ); ?>

Then finally in style.php:

#topmenu {
color:#ffff;
}

If there is a simpler way to go about it your help would be really great. For the moment i can’t seem to override the other menu’s styling.

Thanks!

Tom

[Bill Robbins]

Tom,

You can do that. It looks like you added in the Top navigation correctly. You should see it in the Menu builder now. I’d suggest adding in the:

<?php wp_nav_menu( array( 'theme_location' => 'Top', 'container_id' => 'topmenu') ); ?>

Just before the closing </div> for the header-bar.

The last bit you’ll need is the CSS. You can add it to the bottom of the style.css file or in the Custom CSS box of the theme options page:

#topmenu li {
	font-size: 15px;
	margin-right: 3px;
	margin-left: 3px;
}

#topmenu li a,
#topmenu li a:visited {
	color: #fff;
	padding-top: 6px;
	padding-right: 2px;
	padding-left: 2px;
}

That should do it. If you have any questions, let me know,
Bill

[Thomas Wadham-Gagnon]

Awesome Bill, just checked your message after a beer at the pub and things are working great. Im looking into maintaining the layout for the different screen sizes.

I followed your advice on my recent post: https://support.organizedthemes.com/forums/topic/mobile-layout/

And added the code to the different layouts in the css sheet. Only one question mark, I inserted the code once at the bottom for each layout styles, then had to add once more the code before the different layout configurations to get it right for above 900 pixels. Im pretty new to dynamic layouts but this one seems to be working well.

Also I would like to better understand menu li, a … as well as containers, container ID’s.. Any resources or books on this you could point me to? You have been a great help so far, thanks a lot and keep up the good work.

Tom
ceramique.wgpro.ca

[Bill Robbins]

Tom,

When I was first learning CSS, there were two books that I found helpful:

• Handcrafted CSS: http://www.amazon.com/Handcrafted-CSS-More-Bulletproof-Design/dp/0321643380/
• CSS: The Missing Manual http://www.amazon.com/CSS-Missing-David-Sawyer-McFarland/dp/0596802447

They can provide a solid foundation for moving forward in CSS. They also helped out with my HTML even though that’s not the focus of the book.

For responsive CSS with Media Queries, I read Responsive Web Design (http://www.abookapart.com/products/responsive-web-design) which really helped me wrap my brain around the concepts there.

The other tool that really helped for me was a Mac program called CSS Edit. It allows you to edit/write CSS and immediately see the changes to the site in a live web browser. It also allows you to “X-Ray” any part of a web page and see the styles that affect it. That helped tremendously in figuring out how things work.

CSS Edit has been rolled into a larger web editing package called Espresso which is my development tool of choice.

If you have any questions, just let me know.

Enjoy your weekend,
Bill

[Author]

Posts