How to Add Buy Me a Coffee to Free WordPress Sites

How to Add Buy Me a Coffee to Free WordPress Sites

Last Updated on by Michael Brockbank

Buy Me a Coffee is a great way to let supporters give you tips and donations. But, how does this work if you’re using a free website platform? You’re quite limited in what you can do with certain systems. Today, I’m going to show you how to add Buy Me a Coffee to free WordPress websites.

Now, this should work with any free web host. Essentially, you’re simply linking an image to your BMC account.

And this shouldn’t go against Terms of Service, depending on the web provider. Make sure you read the fine print to prevent your site from being deleted.

Adding Buy Me a Coffee to Free Websites

In this tutorial, I’m assuming you have a free WordPress website and a Buy Me a Coffee account.

Step 1: Have a Button Image Ready

The whole premise behind this method is to use an image that looks like a button. You can do this in a number of ways whether you’re using MS Paint or Photoshop.

Personally, I created a quick button using Photoshop. It took less than 30 seconds and does the job.

Here is an example of my button. Feel free to copy and use it if you’d like.
Buy Me a Coffee Button

In reality, any style of image will do. This means you can make 728×90 banners, 200×200 pictures of yourself, or pretty much anything that strikes your fancy.

Just make sure that visitors understand that it is a button and how they can donate to you by using it.

If you need a free image editing tool, Photopea works just like Photoshop and supports a variety of image file types. You can even edit PSD files in Photopea.

You can also use Canva to create a free banner for people to click. If you use Canva, search for “Leaderboard Ad” as the template. These are the standard 728×90 banner ads.

Step 2: Adding Your Image

For this tutorial, I’m going to just use the small image I made earlier.

Now, there are two areas that will work the best when adding Buy Me a Coffee to a free WordPress site. You can use: a) posts and pages, or b) in the sidebar of the theme.

I’ll show you how to add the button to both of these.

Adding the Button to a Post or Page

Create a new post or page. Or, you can edit one that you already have.

Create New Post

Click the “Add Media” button to upload and add your button image.

Add Media

On the right side of the media screen, scroll down to the bottom where it says, “Attachment Display Settings.”

Use the drop-down next to “Link to” and change the option to “Custom URL.”

Custom URL

If you’re using a 728×90 banner, it’s a good idea to set the Alignment option to “Center” and make sure WordPress is using the “Full Size.”

In the URL field, input your Buy Me a Coffee profile page web address.

BMC Profile URL

You can get this by visiting BMC and looking at your Dashboard. It will be the URL underneath your name. For instance, mine is: https://buymeacoffee.com/writersanctuary.

BMC URL

Make sure you start the URL with “https.” WordPress will default to “http,” which is incorrect for today’s standards.

Once you type in the URL, click the “Insert into post” button.

Insert Into Post

Now, all you have to do is publish or update the post. The button will be available on your website.

Live BMC Button

And now we have a working Buy Me a Coffee button on a free WordPress post.

Anyone can click this and go straight to your BMC profile to donate, tip, or subscribe to your content.

Adding the Button to the Sidebar

Adding Buy Me a Coffee to a free WordPress sidebar is similar to the steps we took above. Only instead of a post or page, we’re adding it as a widget.

In the WordPress dashboard, go to Appearance and click, “Widgets.”

Widgets

The sidebars that are available to you are going to be different with every theme. In this tutorial, I’m using the “Hemingway Rewritten” theme.

However, the steps are the same no matter what theme you use. It’s just a matter of moving a widget into an available sidebar.

Drag and drop the “Image” widget to an available sidebar.

Image Widget

The widget will automatically expand.

Now, you can choose to give it a title if you wish. This will show above your button on the website. For this tutorial, I’m simply going to leave it blank.

Click on the “Add Image” button.

Add Image

Now from here, you just repeat the same steps as you would to add an image for a post or page. That is unless you’ve already added the image earlier. In this case, you can just pick the image from the Media library and add the URL of your Buy Me a Coffee profile.

Once you’ve added the URL to your image, click the “Add to Widget” button.

Add to Widget

As you can see, the widget will show you the URL under the image. If everything looks good, click the “Save” button.

Save Widget

Remember, make sure the URL starts with “https”

Now, you should see a sidebar widget for your Buy Me a Coffee button.

BMC Sidebar Widget

What About the Other Methods for Buy Me a Coffee?

When you’re using the free WordPress blogging platform, you’re extremely limited in what you can do. But, what do you expect for creating a website for free?

The other methods are simply unavailable to you in this instance.

Unable to Install the Plugin

WordPress.com only provides you with some very basic, albeit excellent, plugins. Unfortunately, you’re unable to install the tool for Buy Me a Coffee on a free hosted account.

You would either have to upgrade WordPress.com or move your site to a self-hosted provider. These will vary in price depending on the web host or if you decide to upgrade your WordPress.com account.

But in the grand scheme of things, it’s much cheaper to go with self-hosting.

Unable to Add Code Snippets

When trying to add the code snippet from Buy Me a Coffee to the free page, WordPress stripped away the style coding. I can only assume this is done on purpose to limit what you can do on WordPress.com.

This is because the coding works perfectly on this website, as well as any other self-hosted blog I own.

So, using the code snippet directly from BMC is not going to work in this instance. Unfortunately, I don’t know if it works with other free website platforms on the Internet.

Be Creative with Your Button

If you’re handy with image editing tools, you can create some stylish buttons. I’ve even gone so far as to make a few banners to display instead of ads on my sites.

The main point is to make sure the image looks and feels like a button. You also want to make sure it’s large enough to tap with a finger should one of your visitors do so from a mobile device.

As there are so many free image editing tools out there that work exceptionally well, you’re only limited by your imagination.

Should You Upgrade the Free WordPress Site?

WordPress.com, while being a great system for creating free blogs, is a bit on the expensive side. This is especially true when you consider what you get if you go through self-hosting.

This is when you sign up with a web host such as GreenGeeks to maintain your website. In this instance, you’d use the WordPress.org version of the platform, which is far more intuitive and flexible.

GreenGeeks Web Hosting

Not to mention you’ll save a small fortune.

But if you’re serious about making money from your website or turning it into something grand, you’re much better off with self-hosting.

Start Earning with Buy Me a Coffee from Free WordPress Sites

Although you’re not able to add code snippets or the BMC plugin, you can still make money with Buy Me a Coffee from free websites. Just use an image to create a button and link it to your profile.

And in reality, this method should work with virtually any free website builder.

Make yourself a few flashy buttons and see which ones perform the best. You’ll probably spend more time making them than it takes to add one to your website.

For more information about WordPress, check out WriterSanctuary’s YouTube channel.

Michael Brockbank
Follow Me...

Subscribe
Notify of
guest

This site uses Akismet to reduce spam. Learn how your comment data is processed.

2 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments