Archived topic
Different colors for internal and external links
7 replies · Started by Bernhard on May 28, 2021
Hello,
I use the following code to define a different color for external links than for internal links:
p a:not([href*="tourist-in-rom"]) {
color: #7000CC;
}Now I have the problem that my ads, for statistics, have a link like tourist-in-rom/linkout/*but these are also external links.
How can I define this group of external links with the color #7000CC?
Thank you.
Hi Bernhard,
Could you show me which ad is having this link?
Let me know :)
Hi Ying,
the second link here, "Leihwagen bei Check 24"
Not sure if I fully understand. That links inherit the color setting from the customizer (Colors > Content).
I think one way you can try changing it is to add a headline block for the link so you can use the color setting there:
https://docs.generateblocks.com/article/headline-overview/#colors
Hi Leo,
this is an interesting solution, but I would like to use a generic css for this, if possible.
I have the link color defined in the customizer. But I would like to have different colors for internal and external links, and therefore I use the rule
p a:not([href*="tourist-in-rom"]) {
color: #7000CC;
}for the external links color and this works so far.
The only problem I have is, that I have external links that are redirected for statistics, and these links begin with https://www.tourist-in-rom.com/linkout/ like https://www.tourist-in-rom.com/linkout/12345. With the rule above they have the color of internal links, as they contain "tourist-in-rom". I therefore would need a css to define the color #7000CC also for these links.
I'm not sure if we can use the :not selector to be that specific unfortunately.
The page you've linked is an error404 so I don't see any content.
Maybe you can add a custom class external for external links so that your CSS can be:
p a.external {
color: #000000;
}OK, thank you :)
No problem :)
