I've gotten a few questions on how to add a grab my badge/button link in the sidebar. It is really very easy to do if you have some basic HTML knowledge.
First off you have to host your button/badge on a third party server such as www.flickr.com
Read more...
First off you have to host your button/badge on a third party server such as www.flickr.com
- Once you have your image hosted, get the URL: http://farm3.static.flickr.com/2695/4190373200_e20fa291a5_o.png
- Go to blogger dashboard and insert a new HTML/Javascript widget
- Title Your Widget - i.e. Grab my Badge!
- Within the content you have to tell blogger what image to display and where to link it to. Here is the sample code:
<a href="http://parajunkeedesign.blogspot.com/"><img border="0" width="90%" src="http://farm3.static.flickr.com/2695/4190373200_e20fa291a5_o.png"/></a>
In the first highlighted that is where you put your URL. The a href= is the HTML code link.
In the second highlighted area that is going to tell the browser what image to display.
ALWAYS remember paste your code between the " " marks.
5. Now it is time for the textarea code
<textarea id="code-source" rows="3" name="code-source"><a href="http://parajunkeedesign.blogspot.com/"><img border="0" width="90%" src="http://farm3.static.flickr.com/2506/4125657740_8bd542db80_o.png"/></a></textarea>
The area highlighted is the same exact code that you worked in early, just wrapped in <textarea> tags.
6. What you need to know about the extras:
- I have the width set at 90% within the code. This is so my button doesn't overpower someones sidebar. If the width is set at 90% you know your button isn't going to be bigger than anyone's sidebar. This has a downfall though, people with very large sidebars, it might stretch your image out and distort it, but I take the risks, because the majority of sidebars don't surpass 250 pixels.
- Secondly I have it set to border=0 this is so a border will not appear around my button and ruin the look of it.
