Site logo

Archived topic

Styling external links

4 replies · Started by David on October 27, 2018

Viewing posts 1–5 of 5

Hi Tom and team,

I am trying to style my external links similar to how Wikipedia does... I added the following to my style.css

a[href^="http://"]:not([href*="holfamily.com"]):after,
a[href^="https://"]:not([href*="holfamily.com"]):after {
content: “(EXTERNAL LINK)”;
padding-left:5px;
}

But nothing changes on the site. I'm just curious if there is anything in the theme or customizer that would prevent the change from showing? Just curious if I have a setting or something that's preventing it from showing.

Thanks for any help!

That code is adding the padding to the :after element. If nothing is there, it won't work.

What happens if you remove :after from the code?

Hi Tom,

Thanks for replying.

I tried removing :after but it still doesn't show the text (EXTERNAL LINK) after external links on the site. Strange eh?

No worries though... it isn't a necessity nor a priority. Just wanted to make sure there wasn't anything in GP conflicting. Thanks Tom :)

That looks like it should work now. Can you link me to a page with a link it should be applying to?

This archived topic is closed to new replies.