Changing Color of Font

• 

  creatorvilla · Member · Jul 15, 2019 at 2:48 pm

  • Copy link
  • Add topic to favorites

  Hey All,

  I hope this finds you well. My question pertains to the font on one of the premium themes. I am able to edit the general color of the font using the editor. However, I can’t figure out how to edit the color of the font once a link has been clicked on. I changed the color of my theme to yellow and white, but whenever someone clicks on a link from the dropdown menu on the header, the font turns red (indicating previous action) until the page is refreshed.

  What CSS code can I submit to change the red to a color that matches my overall edited theme?

  Best,
  Ben

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

• 

  studiozandra · Member · Jul 15, 2019 at 11:45 pm

  • Copy link

  Hi, creatorvilla,

  It seems like you figured it out and changed it already?

  a, a:visited {
  color: #996209;
  ｝
  Good job!

• 

  kokkieh · Staff · Jul 16, 2019 at 8:01 am

  • Copy link

  @studiozandra,

  Thanks for the help here.

  Quick tip: Above the reply box you’ll see some formatting buttons. When posting code for someone, make sure to click the code button before and after writing/pasting your code, or wrap your code in backticks. That way the code formatting is preserved, and it also prevents the forum from trying to render the code instead (or from stripping out code like script tags which aren’t allowed on WordPress.com)

• 

  creatorvilla · Member · Jul 16, 2019 at 12:13 pm

  • Copy link

  Thanks for the help. T

  The text is still showing up as red after changing the color. If you click on one of the dropdown options from the header links at the top you will see what I mean. The tab the user is clicked on turns red.

• 

  staff-blorbo · Staff · Jul 16, 2019 at 3:30 pm

  • Copy link

  For that, add this via Additional CSS:

  .sf-menu > li li.current_page_item > a, .sf-menu > li li.current-menu-item > a, .sf-menu > li li.current_page_ancestor > a, .sf-menu > li li.current-menu-ancestor > a, .sf-menu > li li.current-menu-parent > a {
      color: #996209;
  }

• 

  creatorvilla · Member · Jul 16, 2019 at 4:54 pm

  • Copy link

  That worked perfectly. Much appreciated.

• 

  studiozandra · Member · Jul 17, 2019 at 2:44 am

  • Copy link

  @kokkieh

  I hope it’s ok to thank you even though this issue is closed! I will use that code button from now on!

  -z

• 

  creatorvilla · Member · Jul 19, 2019 at 11:37 am

  • Copy link

  Hello,

  I know I marked the issue as resolved, but I discovered on the mobile version of my website that the font is still showing up as red. There’s a special dropdown menu with the same headers and sub-headers as the desktop site, but apparently a different code for the font.

  How can I change the font color indicating the tab the user has clicked on? As you can see on the Desktop version, I want the font color to go from red to a golden yellow.

  Best

• 

  henriettestewart · Member · Jul 19, 2019 at 12:57 pm

  • Copy link

  Hi Ben,

  Add this to your Additional CSS:

  .primary-menu-responsive > li li.current_page_item > a,  .primary-menu-responsive > li li.current-menu-item > a,  .primary-menu-responsive > li li.current_page_ancestor > a,  .primary-menu-responsive > li li.current-menu-ancestor > a,  .primary-menu-responsive > li li.current-menu-parent > a{
  	color: #996209;
  }

  That will change the current menu item color to your golden yellow on the mobile menu.

  Don’t overwrite the code staff-blorbo gave you previously, you still need that for the desktop menu styles.

• 

  creatorvilla · Member · Jul 19, 2019 at 8:46 pm

  • Copy link

  Perfect. Thank you @henriettestewart.

• 

  henriettestewart · Member · Jul 19, 2019 at 8:56 pm

  • Copy link

  You’re welcome Ben, happy to help. :)

• 

  supernovia · Staff · Jul 19, 2019 at 9:24 pm

  • Copy link

  We’re grateful your help here too, @henriettestewart :) Cheers, all!