January 26, 2012

Add a “Pin It” Button to Your Posts

Follow Kevin and Amanda on Pinterest.

If you scroll down to the bottom of any post here on Kevin & Amanda, you’ll see a “Pin It” button that you can click on to pin the image of your choice onto Pinterest. Adding a “Pin It” button of your own is so ridiculously simple to do! Here’s a quick tutorial that will show you how to automatically add a “Pin It” button of your own down at the bottom of every post on your blog, for Blogger, Blogspot, and self-hosted WordPress blogs.

 

Choose an Image

First you’ll need to choose the image you want for your “Pin It” button. Here’s the one I use. Feel free to right-click and save it to use for your button, too.

How to add a Pin It button to your blog

You can also do a Google Image search for Pinterest Icon for more button options.

After selecting your image, upload it somewhere so it will have its own URL, like Flickr or Photobucket. Here is an example URL:

http://i238.photobucket.com/albums/ff17/kevinandamanda/pinit.gif

Note: Don’t use the URL above — there won’t be enough bandwidth for everyone and you’ll get a red X instead of the button. Bummer.

 

The Code

Here’s the code you’ll use to place the “Pin It” button on your blog.

<a href="javascript:void((function(){var%20e=document.createElement('script');e.setAttribute('type','text/javascript');e.setAttribute('charset','UTF-8');e.setAttribute('src','http://assets.pinterest.com/js/pinmarklet.js?r='+Math.random()*99999999);document.body.appendChild(e)})());"><img alt="Pin It!" style='border: none;' src="INSERT IMAGE URL HERE"/></a>

Paste this code onto your blog (I’ll show you where below), then replace the INSERT IMAGE URL HERE with the URL for your button.

Note: Be sure to place this exact code on your blog, or else it won’t work. You’ll also want to delete the “Read More” link that will appear underneath the code when you paste it.

 

Where to Paste (Blogger/Blogspot)

From your Blogspot Dashboard, click on the  Design tab, then Edit HTML. Click the Expand Widget Templates checkbox.

Use CTRL-F to search for: <div class='post-footer'>. Paste the code right above that.

That’s it! Save and view your blog!

Note: If you need extra spacing between your post and the “Pin It” button, just add
<br /> above the “Pin It” button code. You can add as many as you want, above or below the code, for as much space as you need.

 

Where to Paste (WordPress)

For a self-hosted WordPress blog, navigate to your WordPress Dashboard, look for the Appearance heading, then click on Editor. From there, select Single Post (single.php).

Use CTRL-F to search for php the_content. It might look something like this:
<?php the_content(‘Read more &raquo;’); ?>
. Paste the code below that. Save and view your blog!

Note: If you need extra spacing between your post and the “Pin It” button, just add
<br />
above the “Pin It” button code. You can add as many as you want, above or below the code, for as much space as you need.

 

Troubleshooting

What if the image doesn’t appear? What if I only see a red X? What if it only shows text and not the image?

Double check and make sure the Image URL is correct. It will just show text if there is something wrong with the image or the image URL. For Photobucket, use the Direct Link as your URL.

To test: Copy and paste the Image URL into a new browser window and confirm that the image appears, and just the image — not a webpage with the image on it. If just the image appears, that is the correct Image URL.

Good luck and Happy Pinning!

Find me on Pinterest: http://pinterest.com/kevinandamanda/



See More Posts About: Blog DesignTutorials

195 Comments






1
Mindy January 26, 2012 at 2:27 am

Yeah! Am I the first comment? I guess waking up at 3am paid off! I do visit blogs a lot, but I don’t have a blog. I hae seen the pinterest button a few times, and never paid much attention to it. I just went to that website, pinterest. Okay, I am sorry if I sound dumb, but what is it about? Or, why would someone like me want to visit that site? Thanks Amanda! –Mindy

Reply

2
Terry January 26, 2012 at 6:09 am

Mindy it is soooooo addictive ~ wonderful pictures of food, decortating, craft ideas, fashion – you name it! But then you click on the pictures and go to the original site to find the recipes or the directions of “how to” and DYI!! If you are on Facebook then use it as your sign in and start playing around with it ~ you can set up your own favorites and “Pin it” (save) to make them yours (sharing is the key word here) and you can Pin It to Facebook too. It is FUN!!!!!!

3
Tina January 26, 2012 at 5:29 am

Thank you Amanda!

