This tutorial shows you how to make a button and how to add that button to your blog.

How to Make a Button

There are a bazillion websites out there to make a button for free. You can buy buttons too, but I’m a cheap-ass so I will make them for free until I am publicly humiliated and no longer have a choice but to fork over the dough. The place I go for free buttons is Da Button Factory.

Go to Da Button Factory website. You will see this screen:

Enter the text you want on your button in the space labeled “Text”. When you press TAB you will see your entry take effect in the button to the right. You can also choose from several other options for your button, such as font, color, shadow effect and others. Play around until you’re happy with your the appearance of your button.

Save your button. Click on the link marked “download” and save it somewhere on your computer where you will be able to find it in a minute.

how to make a blog button — click the download link

Now we’re going to add it to your blog. I’ll show you how to add it to your sidebar and how to add it to your blog post.

How to Add a Button to Your Blog

Upload Your Button

Your button has to be stored somewhere on the internet where your blog can access it by its URL. If you have self-hosted WordPress, you can simply add it to your media library.

On your WordPress Dashboard, click Media, then click Add New

Locate the filename of the button you created and select it. When the picture has loaded into your media library, you will get the following screen. (Make sure to click “Save”)

Make Note of the URL of your button. From the above screen, capture the File URL of the picture by highlighting the entire URL name and COPY it to your clipboard (on a PC this is CNTL-C, on a Mac this is COMMAND-C). Paste it into Notepad (or open a new browser tab, paste into the URL space and press ENTER which will bring up your picture), or put it somewhere so you can easily get it again or come back to your media page later for it. You’ll need this URL for your next step: creating the HTML for your button.

If you need to find your File URL again, just click on Media, then Library, then click on the “Edit” link for your picture:

How to Create HTML for Your Button

Use the following HTML as your template and change the source URL (below in blue) to the one I just asked you to save. Change the destination URL (below in red) to the web page where you want your reader to go when they click on the button.

<a href="http://stickyreaders.com">
<img src="https://www.stickyreaders.com/wp-content/uploads/2012/03/button-press-this-pal.png" alt="" /></a>

If you wish to center your button, add HTML center tags like so:

<center>
<a href="http://stickyreaders.com">
<img src="https://www.stickyreaders.com/wp-content/uploads/2012/03/button-press-this-pal.png" alt="" /></a>
</center>

Now you’re ready to add it to your blog.

How to Add Button HTML to Your Blog

Add Button to a Blog Post

If you want to add this button to a blog post, go into edit mode for your blog post. Make sure you are in HTML mode instead of VISUAL mode (in WordPress, click on the tab labeled “HTML”.)

Insert your HTML and save your post. Preview your post to verify.

Add Button in a Widget

In WordPress, click on Appearance then Widgets.

Under Available Widgets, Click on the Text widget and drag it into the area you wish it placed. In the example, we are putting some Text into one of the sidebars.