Customise a specific heading HREF text colour

Themes
1

Hello all :ghost:!

Just wondering if anyone could help with some specific code injection?

Currently all heading links to different pages on my website are the same colour (off green switching to white when hovering).

However, I want just one of these heading links to be a different colour (red, switching to a brighter red when hovering).

See image below for reference:

Screenshot 2021-06-01 at 11.57.52
Screenshot 2021-06-01 at 11.57.52932×146 10 KB

Current code injection used below:

  <style>
    .header { background-color: #026401; border-bottom: none }
    .u-menu-color a { color: #B5DDA8 }
    .u-menu-color a.nav-current, .u-menu-color a:hover { color: #fff !important }
    .menu-burger span { background-color: #B5DDA8}
    .menu-burger:hover span { background-color: #fff }
</style>

Theme used is Simply

Many thanks in advance!

2

You can use an attribute selector:

a[href="YOUR URL"] {
  color: red;
}
3

Thank you @TheRoyalFig, will revert back if that doesn’t work but looking at it, it should!

1 Like