Mindy, I am kind of new to Pinterest myself. It’s a website where you can “pin” web pages you like so you have them all in one place to refer back to. In the words of the person who got me hooked “anything and everything you love that you can find on the internet can be pinned to your profile in one spot. You will never lose those items you loved so much you found while browsing online!”

Hope that helps.

Reply

4
Barb January 26, 2012 at 7:33 am

Amanda,
Is it possible to follow your boards? I love looking at Pinterest! So many great ideas. I do think I am addicted! Thanks! Barb S

Reply

5
Amanda January 26, 2012 at 10:43 am

Hi Barb! Here is my Pinterest board:

http://pinterest.com/kevinandamanda/

See you on Pinterest!! :)

6
Sally January 26, 2012 at 7:34 am

Oh HOLY COW. Thank you so much. Here, I thought I was adding a “pin it” button using the “help” menu from Pinterest — but I was going about it all wrong — and no images were coming up. I just followed your steps, and got the button on my blog — then tried pinning and got IMAGES!!!!!! Success. Thanks Amanda! Have a great day! ~Sally

Reply

7
Jen Jen April 2, 2012 at 12:23 am

I am not sure what I did wrong but now your info to the link is at the bottom of my blog and I cannot remove it :( not sure what to do..

8
Emilie January 26, 2012 at 7:52 am

Thank you so much for sharing Amanda, I’ve been wanting to do this!

Reply

9
Urban Wife January 26, 2012 at 8:25 am

Thanks, Amanda! This tutorial was helpful although I just want to let you know that the Blogger platform looks quite different now and it might be confusing to someone who isn’t sure where to find the ‘Edit Template’ tab. Anyways, I found it for mine but had to poke around first. Have a great day! :)

Reply

10
Amanda January 26, 2012 at 10:44 am

Oh, that’s weird! Since I don’t use Blogger, I just created an account yesterday to do the tutorial. So glad you found it anyway! :)

11
Kendra January 26, 2012 at 8:41 am

Thanks for the help. I was trying to figure this out yesterday and figured out how to get 1 image pinned in my posts but you helped me get it so that the reader can choose what to pin. This came at the perfect time!
Kendra

Reply

12
Sally January 26, 2012 at 8:56 am

Amanda,
I don’t know if you can help with this… I’ve got my “pin it” button installed, but it shows up AFTER my LinkWithin gadget. I wish it would show up BEFORE. I’ve tried removing the LinkWithin gadget, and adding after the pin button — then re-adding the LinkWithin — not on my template, but in my Edit Layout. Any tips for me? I’m not much of an HTML girl — just following your instructions… =) Thanks! ~Sally

Reply

13
Sally January 26, 2012 at 9:37 am

Think I’ve figured it out. Thanks anyway! =)

14
Amanda January 26, 2012 at 10:45 am

Yay! I’m glad you figured it out!! How did you do it?

15
Amira February 9, 2012 at 2:31 pm

I’m having the same problem! Sally, what did you end up doing to fix it?

16
Amanda February 9, 2012 at 2:34 pm

Amira, Sally replied later in the comments, here is a link to her comment (currently comment #32)

Sally’s Reply

17
Meagan Wied January 26, 2012 at 8:57 am

THANK YOU! This tutorial is so easy and I’m so excited that you took the time to post this for the rest of us!

Reply

18
Heidi January 26, 2012 at 9:00 am

Thank you SO much for the tip!

I’ve been following your blog for over a year and LOVE LOVE LOVE it :)

Reply

19
Gina @ Running to the Kitchen January 26, 2012 at 9:02 am

Great post! Quick question though (because I just did this) is there any downfall to using a pinterest button plugin instead on wordpress? It was even simpler than all this by literally just installing and activating and then choosing the placement to be either top or bottom of the post.

Reply

20
Amanda January 26, 2012 at 10:48 am

Hi Gina! I’m sure the plugin is totally fine, but for optimal Wordpress speed and performance, my host recommends using as few plugins as possible. So if I can do something myself, I do, instead of using a plugin. :)

21
Tami January 26, 2012 at 11:16 am

Gina, I was wondering where you found the plug-in and what is it called (the one I found doesn’t work and neither does this tutorial since I have Wordpress blog that is not self-hosted)? I think I would go the plug-in way too, if I can get it work! ;)

22
Gina @ Running to the Kitchen January 26, 2012 at 11:19 am

Tami- I don’t believe plugins work on non-self hosted WP sites. But the one I use is called Pinterest “Pin It” button.

23
Tami January 26, 2012 at 11:27 am

oh, shoot. I do have a self-hosted blog…got the terminology mixed up. :-\

