TRAVELIFY THEME - HOVER COLOR ON MENU TEXT

Travelify
1

Thank you for this theme. It works great and is easy to set up. I was wondering how to change the hover color on the menu text. I have created 4 websites using this theme and each one shows green when I hover over the menu text. Can you please tell me how to change this? Is there code I can put in the Custom CSS Advanced?

Thank you.

2

I created a site for my customer using the Travelify theme and was wondering how to remove this part in the footer:

Theme by Colorlib Powered by WordPress

Thank you. I love the theme.

3

I am not technical but it looks like the hover border on text is #439f55 which is green and the hover background is #57ad68 which is also green. So both of these need to be changed???

4

Hi @catch,

I hope you are well today and thank you for your questions.

You can change the menu text hover color and the background color for parent and sub menus separately by adding the following CSS code in the Custom CSS option of your theme on the below path.

Admin Area -> Apperance -> Theme Options -> Other -> Custom CSS

body #main-nav a:hover, #main-nav ul li.current-menu-item a,
body #main-nav ul li.current_page_ancestor a, 
body #main-nav ul li.current-menu-ancestor a, 
body #main-nav ul li.current_page_item a, 
body #main-nav ul li:hover > a, 
body #main-nav li:hover > a, 
body #main-nav ul ul :hover > a, 
body #main-nav a:focus{
  background: #439f55;
  color: #fff;
}

body #main-nav ul li ul li a:hover, 
body #main-nav ul li ul li:hover > a, 
body #main-nav ul li.current-menu-item ul li a:hover {
  color: #439f55;
}

Please change the color value in the above code to whatever you want to use by referring the following pages.

http://www.w3schools.com/html/html_colors.asp
http://www.w3schools.com/html/html_colorvalues.asp
http://www.w3schools.com/tags/ref_colorpicker.asp

Best Regards,
Movin

5

Sub Menu Hover Text still takes the colour from the Main Menu and Sub Menu Hover Background, how can I change that?

Howard

6

Hi Howard,

Please make sure you have used the exact code that i have shared above and share me your site URL where you are using it so that i can troubleshoot it?

Regards,
Movin

7

Thank you. I did take care of this problem. It worked.

8

You are most welcome here :slight_smile:

9

Hey Movin,

Here is the site url http://www.thingstodoinjamaica.sandcastlesvacationsochi.com/

Howard

10

Hi Howard,

I checked your shared site and found you have applied the same colors to parent and sub menus therefore they are displaying same.

Ti change the color of parent menu use the following code

body #main-nav a:hover, #main-nav ul li.current-menu-item a,
body #main-nav ul li.current_page_ancestor a, 
body #main-nav ul li.current-menu-ancestor a, 
body #main-nav ul li.current_page_item a, 
body #main-nav ul li:hover > a, 
body #main-nav li:hover > a, 
body #main-nav ul ul :hover > a, 
body #main-nav a:focus{
  background: #0098c6;
  color: #fff;
}

And to change the sub menu colors use the following CSS code.

body #main-nav ul li ul li a:hover, 
body #main-nav ul li ul li:hover > a, 
body #main-nav ul li.current-menu-item ul li a:hover {
  color: #0098c6;
}

Regards,
Movin

11

Thank you that worked, maybe I didn’t see it before because I think I had the same code.
How do I keep the hover colour on a submenu page when I’m on it, for instance if I’m on Mystic Mountain, how do I keep the lighter blue active to show that is the page I’m on?

Howard

12

Hi Howard,

How do I keep the hover colour on a submenu page when I’m on it, for instance if I’m on Mystic Mountain, how do I keep the lighter blue active to show that is the page I’m on?

By default it should work like this displaying current active menu item.

I have visited your site http://www.thingstodoinjamaica.sandcastlesvacationsochi.com/ and found it’s working fine there but it seems you have changes the theme.

Please advise.

Regards,
Movin

13

Hi Movin,

Sorry I had changed the theme, currently experimenting with a few themes, but I have changed it back now, so can you check it for me please, thank you.

Howard

P.s, Can you check my search box question in the forum to please.

14

Hi Howard,

How do I keep the hover colour on a submenu page when I’m on it, for instance if I’m on Mystic Mountain, how do I keep the lighter blue active to show that is the page I’m on?

You can achieve this using the following CSS code.

body #branding #main-nav ul li.current-menu-item a {
  background: #994fe2;
}
P.s, Can you check my search box question in the forum to please.

We check every topic in the forum with our predefined internal schedule so please don’t bump on the forum as i am sure you understand this.

Regards,
Movin

15

Hi Movin,

I implemented the code and it worked, so thank you for that.
The issue I now have is if I click on the category Ocho Rios in the main menu, all the sub menus are highlighted, which part of the code do I remove to stop this?

Howard

16

Hi Howard,

T resolve this issue try overwriting the above previously shared code with the following code.

body #branding #main-nav ul li.current-menu-item > a {
  background: #994fe2;
}

Regards,
Movin