A Coil Workaround — Adding an Upvote Button to an External Website

I have been publishing articles on my blog for a while now and I am very happy with using Coil to give this new kind of web monetization a try.

The only thing that is definitely not ideal at the moment is that there is no way for people to directly upvote my articles on Coil, once they clicked through to my website.

A reader of one of my articles and fellow Coil blogger @mirrae pointed that out again in a comment under my latest Coil income report article:

So I was really thinking for a while if I could come up with some way to connect my articles a bit closer with the upvote function on the Coil platform.

The result of my efforts is this small button, which I will now include at the end of all my new articles on my blog:

It's really just a simple workaround for a more complicated problem. But I had a lot of fun thinking about a solution and coming up with this small quick fix.

In the following, you can read how I made it and what it actually does.

How-to Guide

Step 1 — Create Button Vector Files

I wanted to make the button quickly recognizable for any Coil user. Therefore, I wanted to keep them in the same design as the upvote button here on the Coil platform.

I think that worked out quite well:

Feel free to use them!

Step 2 — Create the Button Module

I actually used an image module from the Divi theme to make the button work. In the settings I can enable the option to pick one image for the normal state and one image when the mouse is hovering over the module. That actually makes the arrow turn blue on hover — it simply replaces the whole image.

Depending on what theme you use for WordPress, the process might be different. But changing an image when hovering with the mouse, should not be too difficult to do on any theme and with some small research and the necessary CSS snippets.

Unfortunately, I couldn't find a better option for that step. The only way for now is sending people back to my profile, where they can see all of my posts.

But since the latest post is always shown at the top, that is a sufficient solution for now for me.

It's just a small experiment anyway and hopefully we will have a better solution in the future.

I have set the button to be only visible to active Coil subscribers, as there is no real point in showing it to someone else. Coil subscribers can find the fourth and last step to achieve that below. 👇

If you are curious and want to see the button in action, just check out the latest article on my blog, where I implemented it for the first time.

When you refresh while seeing the button, you will notice that it takes a short moment to appear — that's the time it takes for the monetization process to start and for the script to detect it.

And that's it for this little Coil functionality workaround. 😁

Until next time! 👋

FYI — I'm tracking my income with Coil through my website each month in my monthly Coil income reports. If you're interested in giving Coil a try, this might be interesting for you to follow. 🔍

💻 Check out my Blog

🔔 Follow me on Coil

📺 See my videos on Cinnamon

📺 Subscribe on YouTube

🐦 Reach out on Twitter

Continue reading with a Coil membership.