24
Megan Z. January 26, 2012 at 9:03 am

Hi Amanda, You read my mind! I was just thinking the other day, “How can I get a Pinterest icon on my site?” Thank you so much for sharing this information and taking the time to explain it – your tutorials are always so helpful! And especially thanks for giving us the go-ahead to use the “Pin It” icon on our own blogs/websites! Have a great day!

Reply

25
The Mrs @ Success Along the Weigh January 26, 2012 at 9:08 am

Once again you save the day! I’ve been curious how to do it but honestly, too lazy to look it up! :-\

Reply

26
jennifer January 26, 2012 at 9:08 am

This may be a silly question. My wordpress ‘Appearance’ menu doesn’t seem to have an ‘Editor’ option. Am I missing something?

Reply

27
Anne January 26, 2012 at 9:27 am

Yes, I agree with Barb – are you on Pinterest? – I would love to follow your pins as I love your blog!
I seems as Pinterest got rid of their search button and you can now only search for people through Facebook.

Reply

28
Amanda January 26, 2012 at 10:49 am

Hi Anne! Here I am on Pinterest:

http://pinterest.com/kevinandamanda/

See you on Pinterest!! :)

29
Amy Owens January 26, 2012 at 9:44 am

Thank you so much for the clear, easy explaination!

Reply

30
Amy Owens January 26, 2012 at 9:45 am

Thank you so much for the clear, easy explanation!

Reply

31
TheFoodGospelAccordingtoRuth January 26, 2012 at 10:04 am

Thanks so much for the tutorial! It worked!!! Love your blog and thanks again for your step-by-step visual!

Reply

32
Jess January 26, 2012 at 10:30 am

Thank you soooo much Amanda. I have been trying to figure this out for a while and you helped so much!

Reply

33
Sally January 26, 2012 at 11:19 am

Hi Amanda!
I did a search and found this link: http://mayura4ever.blogspot.com/2011/06/how-to-position-elements-on-blogger.html which showed me how to reposition the html code for my “pin it” button.

I’ve noticed that it (the button) moves around a little for each post — depending on if my post ends w/ a photo, another button, or text — but that’s okay w/ me – as long as it’s before the LinkWithin.

Thanks for checking back w/ me! ~Sally

Reply

34
Ashley Urke | Domestic Fashionista February 15, 2012 at 6:28 pm

Thank you! Very helpful! Just added mine above linkwithin as well!

To get space between the button and your post, like Amanda mentioned, just add before the code and it will add a break between your post and the button. I added two breaks so there is a cushion of space between the post and button!

With a little work from us all, we all figured it out!!!

35
Sandra January 26, 2012 at 12:03 pm

can u have a pinterest account without a twitter or Facebook account? i did get an invite but have no idea what to do

Reply

36
Theresa January 26, 2012 at 12:10 pm

You have the best tutuorials!!! Thank you so much.

Reply

37
Sabrina @ Customized Creations January 26, 2012 at 12:18 pm

This is fabulous! Thank you so much! I have been adding the pinterest manually to each post everytime I make one. Now I don’t have to. Thank you SO much!

Reply

38
Anna January 26, 2012 at 1:39 pm

Thanks for the great tutorial. I have been trying to figure this out for a couple of weeks! I did everything that you said on my blogger account but I am not sure how or when the PIN IT button will appear. Could you advise. I wasn’t sure if i needed to do something or if it should just appear.
thanks:)

Reply

39
Amanda January 26, 2012 at 11:33 pm

Hi Anna! If it was done correctly, the Pin It button will show up immediately.

40
Marla January 26, 2012 at 1:50 pm

Thanks, Amanda! Love this! I’d +1 it, if I could. In fact, that would make another great tutorial for you to write. ;p

Reply

41
Erika January 26, 2012 at 2:29 pm

Thanks so much! This was incredibly easy and so helpful!

Reply

42
Brenda@sugarfreemom.com January 26, 2012 at 5:41 pm

Thanks! Just a question, if I want it on every post from now on, do i need to do it manually each time or does it automatically work?
BTW, just got in my samples of swerve, what did you think of it?

Reply

43
Amanda January 26, 2012 at 11:32 pm

Hi Brenda! As the tutorial says, it will automatically add a “Pin It” button down at the bottom of every post on your blog. Hope this helps! :)

44
lisa January 26, 2012 at 5:43 pm

Thank you so much! I have tried this several times with other tutorials, but they didn’t work! Now it works, BUT my pinit button just says pinit..no red ,,no box. weird! wonder why it did that? any ideas??

