Adding the “Pin It” button to blogger

How to add a customized Pin It button to a blogger blog at ourthriftyideas.com

Ok guys, I LOVE to go to other’s blogs and check out the amazing creativity they have. And not only do I love to look at them, I love to share, comment and especially Pin your/their stuff. But lately (especially when it is warm outside) I like to do my blog surfing from the park, in the backyard, and on the go. But when I am doing that, I am doing it from my phone.
It gets really hard to pin items from your phone if there’s no “Pin It” button on the blog post. Now I’m not talking about the new and popular “hover pin” button. Although this is cool, you can’t use it on your phone.
How to add a customized Pin It button to a blogger blog at ourthriftyideas.com
So today I am going to share with you how to put that little red button onto your site!!
How to add a customized Pin It button to a blogger blog at ourthriftyideas.comHow to add a customized Pin It button to a blogger blog at ourthriftyideas.com
First and foremost, you need to bookmark the pin it for business page. This is where you will always create your pin it button.
On this page you will paste your blog post’s URL as well as the URL of the picture you want to be pinned. Now how do you get those?
How to add a customized Pin It button to a blogger blog at ourthriftyideas.com
On your blogger edit screen (where you write and edit your post) there’s a “permalink” spot on the right hand side. This is where you can customize your URL (which I highly recommend to include your keywords). You can also copy it from there to post into the Pin It site.
Now, the Image URL is super simple. You just right click the photo in your blog post, and click Copy image URL. Then paste it into the appropriate section on the Pin It site.
Next you will write a description. This is what you want it to say when the person pins your picture. Ya see, people, myself included, are lazy. So they will just go with whatever you write here. I suggest keywords from your site, writing it in the 3rd person so it sounds like an actual conversational pin, as well as putting in you site (ourthriftyideas.com). This will create a click thru link to your site automatically.
How to add a customized Pin It button to a blogger blog at ourthriftyideas.com
At the top of that page you can pick to have a counter on top, to the side, or no counter at all. Select which one you want then hit BUILD IT.
How to add a customized Pin It button to a blogger blog at ourthriftyideas.com
Now it will make your code.
Note: if you have never done this before, you will need to add the bottom HTML to your site. But once it is there, you wont need to do it again!

Now you will copy and paste the first HTML into your page where you want it to appear in the post. To do this just switch from “compose” to “HTML” and paste it at the very top of the page (or below your photo) then put in a <br> so that it enters in a line break.
I usually add the code at the top of my post, by the first picture, then again at the bottom near my closing. That way someone can pin it from either place.
How to add a customized Pin It button to a blogger blog at ourthriftyideas.com

Notice: The pin it button will NOT show up in the edit screen. But once you preview your post, you can see the button.

Ok, now are you going to start putting this button one your site? PLEASE? Make sure to bookmark the pin it build site….NOW

  
 

If you use one of my tutorials, I’d love to see. Send me a link or picture to
Vanessa {at} OurThriftyIdeas.com
I link up here

post signature

blue line

Comments

  1. You do it just like me. 🙂

  2. You’re awesome my friend :)!!! Love this !

  3. Thanks for sharing. -Lindsay @ potpourrimommy.blogspot.com

  4. Just used this awesome tutorial and wanted to say thanks! I have been wanting to learn about the Pin it button for a couple of months now and finally got around to it! Hope you are well and thanks again!

Speak Your Mind

*