Cornerstone Layered Navigation CSS Classes

[IPProduction]

Is there a way to select the CSS Classes of the layered navigation items? I added CSS classes when I added the nav menu, but I can’t seem to select them.

Thanks!

[nabeel]

Hi @IPProduction,

Thank you for reaching out to us. When you assign a class to Navigation Layered element via Customize tab it is only applied on the parent wrapper of the element. To access the menu items you need to target the class of the menu items.

For example if you’ve assigned a class nav-layered to the Navigation Layered element, you can now access the menu items with the following selector .nav-layered li.menu-item:

Here are some related links for further reading, this could help you in finding and implementing some CSS fixes:

• Intro to CSS - https://goo.gl/mFuWQT
• How to get CSS selectors - https://goo.gl/BmoH39
• Get Started With Viewing And Changing CSS - https://goo.gl/7xFhDa

Hope this helps!

[IPProduction]

Hi there, sorry I added classes on each individual menu item on the actual menu page in the WordPress dashboard. I want certain list items to have a certain style and others to be different. Guessing I can use the same .nav-layered li.my-class to select those individual items.

[ruenel]

Hello @IPProduction,

Yes, you are on the right path. You can create a custom CSS using the class selectors:

.nav-layered li.my-class {
  /* your CSS styling here */
}

If nothing is helping, provide us access to your site so that we can check your settings. Please create a secure note with the following info:
– Link to your site
– WordPress Admin username / password
​
To know how to create a secure note, please check this out: How The Forum Works

Best Regards.