Reply

45
Amanda January 26, 2012 at 11:31 pm

It will just show text if there is something wrong with the image or URL.

46
Rita May January 26, 2012 at 6:50 pm

first instruction question: right click Pinit button and then what? where do I save it (Iphoto?) (Downloads?) and then what do I do with it and where do I put it? Is this so that readers of my blog can easily pin my pictures to their Pinterest boards? That’s what I assume. Also how do you add Pinterest to the share buttons at the bottom of my posts along with facebook, google etc.? This would be great to do. Thanks for getting me started.

Reply

47
Amira February 9, 2012 at 3:40 pm

Hi May, I just rightclicked the image and saved it to my desktop. It really doesn’t matter where you save the image, just save it in a place you will remember. Then, using Amanada’s recommendation, I uploaded it to photobucket so that I could copy the code. I just followed the rest of her instructions above! Hope that helps!

48
Katie@MyDarlingDays January 26, 2012 at 6:57 pm

Thank you much for sharing this, i just added mine!! {I had been wanting to do that for a while :)}

Reply

49
Terrie R. January 26, 2012 at 10:33 pm

Thanks for the VERY useful tip! I was wondering how they got that button on every post. It’s going on my next one for sure.

Reply

50
lisa January 27, 2012 at 12:29 am

Thanks for responding. I used your pin it image and saved it to my desktop then uploaded it to Flickr. Any ideas? thanks!

Reply

51
Amanda January 27, 2012 at 12:40 am

I would double check and make sure the Image URL is correct — it will just show text if there is something wrong with the image or the image URL.

To test: Copy and paste the Image URL into a new browser window and confirm that the image appears, and *just* the image — not a webpage with the image on it. If just the image appears, that is the correct Image URL.

Hope this helps! :)

52
Catherine January 27, 2012 at 10:26 am

Thank you so much! I am going to work on this little project tonight… Would you be open to sharing how you put “Leave A Comment” on the bottom of your posts in Google Reader? I think that is a stroke of genius! Would love to know how you did it! Thanks so much :) -Catherine

Reply

53
Amanda January 27, 2012 at 11:23 am
54
Farmgirl Susan January 27, 2012 at 1:28 pm

Hi Amanda,
Thanks for another great tutorial. And perfect timing – just yesterday a bunch of us on Blogger were trying to figure out how to install the pin it button on each of our posts. Your instructions were easy to follow and worked – sort of. Unfortunately this is the same issue we’ve been struggling with – and haven’t solved yet.

So a heads up for those on Blogger who use the instructions above:
If you’re on the homepage and click on the pin it button in a post, the pin you create will link back to the homepage, NOT the permalink page the image you pinned is located on.

And even if you use the ‘read more’ page break option, the pin it button will still show up on each post on the homepage (right below the ‘read more’ link), so if somebody clicks on the pin it button while still on the homepage, the pin will link back to the homepage, not the permalink page.

Maybe there’s a way to somehow have the pin it button only appear on permalink pages? Although it wouldn’t be a great solution for those of us with several short blog posts always appearing on the home page.

We’re still trying to hopefully figure out a perfect solution on our end. In the meantime, thanks again for all the wonderful and helpful things you blog about! :)

Reply

55
Sarah April 1, 2012 at 11:36 pm

I noticed this EXACT problem and was curious about it too. Hmmm……. well, if you figure it out- let me know. I’m super confused now. :) But I guess something is better than nothing!

56
Jennie B April 1, 2013 at 1:01 pm

Was just searching these comments to see if anyone had figured out a solution to this.

57
Candise April 6, 2013 at 2:26 am

I’m struggling with the same thing tonight – trying to figure out how to pin individual posts.

58
lisa January 27, 2012 at 2:31 pm

thanks amanda, got it to work :)

Reply

59
Kara January 27, 2012 at 7:11 pm

Thanks so much for this tutorial. I love how simple and easy you make your blogging tutorials. I never worry that I will mess up. :)

Reply

60
Kimberly January 27, 2012 at 11:08 pm

Officially addicted to your site! Added the Pin it LOVE IT!

Reply

61
Alicia January 27, 2012 at 11:22 pm

I have Wordpress and I was able to follow along until I tried to find the code mentioned. Within the single php the code you mentioned didn’t exist for me? Any suggestions?

Reply

62
April @ sewing novice January 28, 2012 at 8:15 pm

Thanks so much for the tutorial!!!

Reply

63
Candi January 28, 2012 at 9:13 pm

I have been trying to do this all week. I just see your post came up in search. It worked perfect and i learned something about coding.

Thanks.

Reply

64
Kelli January 29, 2012 at 3:46 pm

Great tutorial! I followed it exactly and in less than 10 minutes my pin it button was up and running! Thank so much!

Reply

65
In this wonderful life January 29, 2012 at 8:11 pm

Hi Amanda! :) Thanks SO MUCH for the tutorial! Can I ask how to get the pin it image above my “link within” widget at the bottom of each post…and centered? Thank you!

Reply

66
Amanda January 30, 2012 at 11:07 am

To center, add centering tags around the code, like this:

<center>INSERT THE PIN IT CODE HERE</center>

And here’s how another reader moved her Pin It button above the Link Within widget:

http://mayura4ever.blogspot.com/2011/06/how-to-position-elements-on-blogger.html

(Check out comment #30)

Hope this helps!! :)

67
Tricia January 29, 2012 at 9:05 pm

Hi Amanda!!

Thanks so much for your instructions!! I’m just starting to blog and my photos aren’t that great but I still think it’s neat to have a pin it button. I enjoy reading your blog and learning lots from ya!

Thanks again!!

Reply

68
Michelle @ The Purple Pumpkin January 30, 2012 at 12:57 pm

Thank you so much for this Amanda! I have been wanting to add a Pinterest button for a while, and the AddThis one seems to break my code for my other sharing tools! With your easy steps and pictures I’ve added it successfully!

Reply

69
brenda brown January 30, 2012 at 7:49 pm

Thank you! I posted about this on my blog with a link to this post and gave you two credit!
http://thesmallthings89.blogspot.com/2012/01/how-to-add-pin-it-button-to-your-posts.html

Reply

70
Meghann January 30, 2012 at 10:26 pm

THANKS!!

Reply

71
Janet January 31, 2012 at 3:48 am

I just added a pin it button to my blog and it was so easy to do with your tutorial. Thanks so much!

Reply

72
Lorie February 1, 2012 at 8:45 am

Thank you for the tutorial! I tried it and it worked perfectly! :)

Reply

73
Luci February 1, 2012 at 11:52 am

Thanks for this! I was able to add a Pin It button to my Blogger very easily. :-)

Reply

74
Nina February 1, 2012 at 3:03 pm

Hi!…I’ve created a blog where I will include all the Freebies and Tutorials related to Blog design, of course with link to the authors…Here is yours. Thanks for the tutorial
http://everythingblogdesign.blogspot.com/2012/02/kevin-and-amanda-add-pin-it-button-to.html

Reply

75
teresa kline February 2, 2012 at 12:22 pm

FINALLY, I got it, not all images can be resized and used…that was my problem. I did not get a cutsie one like I wanted, but it will have to do…thanks!

Reply

76
Maura February 2, 2012 at 5:02 pm

Okay, so I am so frustrated;) I followed the directions to a tee and I did get a “pin it” button. However, it just says “pin it” w/ an X in a box. There isn’t actually a red pin it button. I am not very computer savvy for sure. I just want to cry at this point. Do you have any suggestions? I want it to say “Follow Me On Pinterest” and I am using photobucket. Please Help. Thanks

Reply

77
Amanda February 2, 2012 at 5:15 pm

Double check and make sure the Image URL is correct. It will just show text if there is something wrong with the image or the image URL. For Photobucket, use the Direct Link as your URL.

To test: Copy and paste the Image URL into a new browser window and confirm that the image appears, and *just* the image — not a webpage with the image on it. If just the image appears, that is the correct Image URL.

Hope this helps! :)

78
Maura February 2, 2012 at 7:41 pm

Thank you for getting back to me…I will try it and see if it works:)

Reply

79
Susannah February 3, 2012 at 9:09 pm

So do you have to create a Flickr or Photobucket account or page to “save” the pin it button? I don’t have either, and I’m just wondering before I create it. Thanks!

Reply

80
Amanda February 3, 2012 at 10:05 pm

Hi Susannah! You have to have somewhere to upload and save the image, so you will have an online URL to the image so everyone can see it. It doesn’t have to be Flickr or Photobucket, but those are the two most popular sites. :) You could probably upload it to your blog as well. Hope this helps!

81
Roxana GreenGirl { A little bit of everything} February 5, 2012 at 7:21 pm

Hi Amanda
Thanks for sharing this wonderful tutorial. Is there any way I can have the Pin it button above the post itself? Right now I’m adding it manually and it’s a little time consuming. There’s a “pin it” plugin for Wordpress, but it still shows up at the end of the post :(

Reply

82
Amanda February 5, 2012 at 7:30 pm

Hi Roxana! For the Wordpress instructions, try adding above “the content” instead of below. Hope this helps! :)

83
Roxana GreenGirl { A little bit of everything} February 5, 2012 at 7:57 pm

it’s working! Thanks Amanda! You’re the best!

84
Amanda February 5, 2012 at 8:01 pm

Yay! So glad it worked :)

85
The Lacquered Lady February 5, 2012 at 7:43 pm

Thank you so much for this! I have been looking for instructions everywhere!

Reply

86
Sharon February 5, 2012 at 10:20 pm

Thank you soooooo much! I’ve been trying to do this with the instructions on Pinterest and only succeeded with the follow me button on my sidebar. This is awesome! Yes, let’s feed the Pinterest frenzy even more, huh? lol!

Reply

87
KIM February 7, 2012 at 1:50 pm

I went to SEVERAL websites and blogs trying to find out how to do this and yours was the ONLY one that made any sense. THANK YOUUU!!!!!!

Reply

88
Kim M February 7, 2012 at 8:05 pm

Ok, so one question… Where do I get the URL for your button? Not quite sure what that means here. I tried my blog URL and that didn’t work. What am I doing wrong?

89
Julie Florida February 7, 2012 at 7:59 pm

Do you know how to resize the image? I found a great photo from here:
http://www.buymodernbaby.com/IconPinterest.jpg
and on that site it’s a cute little button, but on my blog it’s HUGE! I don’t know what happened!

Thanks!

Reply

90
Mrs. Jennifer Lynn February 20, 2012 at 1:44 am

I use Photobucket.com to resize all of my images and its free to sign up!

91
Chelsea ONeal December 10, 2013 at 8:02 pm

Did you find out how to resize an image?? I have the same problem.

Thanks

92
Julie February 8, 2012 at 9:25 pm

Thank you soo much! I’ve been racking my brain trying to add a PinIt button to my blog and your advice was the only one that worked for me! You have saved me many grey hairs!

Reply

93
Jessica February 9, 2012 at 5:31 pm

Thank you!! That was so easy and so helpful!

Reply

94
Mama Laughlin February 10, 2012 at 12:54 pm

Thanks Amanda.
I did everything correctly and have a nice little “Pin It” button on the bottom of each post now, but my readers have been saying it’s not working.
So I went to view my blog and clicked on the “Pin It” button myself and a little pop up window comes up that says
“Sorry, we can’t see any big images or videos on this page” and doesn’t load the Pinterest page.
What’s up??

Reply

95
Amanda February 10, 2012 at 1:03 pm

I think it might have something to do with the link — it’s opening it in a new window. The new window is blank, therefore it doesn’t see any images or links on the page to pin. I noticed that all the links on your page, even the Archives, will open in a new window. Is there a setting on your blog that makes it do that?

96
Mama Laughlin February 10, 2012 at 1:16 pm

Yes, there is.
I just changed it to do that a few weeks ago because anytime you’d click on a link within one of my posts it wouldn’t open a new window, therefore readers would lose their place.
This is where I got the code to open all links in new windows…
http://blogging.nitecruzr.net/2008/02/make-all-links-open-in-new-window.html

Am I going to have to disable this if I want the Pin It button to work??
There’s no way to have both?

Reply

97
Amanda February 10, 2012 at 1:21 pm

You can try adding a target attribute. It will attempt to overwrite the “open in new window” code you have installed.

At the beginning of the “Pin It” code you have this:

a href="javascript:void ...

Try adding this:

a target="_top" href="javascript:void ...

I am not sure if this will work, but it’s worth a try. Good luck!

98
Mama Laughlin February 10, 2012 at 1:20 pm

I did take that link out of my HTML and now the PIn It button is working fine… I just wish there was a way to have both!

Thanks Amanda!

Reply

99
Mama Laughlin February 10, 2012 at 1:32 pm

It worked! Thank you Amanda!!!

Reply

100
Terri February 10, 2012 at 5:42 pm

Thank you so much for the tutorial. I have been trying to figure this out for a while. :)

Reply

101
Angela Henderson Wood February 13, 2012 at 2:12 am

Awesome. Thanks.

Reply

102
Tiffany February 15, 2012 at 10:38 am

