Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

WordPress

Posted by Ivan Tomicic
Ivan Tomicic
3,873 Points

Navigation bar?

What is the best way to make navigation bar like this?

Is it possible to use just one navigation menu or I have to use two?

Thank you so much!

alt text

3 Answers

Dario Morbidi
Dario Morbidi
33,072 Points
Dario Morbidi
Dario Morbidi
33,072 Points

I think one is enough. The styling belongs to css.

Sean Kennedy
Sean Kennedy
21,150 Points
Sean Kennedy
Sean Kennedy
21,150 Points

i would ask for help in the WordPress forum's if your looking for someone to write code for you. If your just asking how its made its like Dario said css & html. The easy way would be to find a theme with a nav bar close to what you want.

overall its kind of hard to tell you how to make it. Also look online for premade nav bars or just mess around with it intill you get what you want.

James Barnett
James Barnett
39,199 Points
James Barnett
James Barnett
39,199 Points

The way I'd do this is to create a nav bar as usual and insert the logo via JavaScript

  • calculate the width of the
    • nav
    • the longest li
    • the logo
  • add in the logo
    • Set the widths of the all of li's
    • adjust the width of center 2 lis to accomdate the logo
    • add in the logo as a background image to the nav.

You can do this via CSS but you have to change your hard coded widths everytime you update your nav links