Jump to content

[SOLVED] Top horizontal menu color of tabs


dakota_spring
 Share

Recommended Posts

Hello everybody,

 

i've been wondering if it's possible to change the color of only ONE tab of the top horizontal menu? 

I have those different tabs e.g. Home, Products1, Products2... And a Sale tab as well, which I would like to have marked red to make it more visible. 

Is it possible to change only that part/tab of the top horizontal menu without affecting the color of the whole menu?

 

I'm using Prestashop 1.5.4.1.

 

Thanks in advance!

Share this post


Link to post
Share on other sites

Hi Dakota,

 

try this:

 

in file: /modules/blocktopmenu/css/superfish-modified.css (make backup!):

 

add somewhere:

 

.sf-menu li:nth-child(4) {  
  background-color: #a72;
}

.sf-menu li:nth-child(4) a:hover {
  background-color: #472;
}

 

Where 4 should be replaced with the tab number in your menu (i.e. if third tab, add 3 etc)

 

The colour of the menu item can be changed by changing the #a72 (color for 'normal' menu item) and #472 (colour when hovering over the item)

 

Hope this helps,

pascal 

Share this post


Link to post
Share on other sites

use code with "<" then onli first level items will be with background color

.sf-menu > li:nth-child(2) {  
  background-color: #a72;
}

note that nth-child selector is not supported by all browsers, this is why i think jquery will be better, but more complicated solution

Share this post


Link to post
Share on other sites

  • 2 weeks later...
  • 7 months later...

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...

Important Information

Cookies ensure the smooth running of our services. Using these, you accept the use of cookies. Learn More