Tag Archives: Blogspot

Add Images or Icons to sidebar links

Sidebars are sometimes crowded with lots of text. There are many ways to make some of the items stand out. In my case, I decided that I will add icons next to the links, to differentiate links from normal text. I will also draw a thin line after each link. To be consistent, the color of these lines shall be the border color.

Note: This is the style we used for our Minima template. Since each type of template has its unique margin, padding and style settings, this guide may not apply to these other templates. You can try to adapt this to your template. Preview the change, and adjust the margins and paddings. Often, a bit of experiment with these values will do the trick. If they still don’t look satisfactory, do not save the template.

First, scout around for a picture that you would like to use. In this site, I have used an arrow image. You can use any photo editing software to reduce the image size to about 9px x 9px; I used Google’s Photo Editing Software Picasa.

After having an image, upload it onto a free server. You can read about using free hosts like Google Page Creator and Google Groups. We also have a rather comprehensive list of free Image Hosts and File Hosting Services in our article on Manage Blogger Image Storage Space. Check out those sites and choose one that is fast, reliable and enables hotlinking to the uploaded files. Take note of the URL of the Image file.