016: How to Change Unsubscribe Link Color in ConvertKit

Alright, my friend! You know how to change the link color in your emails in ConvertKit (partly because you saw this quick tutorial: How to Change the Color of Your Links in Your ConvertKit Emails). But that was for the email content. What about changing the color of your unsubscribe link that's sitting at the bottom of your emails?

There are two steps involved here and the both involve code. But no worries, follow my steps and you will be able to accomplish this easily. Afterall, you do want that customize look for your unsub link right? ;-) Believe me, it's worth it and you know what you may fall in love with code - it's magic!!

So go ahead open your custom template and start plugging these codes.

Note: You will first need to create a custom template in ConvertKit. The following steps are applied inside the custom template. I have another video tutorial where I show you how to add social media links in your emails - and in that video (Video 002), the first part shows you how to create a custom template. So watch that video first and then follow the steps below.

Step 1: Add this code under style section of your custom template.

a.unsubscribe-link { color: #16bbb3; } 

Note: #16bbb3 is a green teal color. Put in the hex code that you want here. Don't know what the hex code for your color is? Go to this free tool and look for your color hex code: color-hex.com. 

Step 2: Add code in the Footer section of the custom template.

class="unsubscribe-link"

Add this piece of code ( class="unsubscribe-link") in the footer section at the very end of the template.

Where exactly to place it? Look for the following bit of code in the footer of the template.

<div class='message-content'>
  {{ message_content }}
  <div class="footer">
    <a href="{{ unsubscribe_url }}" Unsubscribe</a> | {{ address }}  </div>
</div>

So it should now look like this: 

<div class='message-content'>
  {{ message_content }}  <div class="footer">   
<a href="{{ unsubscribe_url }}" class="unsubscribe-link">Unsubscribe</a> | {{ address }}
  </div>
</div>

---

Then place this code : class="unsubscribe-link" right before >Unsubscribe</a> | {{ address }}.

Watch video to see how quickly you can set this up. You will also understand clearly where the right spot is to place the code in the template by watching the video.

So, hope that you now can easily change the link unsubscribe link color in your ConvertKit emails! 

If you tried my steps, write  me a note in the comments to share how it turned out!

Peace,
Sophia