Hyperlinks Styling

Sofia Pereira

• September 01, 2022 21:39

Hi!

How can I change the color or somehow highlight any hyperlinks used in my text?

Thank you!

0

• 

  KC George

  • September 02, 2022 06:37

  Hi Sofia,

  Please try adding this CSS to your Additional CSS. Remove text-decoration: underline; if you do not want underline. I am using these colors in this example. 

  • Link Normal:  3581e4 
  • Link Hover: fe4800 

  /*Add link color, underline and hover color */
  
  p a {
  color: #3581e4 !important;
    text-decoration: underline;
  }
  p a:hover {
      color: #fe4800 !important;
  }

  0
• 

  Sofia Pereira

  • September 02, 2022 08:48

  Thank you very much KC! And this CSS is to be placed in the theme options right? Just below the other CSS you gave me before for the blog post fonts right?

  0
• 

  KC George

  • September 02, 2022 08:51

  Yes; add it under Additional CSS, below the other CSS code.

  0
• 

  Sofia Pereira

  • September 04, 2022 15:32

  Hi KC!

  I hope you had a good weekend! :)

  Could you please have a look below? The CSS works correctly for color change and underlines on hoover but it doesn't make the text underlined when it's not with hoovered:

  

  Would that also be possible?

  Thank you so much !

  0
• 

  KC George

  • September 05, 2022 02:34
  • Edited

  Hi Sofia,

  Can you delete the previous CSS and try this instead?

  /*Add link color, underline and hover color to blog posts */
  
  a.link--external brz-cp-color2 {
    color: #867E75 !important;
    text-decoration: underline;
  }
  
  a.link--external brz-cp-color2:hover {
    color: #867E75 !important;
    text-decoration: underline;
  }

  If the above CSS does not work, please delete it and try this.

  /*Add link color, underline and hover color to blog posts */
  
  p a.link--external brz-cp-color2 {
    color: #867E75 !important;
    text-decoration: underline;
  }
  
  p a.link--external brz-cp-color2:hover {
    color: #867E75 !important;
    text-decoration: underline;
  }

  0
• 

  Sofia Pereira

  • September 05, 2022 07:53

  Hi KC! Those don't work, the first one was better because it at least changes the color of the words. Ohhh :( 

  Does Brizy have any plans to make this a part of the global styling perhaps? :)

  Maybe using the first piece of code with something else to make the words Bold would work since the underline doesn't?

  0
• 

  KC George

  • September 05, 2022 08:03

  Hi Sofia,

  Yes; we have a Feature Request to include global Link settings. I can't say when this could be done as we have a huge pipeline of such requests.   

  0

Please sign in to leave a comment.