Connect Icons

You may have noticed that there are some new icons on the sidebar and some other icons have gone away. These icons are a more organized way for you to stay connected with the blog. Now you can use the

icon to head over to the Life of CK and Nate Facebook page. Here you can like the Facebook page to get updates on new posts and other great links that I come across. (if you are a Linky Follower, you'll get more regular updates through this as I often forget to update my Linky posts) You can also use the

icon to head over to my Pinterest page to see projects that we've done and what projects we want to do. 

If you want to send me an email you can click on this icon.

And finally if you want to follow this blog through the reader of your choice, you can use this icon.

It took me quite awhile to figure out how to do this and so I'm going to give you a quick run down on how I did it.

1. Make your icon pictures. I'm cheap and so I used the program Inkscape to make my pictures. It took me awhile to get the buttons how I wanted them and since every program has slightly different features, I'm going to give the advice of play around with your program and have patience. (For Inkscape I used the font Sans for the Facebook f, and then I made the rest of the symbols using just squares, circles and lines and playing around with borders)
2. Upload your pictures. I use blogger and so I uploaded my pics to my google account but you can use photobucket or other sites.
3. Get your photo's html code. You can do this by right clicking on it and clicking on 'copy image url'. If you paste all of these into notebook then you can save some time.
4. Get your web addresses for your various sites like Facebook and Pinterest and put them into the same notebook page so you have all of your information gathered.
5. Go to your layout and add a html gadget in you sidebar. 
6. Enter your html code for each icon which you can copy below

For Facebook:

<a href= " Your facebook page address" target="_blank"><image src=" Your photo url "  width="35" height="35" border="0"/></image> </a>

For Email:

<a href=" mail to:your email address"> <image src=" Your photo url " alt="Email Me" width="35" height="35" border="0"/></image></a>

For Pinterest:

<a href="Your pinterest url"><image src="Your photo url" width="35" height="35" border="0"/></image> </a>

<a href="Your feed burner address" target="_blank"><image src="Your photo url"  width="35" height="35" border="0"/></image> </a>

You can copy this code and fill in the red section with the appropriate urls (you need the quotes). You can adjust the size of your images using the width and height numbers and you can create a border as well. 

       7.  Save your gadget and preview your blog. If you are happy with your new icons then you

            are done! If you want to adjust the size, then you can edit your code until you're happy.

I am really enjoying my more organized sidebar and hopefully these steps will help save you some time if you are trying to do the same!

Linking To: Hi Sugar Plum, The Great Indoors, House of Hepworths, My Repurposed Life, Our Delightful Home, Five Days Five Ways, Serenity Now, Lovely Etc., The Rooster and the Hen, Six Sisters Stuff, Tatertots and Jello, Wayward Girls Crafts, Twigg Studio, Serendipity and Spice, Ask Anna, Home Stories A to Z, Uncommon Designs, House wives of Riverton, Crafty Texas Girls, Southern Institute