Very Pinteresting: A Button For Your Blog

You might have noticed a little addition to my blog today, a pin it button hovering over all of my images!

Now let me start by saying, blog codes and I have not became friends yet. I am no master to all of the signs, letters and run on symbols that it takes to turn this little piece of the Internet into a work of art.
What I do know is I do research. Google is my bff and I use it for everything. The girls at work even call me the Google master because I can find anything on there at the speed of light.

So while searching and searching for a step by step process that made sense, took me minutes to figure out and was a piece of cake I discovered that my bloggy buddies Kaitlyn and Chelsee had found it!

So if you are a beginner or expert these few steps will connect your blog images to Pinterest and give you a little button that looks like the one below and you can start pinning away!

First right click the image below and save it to your computer

Go to PicMonkey.com and upload a blank color swatch of your choice.
Here is mine if you would like to use it (it looks darker here but it turns out lighter when you upload it)

If you upload your own swatch you will need to crop it to perfect square of 75 x 75.
Then select Frames and Rounded Corners

Next slide the Corner Radius level all the way to the right and click Transparent Corners.
This gives you a circle.

Now go to Overlays and click Your Own

Upload the P image from above and use the color palette to choose which color you want the P to be.
Resize and move the P until is centered and positioned how you want it.
You will then save the image to your computer as a .png file.

Next upload the image to a photo sharing site, for example Photobucket is what I use.

You will now go to your Blogger dashboard, click Template and then click Edit HTML

Locate the code "body". If you hit Control +F to find it, your computer will highlight it for you. Now copy the following this code above body.

Once you have this code copied above "body" you will want to "cut out" the portion that reads this:
"http://i260.photobucket.com/albums/ii28/braswellcoulter/WideOpenSpaces_HeaderPNG_zps79662cc8.png"

Now copy in your own direct link between the quotation marks which can found on your photo sharing site that you uploaded your "Pin It" Image to.

Pin It button on image hover

The highlighted portion is what you will "cut out" and then replace with your own direct code which can be found in your photo sharing site.

Click save and Whoooo Hoooo you are all done!!

This may seem like complete and utter confusion but I promise you if you take these directions step by step you too can enjoy a new Pin It button on your blog!

Feel free to email me with any questions!