Jump to content
joaoreis

Navbar Sub Option Hover Color

Recommended Posts

joaoreis    0
joaoreis

Hello! I need a little help,

 

 I need to change the dropdown menu color when the mouse is over the sub options of the navbar. I've added the codes which were mentioned above, but it changes the main part of the navbar.

 

 I've also changed the color in the line code 136 /sections/navbar/style.less, but it didn't make any difference.

 

 Is there a way i can change the hover color of the navbar sub options?

 

Share this post


Link to post
Share on other sites
batman    389
batman

Hi joaoreis

First you can try add in

PageLines > Site Options > Custom Code > CSS Rules

or in

Pagelines Customize (plugin)

YOUR CSS RULES

It is advisable to learn how to do this on your own too.  

Check out http://www.pagelines.com/wiki/Custom_CSS

 

I find this Rob´s reply perhaps help you:

 

The following code is not specific to your site and provided for informative purposes only, to provide an example of several different elements for the menu. Look through it and you'll see how colors are changed. I'd also suggest you get Firebug for Firefox to help you find each element. The colors should be changed if you use any of this, to suit your needs.

 

/* NAV BACKGROUND AND BORDER UNDER NAV */

.navigation_wrap {

    border-bottom: 1px solid #bcbcbc !important;

    background-color: #e8ecef !important;}

 

/* TO CHANGE THE COLOR OF THE NAV TEXT AND BACKGROUND (NO HOVER) */

.main-nav li a {

    background-color: #e8ecef !important;

    color: #3f95c7 !important;}

 

/* TO CHANGE THE COLOR OF THE NAV TEXT AND BACKGROUND ON HOVER */

.main-nav li a:hover {

    background-color: #ffffff !important;

    color: #ff9c00 !important;}

 

/* TO MAKE THE ACTIVE MENU APPEAR LIKE THE REST */

.main-nav .current-menu-item a, .main-nav .current-menu-item ul li a:hover {

    background-color: #ffffff !important;

    color: #ff9c00 !important;}

.main-nav .current-menu-item ul li a {

    background-color: #e8ecef !important;

    color: #3f95c7 !important;}

 
Also you can use de Nav Classic with the "Simple CSS Lite" plugin found in the PageLines Store to change all parameters.

It's a free plugin that allows you control over the color of the menu.

Simple CSS Lite only works on the standard navigation, it don´t work on NavBar.


Life is too short to remove USB safely ...

Share this post


Link to post
Share on other sites
joaoreis    0
joaoreis

Batman,

 

 I've already installed Base theme and firebug. Now I'm gonna try this codes you said.

 

 I have another question about the navbar, want to create a customized navbar for a specific page, do i need to open a new topic for this?

 

Thanks!

Share this post


Link to post
Share on other sites
James B    436
James B

Hi there, yes for any new questions please open a new thread. For info you can create a new menu in appearance>menus from the wp dash.


Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post


Link to post
Share on other sites
joaoreis    0
joaoreis

Hello! I've changed for the Nav classic and now it works.

Thanks for the help guys!

Share this post


Link to post
Share on other sites

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


×