This is a great tutorial!! Thank you for your easy explanation!! Works perfectly :)

Reply

103
Shel February 15, 2012 at 3:47 pm

Thanks so much for this great tutorial–so easy to follow.

Reply

104
Pam Ostler February 18, 2012 at 3:28 am

Hi Amanda,

I tried following your steps and have not had any success. I do have the new version of blogger dashboard so things did look a little different. I’m wondering if I’m missing a bit of the code because when I look at the post it runs into the adds on the side. Could you copy the code into a comment box for me?

Maybe that will help.

Thanks so much!

pam

Reply

105
Mrs. Jennifer Lynn February 20, 2012 at 1:57 am

When I click on a individual post to pin (so it will link back to that particular post & not just the homepage) when it does pin, I can click on the image & it will link me to the correct post. However when I click on the link at the top on the pin (ex: Jenn pinned 1 hour ago from http://www….) that link doesn’t go to the correct post but yet the image does? The link has a “/” at the end of the url which messes it up, but when clicking the image it works perfectly.. Any suggestions?

Reply

106
Pamela February 21, 2012 at 7:01 pm

This is great! Thank you so much for sharing!

Reply

107
Erin @ Texanerin Baking February 22, 2012 at 1:19 pm

Thank you so much! I went through tons of tutorials that didn’t work before I found this one. I’m on Blogger and for some weird reason, nothing would show up when I put it in the recommended location (and I don’t mean the X problem that others are having). I copied and pasted the code in lots of different places until it finally came up. Thanks again! :)

Reply

108
Natalie February 22, 2012 at 6:02 pm

Fabulous! Thanks for the tutorial. It worked perfectly! :)

Reply

109
Kim Davis February 22, 2012 at 8:57 pm

Hi Thank you so much for this tutorial, I had trouble with it and sent you an email.
I am so lost on these things it is not funny.

Reply

110
Kim Davis February 22, 2012 at 9:06 pm

I sent you the note before I read through this string I suppose I should have posted it here instead so others can use it if they are having the same issue.

I followed the tutorial exactly and got this error code

Error parsing XML, line 1540, column 331: The value of attribute “src” associated with an element type “null” must not contain the ‘<' character.

I see ('src','http: in the code but I have no clue if this is the problem or how to fix it when I removed the code the error went away. Any ideas on how I can fix it?

(your amazing BTW)

Reply

111
Michelle @ The Purple Pumpkin February 24, 2012 at 5:21 am

Hi again Amanda, wondered if you knew the right spot to put this on Blogger to show at the top of the post instead of the bottom? I’m searching through now to see if I can spot where it *may* go.

Thank you!

Reply

112
Naomi February 24, 2012 at 9:03 am

Thank you for the simple tutorial, i have managed to add the button :)

Reply

113
shelly (cookies and cups) February 29, 2012 at 7:18 am

Do you know how much trouble I have adding that button? I know I am doing something wrong…I just can’t seem to make my image come up. It always says “media” where the picture should be. I am trying to pull from flickr, so I know I must be missing a step or something..ugh!

Reply

114
Dina March 6, 2012 at 12:12 pm

Thank you so much! Took a little while to get it working, but got it up…just updated my blogs :) If you have a chance come visit :)

http://onefellswoopdesign.blogspot.com/

http://healthierskinnierstronger.blogspot.com/

Reply

115
wendy sue March 7, 2012 at 3:16 pm

Thank you SO much for sharing this! I just did in in about 5 minutes…and I even had to sign up for a photobucket account – super quick and easy. Thanks a bunch! :)

Reply

116
Mary March 9, 2012 at 1:55 pm

Hi Amanda,
I’m having the same problem that Shelly (comment 108) has. The button works but the image is blank and says “Media”. Please advise. Thanks!!!!

Reply

117
Nikki March 11, 2012 at 6:45 am

Hi Amanda! Thank you for a great tutorial. However, I am running into a problem. My pin it button is showing up as a question mark but does actually work. I know it has something to do with my URL but am unsure how to fix it. When I use my URL, which I’ve tried in both Flikr and Picasa it takes me to the Flikr or Picasa page with my image. Seeing your link it shows up in it’s own window tells me what’s wrong. But how do I get my Flikr or Picasa images to work like yours? I’m at a loss. Thanks for any help you can give.
Best, Nikki ;)

Reply

118
April at JaneSays March 14, 2012 at 9:44 pm

….and after the 7 blogs with tutorials I found before yours tonight I finally have a pin it button after my posts. Thank you for correct, accurate, and GOOD information.

