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

Highlighted
Tourist
5 0 1

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

 

0 Likes
Highlighted
Shopify Staff
Shopify Staff
740 42 124

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 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
 

Katy | Social Care @ Shopify
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

2 Likes
Highlighted
Tourist
5 0 1

Great, thanks!

0 Likes
Highlighted
New Member
2 0 0

@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!

0 Likes
Highlighted
Shopify Staff
Shopify Staff
740 42 124

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

Katy | Social Care @ Shopify
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

2 Likes
Highlighted
New Member
2 0 0

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;
}

 

0 Likes
Highlighted
Shopify Staff
Shopify Staff
740 42 124

Ah thank you - I have corrected that now. 

Glad to have helped you out! 🙂

 

Cheers,

Katy

Katy | Social Care @ Shopify
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

0 Likes
Highlighted
New Member
1 0 0

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!

0 Likes
Highlighted
Tourist
11 0 1

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

0 Likes