Archived topic
Style external links
5 replies · Started by Atefan on March 21, 2021
Hello,
I found one code, that seems to do the job, I like to archive, to style external links.
a[href*="//"]:not([href*="mywebsite.com"]):after{
content: " " url("https://developer.mozilla.org/static/general/external-link.fb3c293b9226.svg");
}from https://codepen.io/olegip/pen/KLxdME
But, how to exclude now social icons?
when I add the css code 2 times, with another URL, it does not work.
any idea?
instead of the SVG icon, it could have written (EXTERNAL) only too.
somebody now?
Thanks
Hi there,
Any chance you can link us to the site in question?
You can use the private information field.
Let me know :)
sure
This isn't really a theme-related question.
I think the best solution is to add a custom class to the external links so you can target your CSS to those links only.
Sure.
But I hope it helps others, who are SEO concern.
a[href*="//"]:not([href*="mywebsite.com"]):not([href*="youtube.com"]):not([href*="linkedin.com"]):not([href*="printerest.com"]):not([href*="facebook.com"]):not([href*="instagram.com"]):after{
content: " " url("https://developer.mozilla.org/static/general/external-link.fb3c293b9226.svg");
}Thanks for sharing!
