[Resolved] Different colors for external links and internal links

Home Forums Support [Resolved] Different colors for external links and internal links

Home Forums Support Different colors for external links and internal links

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #1634472
    Bernhard

    Hello,
    I would like to use different colors for external links and internal links.

    My idea is to use the colors set in the customizer for internal links and assign via CSS to all links, that don’t point to my-website.com, another color (probably the standard blue of the Google links).

    #1634601
    David
    Staff
    Customer Support

    Hi there,

    you can try this CSS:

    a:not([href*="your-domain"]) {
      color: blue;
    }

    This will apply a color to any link that does not contain the your-domain string. So if your site was: www.example-site.com you would use:

    [href*="example-site"]

    #1634674
    Bernhard

    Hi David,
    now found a problem with relative links, e.g. in the Table of content, is it possible to address them?
    Thank you.

    #1634677
    David
    Staff
    Customer Support

    Depends where those links are – for example you could try this:

    p a:not([href*="your-domain"]) {
      color: blue;
    }

    This will only target a link that is within a paragraph.

    #1634748
    Bernhard

    Perfect, thank you 🙂

    #1635348
    David
    Staff
    Customer Support
Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.