Jump to content


Photo
- - - - -

Adding A Second Menu In The Primary Website Navigation Bar

navbar

  • Please log in to reply
3 replies to this topic

#1 edrubins

edrubins

    Member

  • Members
  • 15 posts
  • Country: Country Flag

Posted 02 December 2012 - 10:31 PM

I'm trying to theme a WP E-commerce site with Pagelines Framework. In the primary navigation bar I'd like to have two menus - one to the left with links to static pages and one to the right with links to the product categories. There are two approaches that I can think of.

 

1. Add two custom menus to the navbar and float one left and the other right.

 

2. Put all links in one menu and style the navbar so that the product category links are displayed on the right side of the bar. This would require that the id for each <li> tag in the menu remain constant as items are added or removed from the menu.

 

 Is it possible to add a second menu to the primary navbar? Do the id's remain constant, or will I have redo the stylesheet every time the menu changes? Is there another approach that would accomplish this?

 

TIA - Ed

 



#2 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 02 December 2012 - 10:59 PM

It's not actually possible to add two menus to the Navbar or Nav Classic. 

 

That said, if you go to Dashboard > Appearance > Menus and click Screen Options on the top, right side, you'll see a check box option for CSS Classes.  Check it, then close Screen Options by clicking that again.

 

Now edit or create your custom links, page links, etc., but you'll see a CSS Class option in the edit fields.  Create a unique term for your left and right side menu items. Something like myleftmenuitems1, myleftmenuitems2 and myrightmenuitems1, etc.  Save the menu.

 

Then you will need to write some simple CSS to align and position each.  You'd float the one's marked left to the left, and float:right with the others. You may need to write exact positioning for the individual menu items in CSS. 

 

In the middle, between the two groups, you can add a menu item using #  as the link and in the label, place a transparent, small image. That will create a transparent break between them.



#3 edrubins

edrubins

    Member

  • Members
  • 15 posts
  • Country: Country Flag

Posted 04 December 2012 - 05:18 PM

Rob: Sorry I haven't had a chance to try your suggestion, but I've tied up with some issues in doing customs themes for WP E-commerce (the issues do not seems to involve Pagelines.) As soon as I get those squared away I'll get back to this.

 

Thanks again, Ed



#4 catrina

catrina

    Advocate

  • Members
  • 12345 posts
  • LocationCalifornia
  • Country: Country Flag

Posted 04 December 2012 - 05:39 PM

Ok, no worries.







Also tagged with one or more of these keywords: navbar