Creating a button that links to your blog

This article is about how to make a button for your blog that other people can put on their blog or website.

Why is this needed?

Occasionally, someone may ask you to give them a "button" for you blog that they can put onto their own blog or website, instead of just using a boring linked-list or Blogroll entry.

Really, a button is just a picture and some HTML code that says "show this picture, and when someone clicks on it, go to this website".

If they need to ask you for this (as opposed to just asking your permission to use your logo), they probably don't have the skills to make the code and/or picture themselves.   So if you want to be helpful, and if you're interested in having them help to promote your blog  (and you probably are interested), you will need to do most of the work.

How to make a button for your blog:

1 Make or choose a picture to be your button.  

This could be your icon or title-image, if you have one, or any other image file that you own or that is not copyright to someone else. 

Make sure that it's saved as a fairly small size file, but still looks good on screen.   If you want to be particularly helpful, you could ask the other person what size of button they would like, and make you picture the same size.

You could use the Blogger icon as your button but:

• It may not be the image your want to represent you, and 
• The other person may be breaking Google's rules if you do - check the current roles at Google Permissions

2 Upload your picture to an image hosting service

Blogger stores photos in Picasa web albums, but you can use any file-hosting service.  Ideally it should be somewhere that will exist for as long as your blog exists.

If you are using Picasa-web-albums, make sure that the security of the folder where you've put it is either "Public on the web" or "Anyone with the link" - not "Private"

Make a note of the URL of the picture (not the album) after you've uploaded it.

3 The code to use is like this:

<a href="THE URL OF YOUR BLOG" imageanchor="1" >
<img border="0" src="THE URL OF YOUR IMAGE"  alt="Link to YOUR BLOG TITLE"/>
</a>

Or, if you would like the other website to stay open and your blog to open in a new tab or window:

<a href="THE URL OF YOUR BLOG" target="_blank" imageanchor="1" >

<img border="0" src="THE URL OF YOUR IMAGE"  alt="Link to YOUR BLOG TITLE"/>
</a>

To make this code work for your blog, you need to change:

• THE URL OF YOUR BLOG
• THE URL OF YOUR IMAGE
• YOUR BLOG TITLE

to the correct values for your blog.

Installing your button

The method for installing your button on the other person's website depends on what tool they are using.  

If they are using Blogger, they have several options for installing third-party HTML (which is what you have made for them).

If they are using some other tool, they may need to consult the manual, or help forum, for that tool.

A warning about copyright

Copyright law applies to blogs, just like it applies to all created things.

If you make yourself a logo, then you own the copyright of that logo.   But if you make a copy of it available to someone else, then legally you may be implying that they are welcome to use it - details of this depend on the law in your country, and perhaps the laws in the country where you file-host is, and where Google is located too.

Notice that the method I have suggested gives you control over the image file that you've provided:  if you want to change the image later on, you can provided that the replacement gets exactly the same file location as the original file had.   (Google Sites file-stores currently do work this way, provided replacement files are makde by by uploading a file with the same name as the original had.)

If you use someone else's imagine as your button, make sure that either you have the owner's permission to use the picture, or that it is in the "public domain".

---

Related Articles:

Finding a picture's URL in Picasa-web-albums

File-hosting services

Putting 3rd party HTML into your blog

Copyright, blogs and bloggers

Linking your blog to the Social Networks.