Reply

119
Mary March 17, 2012 at 8:41 am

Thanks for this! It worked perfectly for me! I had tried to figure it out using Pinterests directions & couldn’t quite get it but you instructions worked so simply.

Reply

120
Paige March 19, 2012 at 6:59 pm

I’ve been trying to add the “pin it” button for pinterest to my blog and it does not seem to be working. I uploaded my pin it button to photobucket and checked it like you mentioned in the trouble shooting. I keep getting the following error when I try to add it to my blog:
Error parsing XML, line 1181, column 331: Open quote is expected for attribute “{1}” associated with an element type “src”.
Any suggestions?

Any idea’s on what I can try next?

Thank you!

Reply

121
Kim May 1, 2012 at 10:41 am

Hi Paige, I’m having the same problem, did you figure out how to fix it? Thanks!

122
Paige March 19, 2012 at 10:00 pm

This is Paige again. I was wondering…could my problems have anything to do with the fact that I’m using the new blogger format? I still was able to find everything I needed too, it’s just set up slightly different than what you’ve posted as far as getting to the HTML etc.

Reply

123
Mary - glutenfreespinner March 21, 2012 at 2:03 pm

Hello Amanda! Thank you so much for your tutorial! I used a tutorial from another site two months ago when I added it to my site and was notified yesterday that it doesn’t work! Sigh…. I really appreciate your directives and now it works like it should! XO

Mary

Reply

124
Shannon Fox March 24, 2012 at 12:40 am

Thanks SO much. The control F was a LIFE saver. I had been trying and trying to add this button on and off for a week. I could not find the right place to enter it. I would scan and scan… with this tutorial. I had it done in 2 minutes. THANK YOU!!!!!

Reply

125
Grace March 24, 2012 at 9:43 am

Thank you so much for the insight in how to add the Pinit to my blog! Easy directions to follow and it works like a charm! Thanks!

Blessings, Grace

Reply

126
Lusine March 28, 2012 at 4:27 pm

I DID IT thanks to youuu:)))

Reply

127
Dee April 1, 2012 at 2:17 am

Thank you – made it pretty easy to get a Pin It! button on my blog posts. The Pinterest goodies page does not make it this simple :)

Reply

128
Leilani Scholtz April 3, 2012 at 12:42 pm

Hi Amanda,

I enjoy following your Blog…I think every part of it is great and I enjoy that you share.

I need to set up my own blog as I am getting ready to open my Etsy Shop…I see how much you can do w/ having a blog and linking it to your Facebook, Pinterest and Etsy…However I don’t know where to begin and I tried to set up on Blogger (Google) and also tried Wordpress. So much to do and know. I was thinking of farming out that project. I have my hands full (SAH MOM of three)…Any suggestions? PLEASE HELPPPPP…:)

Reply

129
Daniel Newman April 11, 2012 at 3:37 pm

yay it worked and it wasn’t as scary as I thought it was going to be. Thank you.

Reply

130
Barbara Rosenzweig April 13, 2012 at 8:51 pm

Thanks so much. I was able to put the “Follow me on Pinterest” button on my blog.
Still not sure how to put it on the photo on this post: http://barbararosenzweig.blogspot.com/2012/04/new-painting-covered-bridge-watercolor.html.
You can easily say that I’m technologically challenged!

Reply

131
Taryn April 15, 2012 at 11:00 am

Thank you so much!! I love when I try a code for the first time and it actually works! This was much easier than I was intending it to be.

Reply

132
Miss Mommy April 15, 2012 at 2:45 pm

Thank you! After reading this post I was able to add the code to my blog so the Pin It buttown would appear – on the very first try!!!

Reply

133
Kelly April 20, 2012 at 2:54 am

I saw this blog post on Pinterest. Thank you very much!! Awesome tutorial!! I added it per your instructions, then saw your reply on comment #64 to add it underneath the post title. This is much better than adding it manually (which I usually forgot to do).

Reply

134
LaDonna April 29, 2012 at 10:21 pm

Hi Amanda, thank you for posting this. For some reason I cannot find single.php or index.php. It isn’t one of the options. I have the Atahualpa theme. Any ideas? Thanks.

Reply

135
Adrienne November 1, 2012 at 5:17 pm

I am having the same problem. Trying to figure this out.

136
Lan May 4, 2012 at 11:05 am

just a quick note to say thank you. finally. something that works and is friggin better than what pinterest has to offer.

Reply

Comment Pages: 12Next »

Leave a Comment