How to Make a Blog Button

Please note that this is a re-make of an old post.

So you just got started with your blog and you have others asking for a blog button from you. Or you don’t use the amazing Passionfruit Ads, and you have to code your own buttons. Either way this post is going to show you how to make a blog button.

Most sidebar buttons are around 200×200, for tutorial purposes I am going to show you how to make a blog button with this size. If you need a different size you can always resize. 

A free site to make a blog button is Picmonkey.

You are going to click on the “design” section at the top of the page.

start hereAfter clicking “design”, you will see a white square on a new page. On the left hand side, you will resize this square to 200×200.

resize button

button resized

Now comes the fun part, design your button! Try adding a picture in the background or adding gorgeous text. But don’t forget to put your blog name on it!

Voila! blog button finished

Then save this button to your desktop.

I use Photobucket for image hosting, but you can use another site if you feel more comfortable.

Upload the button image to your Photobucket page.

After uploading, click on your image and you will come to a page like this:

photobucket page

In the bottom right corner of the page is a “HTML” link. This is the code that you will copy and paste for the blog button code.

Creating the code

<a href=”YourSiteURL“><img src=”YourButtonImageURL” /></a>

In the YourSiteURL you will put in your blog’s webpage.

In the YourButtonImageURL you will put in the “HTML” link found on your photobucket page.

It should look like this when you are done (using my blog name as an example)

<a href= “http://www.pinkonthecheek.com><a href=”http://s13.photobucket.com/user/mahimah/media/Pink%20on%20the%20Cheek/blogbutton_zps4a4fd74c.jpg.html” target=”_blank”><img src=”http://i13.photobucket.com/albums/a277/mahimah/Pink%20on%20the%20Cheek/blogbutton_zps4a4fd74c.jpg” border=”0″ alt=” photo blogbutton_zps4a4fd74c.jpg”/></a>

blog button

All done!

If you need a grab box with your blog button, see this tutorial

If you should have any questions, please leave them in the comments below.

Comments

  1. Julie DenOuden says

    Love this tutorial…makes it look so easy! Looking forward to meeting you at the Elevate Conference!

  2. says

    thank you very much I am new to blogging and its for my small business and I am so lost its not funny, ok sort of it is. this was helpful for me, now if I can just learn how to customize my layout and page more that would be nice. Its hard to find help that i can understand. Most of the help I find is in blog language that I have yet to learn or is not sticking real well in my brain yet. To much to read and learn at once it seems. Ty again!

    don’t look at my blog.. lol it looks like a 5 yr old did it so far. lol

Trackbacks

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>