How to Create a Blog Button

Hello all! I thought I'd mix it up today by giving a bit of help to all you bloggers. If you haven't already got one, here's a tutorial on how to create your very own blog button.


These instructions are for blogger blogs

1. Firstly, create an image. You can create it wherever you want and however you want and in any size. Preferably, make it a size suitable for the sidebar of a blog.

Here are some examples:


























2. Upload to a website, such as Photobucket, Picasa, Flickr, Google+, etc. Or you can create a post and add the image to it, but DO NOT PUBLISH THE POST. Once uploaded, copy the image URL by right-clicking on the image and selecting 'copy image URL'.


Now, there are two options after these two steps. 


Option 1.


This is the way I did it.


Visit: http://www.mycoolrealm.com/sandbox/gbgen/


Follow the steps, and copy the HTML.

Option 2.


Use the following HTML code:



<center>
<a href="YOUR BLOG URL" target="_blank" title="BLOG NAME"><img alt="HOVER TEXT" src="YOUR IMAGE URL" height="150" width="150"/></a> <center>
</center>
<center>
<textarea cols="13" id="code-source" name="code-source" rows="3">
<a href="YOUR BLOG URL"><img border="0" src="YOUR IMAGE URL" height="150" width="150"/></a>
</textarea></center>

1. Replace YOUR BLOG URL with, well, your blog URL.
2. Replace YOUR IMAGE URL with your image URL (I think you get the idea)
3.The hover text is what the viewer will see when they hover over your blog button.
4. The code has a set height and width, but if you don't want this then simply delete the code:
'height="150" width="150"' and it's all good. 
5. And that's all for now, folks!

Well, once finished with either option 1 or 2 go to your blogger dashboard, then to layout>add page element and select 'edit content' then paste the HTML code in. For the title add something in like 'grab my button'. 


Your button should look something like this (remember, this button was made using option 1):





Cranberry Deer

Copy my blog button code if you would like to share my blog!


And that should be all! I hope that helped some of you. If you created a blog button, send it to me or refer me to you blog page in the comments below.


Good luck and have a lovely day!


xx



*HTML Code from Serenity You

2 comments: