Archived topic
Styling external links
4 replies · Started by David on October 27, 2018
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?