How can I change the color of text links in blog articles

[cbdextra]

Hey guys,

how can I change the color of text links in blog articles? I want to edit the link color only in blog articles. 

I'm using the debut theme. 

Thanks

[Katy]

Hey, there!

Katy here from Shopify. I hope you are well. 

To adjust the hyperlinks within your blog posts only, you can add some additional code to the bottom of your themes Custom Style Sheet.  If you are not familiar with code, before editing this sheet do please test this out in a duplicate version of your theme so that it will not impact your live store. 

If you could navigate to your: Admin > Online store > Themes > Actions > Edit Code > Assets> theme.scss.liquid and from here scroll to the very bottom and paste the following:

.template-article .rte a {
color: green;
}

This targets the achor tags within each of your blog articles. You can then adjust the color to suit your own preferences. 

Do let me know how this goes for you! I also hope everything is going great with your store? I'm not sure at what stage you're at, but we have some tips and tricks which you may find useful here. 

All the best,

Katy
 

[cbdextra]

Great, thanks!

[carlos_silva]

@Katythat's awesome - I'm looking to change link color on my blog posts *and* pages so half the answer is already there.

.template-article .rte a {color: green;
}

I think I only need the extra bits before the 'a' to make the rule apply to pages as well, isn't that right? My theme is also debut.

Much obliged!

[Katy]

Hey, @carlos_silva !

Thanks for chiming in here, and I’m glad that you’ve found it helpful so far.

You are correct, we’ll need to add some code to this to make it work with your pages templates too. To do this we can add an extra line instead which will target the anchor tags for your pages. This should look something like this:

.template-article .rte a,
.template-page .rte a {
color: green;
}

Let me know how this goes for you!

Cheers,

Katy

[carlos_silva]

Thanks @Katy !

There's a tiny mistake in the code where template-pages should be template-page but thanks to you we got the solution. Now I don't need to manually change the color on all those links anymore, so thanks again!! 🎉

.template-article .rte a,
.template-page .rte a {
color: #160b93;
}

[Katy]

Ah thank you - I have corrected that now. 

Glad to have helped you out! 🙂

Cheers,

Katy

[Monica13]

Hi!

This is great:)  May I kindly ask for a code to help change hyperlink colour for HOMEPAGE SECTIONS LIKE: "IMAGE WITH TEXT" TEXTS & "TEXT" (right now my hyperlinks on homepage turn out cobalt blue when I'd prefer black or white)  

Thank you!

[Nestasia]

Hi Katy,

I tried adding the snippet you provided at the end of theme.scss.liquid

For me, this changes the color of the entire text in my blog instead of changing the color of just the hyperlinks. Would you know what I am doing wrong ? I pasted this at the bottom

.template-article .rte {
color: green;
}

I omitted the "a" because Shopify was not allowing me to save the theme when I put an "a". It gives a code error for me

[Soysauce1]

THis code completely - i repeat completely messed up my site. what the heck...