changing hover colour and toggle menu

• 

  saj91 · Member · Apr 30, 2020 at 4:37 pm

  • Copy link
  • Add topic to favorites

  I can’t seem to change the colour of the hover action on the nav, also the toggle keeps changing back to blue. No blue on either please :(

  The blog I need help with is: (visible only to logged in users)

• 

  vinitdhake · Member · Apr 30, 2020 at 7:20 pm

  • Copy link

  Hi there,

  As per the description, you have provided it looks like you would need to use Custom CSS, which is part of a Premium Plan or Business Plan.

  If you have opted for any of these plans, you would find a CSS section under My Site > Customize and add the following:

  a:hover, a:focus, a:active {
  color: #f35029;
  }

  note that #f35029 is the current red color – you choose the one which you want from the HTML color code as needed.

  Hope this helps!

  Thanks!

• 

  vinitdhake · Member · May 1, 2020 at 9:35 am

  • Copy link

  Hi there,

  To add on to the script I provided earlier, you may have added !important in one of your color CSS codes which is why the changes are not being reflected.
  You can try adding the below code to see if that helps:

  .main-navigation a:hover {
  color: #1279be !important;
  }

  This one is with added class.

  Hope this helps!

  Thanks!

• 

  saj91 · Member · May 1, 2020 at 2:33 pm

  • Copy link

  Hi there,

  I tried what you said yet it didn’t work :( I have found a forum using code that works which is as follows:

  .main-navigation li.current_page_item > a, .main-navigation li.current-menu-item > a, .main-navigation li.current_page_ancestor > a, .main-navigation li.current-menu-ancestor > a, .main-navigation a:hover {
  color: #dfd6c1 !important;
  }

  however now the toggle that was once a caramel colour is back to being blue :(

• 

  vinitdhake · Member · May 1, 2020 at 8:28 pm

  • Copy link

  Hi there,

  I have tested the code, and it works for me.

  Are you sure that you have used to code as mentioned below?

  .main-navigation a:hover {
  color: #1279be !important;
  }

  This should work for you.

  Thanks!

• 

  saj91 · Member · May 5, 2020 at 9:26 am

  • Copy link

  Nope its not working, it turns it back to blue :(

  I have managed to change the hover on the desktop but not the toggle on the mobile version?

  Thanks :)

• 

  saj91 · Member · May 5, 2020 at 9:56 am

  • Copy link

  I have managed to do it, thanks for helping :)