Design It Up! (17)

Design It Up! is a feature which helps you learn handy little tricks to tweak up your blog. I have recently received a few emails asking about my “Connect with Me” icons which are located on my sidebar, so I thought today we could tackle this easy tweak.

The hardest part of the “Connect with Me” icons is locating the icons in the first place. To be honest, I did not make any of them aside from the Amazon icon. There are so many icon sets available that you are basically going to want to decide on a theme before you get started. And know what you are looking for.

When I went through the process of redesigning my blog, it probably took me a few days to find the set that was perfect for me. I knew which icons I was looking for, and narrowed it down to the sets that best suited my needs. So do not get quickly discouraged if you cannot find the right set immediately. It may take some time.

Here are some great websites to check out for icons:

These sites are wonderful for a number of reasons. First, they are free. Second, many of them do not have a strict copyright… which means that you are basically allowed to use them as you see fit. However, before you download any icon set and start implementing them on your site, be sure that you read any information regarding the set you are wishing to use. Not all sets are available for reuse and you may need to credit the designer… so please be careful of what you download and post. You have been warned.

Once you have the set you are happy with, all that is left is to add them to your sidebar. And doing this is fairly easy.

1.) Once you have the images, you are going to upload them to an online storage site such as Photobucket. After they have been uploaded, get the URL addresses to the images and put them aside for later use.

2.) Next, log into your Blogger account, if you have not already, and go to “Layout,” then “Page Elements.”

3.) Once there, you will select “Add a Gadget” and then “HTML / JavaScript.” After you have the new gadget area up, we can get started with linking.

4.) Each icon that you wish to display will have its own code. The basic code will look something like this:

So basically your code will have two parts:

Link for the icon (ie. Your Facebook Page)
Link to the icon’s picture

5.) Just put in a new code for each icon. Select “Save” once you have added all your codes and you are done.

Easy Peasy!

________________

Have any HTML questions that you would like featured in Design It Up? Shoot me an email at neverendingshelf@gmail.com.

Kate

Kate is the co-blog owner of The Book Monsters. I am a twenty-something year old who is passionate about reading. I currently hold a B.A. in English and am married to my high school sweetheart. We have two (cat) children, Gracie and Kit, who are total divas. I have an insane and possibly unhealthy passion for reading. You can usually find me with my nose buried in a book.