XF 2.1 Change single navbar color please help!

[Joshbosh]

Hello Everyone!

I was wondering if someone could please help me with something? Me and my team can't for the life of us figure this out. We want to change the color of this section of the navbar to orange. Can anyone help with this issue? We can change the entire bar color, but we only want to change this section. Picture attached.

 

[Russ]

So for just a basic link with no dropdown you could use the "extra attributes"



Result:




But when there's a dropdown arrow involved... that won't work you'll want to make a simple edit in the template PAGE_CONTAINER

Find:

<ul class="p-nav-list js-offCanvasNavSource">

Two lines below change the <li>

to:

<li class="nav{$navSection}">

Then you can use some simple CSS in the template EXTRA.LESS

li.navxfrm {
    background-color: rgb(255, 0, 0);
}

To find your class you'll just need to inspect the nav and view the class:

 

[Joshbosh]

Thank you, will give this a go!