Leave a Comment:
260 comments
Jeni, this is brilliant. I’m adding this to the top of my to-do list. Can’t wait to work on it tonight!
ReplyI finally got some time to add the Pin It buttons to my popular posts in my sidebar. It looks great! Thanks for sharing this neat idea. 🙂
ReplyMary, I also wanted to mention to you: I know nothing about Squarespace, but I found a tutorial on where to add the Javascript snippet from Pinterest so the pin counter will work on your blog. Check it out here:
http://www.squarespaceplugins.com/add-pinterest-pin-it-share-button-in-squarespace/
Hope it’s useful!
ReplyI did it! Thanks to your video and step-by-step description, it worked like a charm. Unfortunately, I wasn’t able to add the java to my blog since I’m a wordpress-hosted blog…one more reason why I’m hoping to be self-hosted in the new year.
You also inspired me to change up my sidebar…so thanks!
ReplyHi Jeni, Great post. Have been working on it on and off all day but am having trouble getting the spacing right between each picture. How many div codes do you use?
ReplyAck! Sorry, the code I posted didn’t come through there. I don’t want to screw up the code here on my site, so where I put a bracket, know that I mean to use a < > tag. Here goes again:
After the {/div} tag that comes after your Pin It button, you can add ” ” (without the quotes) to add a line of space. Hope this helps!
ReplyThanks, Jeni. I’m still tweaking. But ever since I added the third photo, it threw everything below it on the sidebar into my footer area. Any clues? It’s all still in the primary sidebar on the widget page, but in the real view, there are several things down below.
ReplyYep. You’re missing a few “open div” {div} tags. Right before the {a href= …} that belongs to the image for “How to Can Water for Emergencies” and also right before the image for “Homemade Whole Wheat Bread Recipe” you need a {div} (once again, those should be < >‘s). So, two of them total. Let me know if you’re still having trouble.
ReplyWow, thanks, Jeni. What a difference such a little piece of code makes!
Replyhi jeni,
followed your tutorial completely and found it very understandable! however my blog is the wordpress twentyeleven theme and i cannot find the correct place to paste the javascript… i am not very code savvy. help! -gloria
ReplyHi Gloria, unfortunately since you’re blogging at wordpress.com, there’s nowhere for you to add the javascript. Only folks who blog on self-hosted WordPress can do things like add javascript and run third-party plugins. 🙁 You can still add the “pin it” button underneath the image – it just won’t have the little counter to the side of it. Eventually, most people who start out blogging at WordPress.com think about moving to self-hosted because of little issues like this. Sorry to rain on your parade!
Replyahh, i see i see. i manage a couple other blogs that have a self-hosted pages which i prefer so i will have my own blog that way… thank you! for now my client will have to lose the counter. thanks jeni!
Replyhello again jeni,
i hope you are ending the week on a good note. i am coming back to this conversation (you might already know why) to ask your advice on the best way to convert my wordpress blog to a self-hosted account… will i have to start from scratch or will i lose any of my content?
p.s. also wondering if i switch to a self-hosted wordpress if that will take away my store or change the design of my page… sorry for all the questions!
ReplyHi Gloria, there’s a pretty good tutorial on moving to self-hosted written by the WordPress.com team. I highly recommend having your domain forwarded (that’s a paid upgrade, but worth it IMO); you can read about that at the very bottom of that post.
When you move to self hosted, though, you’re setting up a completely new site – new files, new directories, everything. You’re actually just importing the posts and pages themselves, but everything else is from scratch. So a lot of people end up hiring a designer to get things set up initially for a no-hassle moving experience. If you use a good hosting service like SiteGround (*aff) they’ll create a temporary domain name for you (just call customer support and ask) so you can do the setup work behind the scenes and all your readers won’t see what’s going on until you’re ready for the big “reveal.”
But getting back to your question – you shouldn’t lose any content at all. The import of the content is actually the easiest part. 🙂 Hope this helps! Have a great weekend. ~Jeni
ReplyHi Jeni! Thank you for the great tutorial. I added a couple to my sidebar, but they don’t look as pretty as yours! I can’t seem to get a space in between them. When you have time could you tell me what you think? I don’t want to add more until I get it set right. I’m SO happy I found you! Pinning works as I found you on Pinterest on blog sponsorship – my next project! Thanks again for sharing!!
ReplyHi Sunday, it looks like you used the “Follow button” instead of the “Pin It Button for Websites” on the Pinterest Goodies page. Scroll down a tiny bit more and you’ll find the right one. And then when you need to add space between the pin button and the image beneath it, just add this bit of code at the bottom of what I posted above:
“THE AND SYMBOL”nbsp;
(where I wrote “THE AND SYMBOL” substitute that with & (no quotes). Sorry – if I type HTML here in the comments it won’t display it properly.)
That will add one line of space for you. Hope this helps! If you run into any more snags, let me know. 🙂
ReplyThank you so much! It was a breeze to install and I think it looks pretty spiffy (if I do say so myself, and I do!) You made this a simple task for an evolving Luddite. 🙂
THANK YOU!
ReplyHi Susan, you’ll need to go into your template files to add the code in. I found this handy tutorial that should walk you through it. Let me know when you have it done – I’d love to see how it turns out!
ReplyThanks for this great tutorial! I pinned this awhile ago and just got to it today. I also use Blogger and finally figured out where to put the java code. The link you suggest is a great starting point, but things must have changed since that post. Steps 1-3 are good, but in step #4, search , copy the html Pinterest provides (rather than the code from the post), and paste it right before
ReplyHi Sam, thanks for your comment! I looked at your blog and the pinnable images look fantastic! I see that you’re on Blogger; I found this handy tutorial on where to add the Javascript into your Blogger template so the “Pin It” buttons will show the counter on them. Great job!
ReplyOh Holy Night… I did it!!!!! With 2 of my daughters watching in silence… and now they are beaming with me! I honestly didn’t know I would have the patience for it… but it wasn’t that hard!
Thanks.. I am really happy with it….
Beaming Smiles all around and Thank you,
T @ aseedinspired
thanks!…again.!
Now I need to figure out how to make things more streamlined and interesting. I didn’t plan on my blog becoming so popular in such a short time. I really don’t think I am doing a good job with how I handle the amount of traffic I get.. I should probably be doing more.
Thank you for giving me more confidence.
T
WHOA! I did it! HTML and everything!
Your post make me feel like I can conquer the world! Bwahaha.
Thank you!
ReplyJeni, do we have to go through each step again and again to add a new Pin It count button for each image we want to use in the side bar?
Also, I already use descriptive wording in my image title – would adding the same wording (like you do) to my alt line increase my seo value or should I not bother to add it to my old posts?
Thank you!
ReplyHi Tracy, yes – you would want to add a new Pin-It button for each image. That’s how you get to show off the number of pins you’ve gotten for any given post. And regarding the Alt text, if you’re serious about getting lots of search engine love on your blog, I’d definitely add the Alt text wherever possible. It’s GREAT for SEO. Hope this helps!
ReplyHi Phillip, well, it’s a strange coincidence, but ALL the Pin-It buttons across the web are broken right now. I think it’s a problem coming from Pinterest itself. Hopefully they’ll get that resolved in the next few days. But…I also took a look at your blog and since you’re blogging on WordPress.com (rather than self-hosted), there’s no way to add the Javascript. This is the kind of thing that causes most people to eventually move their blogs to self-hosted WordPress. So – sorry I wasn’t more help! The images themselves would still look great in your sidebar, though. 🙂
ReplyWow– awesome tutorial! Just finished add some images and buttons to my sidebar. Thanks so much for the clear instructions– you rock! 🙂
ReplyThanks for the great info! I’m new to blogging and was able to feature post in my sidebar thanks to your excellent directions! I will be visiting your site often for more tips.
ReplyThank you so much for this easy to follow tutorial! I just added one of my pins, can’t wait to add more. Just subscribed to your site (found you on Pinterest) 🙂 Thanks for all this information! Halle
ReplyVery intense reading / videos but I’m loving it! I feel like I’ve been stretched from beginner blogger to semi-concious wanna be coder! lol!
Question….I have WordPress and have a customized theme (created by coder friend). In the section you talk about adding code to the bottom which displays the counter, you put yours under “Genesis/theme settings”. Since I have a customized blog and not Genesis, am I still about to add code for a Pinit counter?
ReplyYes, you should be – but it depends on the structure of your theme. The best thing to do would be to ask your coder friend where to put it in your files. If you’re not familiar with using FTP to access the files on your server, you should be able to hire him/her to do it for you for $20-30. Well worth it, in my opinion. 🙂 Thanks for your comment, Theresa!
ReplyThanks so much for this tutorial! I did this a few weeks ago when I ran across the tutorial, and it’s definitely helped to increase my pageviews per visit!
ReplyHi Jenna, to do it on Blogger you’d follow the same exact steps to place the image and the button. And then to add the Javascript that makes the pin counter work, you can try following this tutorial. I’ll let you know, though, that Pinterest is currently having some issues with the pin count displaying (you’ll see that half of mine are working and half aren’t), but hopefully they’ll have that resolved soon.
If you do these on your blog, please stop back by and let me know – I’d love to see how they turn out!
ReplyHi Jenna, since you’re not using a photo straight from a post, you’ll need to use a 3rd party site (like Flickr or Photobucket) to host that image file for you. So upload your file to Flickr/Photobucket, and then when you add the HTML for the image source to your sidebar, you’ll refer to where you’ve uploaded the file on Flickr/Photobucket. Does that make sense? Blogger can be kind of a pain sometimes… Let me know if that isn’t clear – if you have difficulty, I found this tutorial (scroll down a good bit!) that has a detailed explanation. Hope this helps!
ReplyHi Jeni! I love this post; it is exactly what I’ve been looking for. I have one very popular pinterest post and I want to get more of them to be as widely circulated.
I did two successfully. However, when I tried to add a third featured image (and I tried a couple of different ones to make sure it wasn’t the image’s problem), it went in successfully, but my left sidebar was displaced to my footer area. Quite disturbing. I removed the third image until I can figure out how to fix this problem.
Any ideas would be much appreciated.
Thanks again for the amazing post. I will share it with my followers. 🙂
ReplyHmmm…it sounds like a problem with your “div” tags. Make sure that when you copy the code, you get the whole thing. If that doesn’t work, I’ll be online tomorrow night after 9pm EST; you can DM me on Twitter when you’ve replicated the problem and I’ll pop over to see what’s going on. But the other two look great!
ReplyHi Jenna, thanks for leaving it “messed up” so I could see what’s going on! It looks like you have an extra [/div] tag after each one of the Pinterest buttons. There are two of them together at each one of those spots. Try erasing one after each Pinterest button.
(Of course, make sure you’re using the proper brackets – the ones that look like “<" - I can't write them here because WordPress will screw up the code) 🙂 Please stop back by and let me know if this works!
ReplyHey Jeni,
I thought the new year was a good time to give my blog a facelift. Your tips are great. I always come to your site when I have a question! Thanks again!
Jeni,
THANK YOU! I am slowly but surely starting on your MANY amazing tutorials. This one was GREAT and I actually did one! I’ll be working on more in the days ahead. Heartfelt thanks for sharing your knowledge. Photoshop Elements is next!
I wish you and your family all of the best in the coming New Year!
Much aloha, Lori
This tutorial was awesome and so easy to follow! I have been trying to figure out what to do with my side bars to make it more functional and actually purposeful instead of just taking up space so this is slay incredibly helpful! Just what I was looking for!
ReplyGirl, that is a wiiiiiide sidebar you have! …so here’s what you would do: you have HTML code there that goes like this:
HTML for title of post #1
HTML for title of post #2
HTML for photo of post #1
HTML for photo of post #2
Since you already have the photos in place, you’d only need the code for the Pin It button. You’d want to insert it so it looks like this:
HTML for title of post #1
HTML for title of post #2
HTML for photo of post #1
HTML for photo of post #2
Pin It Button code for post #1
Pin It Button code for post #2
Does that make sense? I imagine that you might have some alignment issues with the Pin It button at the bottom of the images, though, since your code isn’t arranged into tables. But if you’re serious about wanting to do this, you could hire a freelancer to recreate your sidebar HTML with tables instead, and then everything would line up just fine.
…or maybe you’d just want to do the Pin-It buttons on the full-width images.
Hope this helps!
ReplyHi Kristy, you can definitely leave off the Pin It buttons if you want to. The reason for having them there is just to display the number of repins you’ve had of that post…at least, once Pinterest fixes their current issue with the counters working. The more pins a reader sees, the more likely they are to pin your post again, which drives even more traffic your way, etc. If you follow my tutorial, the Pin It button in the sidebar will be linked straight to the post (and won’t send people who follow the pin to your homepage, for example). But I think it’s a personal preference thing, whether to have the Pin It button there at all. Thanks so much for your comment!
ReplyMy problem is that the posts themselves are popular (people are visiting my blog via Pinterest), but then they aren’t pinning them from my site. Maybe they are just re-pinning pins of others, so there really isn’t a way to track those is there, especially if it was pinned via a “pin it” button instead of the pin I created? And yes, I’ve noticed that the numbers aren’t showing anyway right now. 🙁
ReplyOn my blog, at least when the pin counter is working, the pin counter reflects all pins, whether it’s a re-pin from others, or it’s pinned from the button on my blog. The counter works by counting the number of links total that are going from Pinterest to a specific URL. And lots of people follow pins and don’t re-pin them, as well. But the good news is, your posts are popular and you’re getting lots of visitors. Good for you!
ReplyI don’t have a tutorial, but you can probably figure it out by using Photobucket (it’s free!). I measured your sidebar, and you’ll just want to make sure that your photo is 180px wide. Hope this helps!
ReplyOMG, this blog posting is one of the most helpful I have viewed in a long time! I have spent countless hours on a few Sunday afternoons trying to figure this out! I have shared this across my social media and can’t wait to follow the steps you provided to drastically improve my blog. Planning to peruse your other posting throughout the weekend….right after I subscribe of course. 🙂
Thanks for providing these steps.
Hi, Jeni-
This was working beautifully on my self-hosted WordPress site, http://www.simplesciencestrategies.com, when I had a strange thing happen! I added the code for my first pinnable image, and went live to see if it was looking ok. It looked great! But, as I gazed upon it, the “pin it” button disappeared! I am not sure what the page loaded, but it erased the button.
Help!
ReplyThis is awesome. I just found you via Pinterest and hopped over to see. I’m going to read in more detail tonight and try to add this to my sidebar.
As for Pinterest visitors, I’m always surprised what is generating traffic from Pinterest. But I rarely seem to get any comments or followers from that, it seems. I love this idea to attempt to boost those who actually stick around.
Also – I’m a new follower. This was enough to get my attention. So, Pinterest for the win. 😉
ReplyThis is an awesome tutorial! I can’t figure out how to get the pin count working though. I’m on WordPress with the Pro Photo theme. The pin count works on my posts but not on my sidebar. Thoughts? http://thehappyfamilymovement.com/2012/03/five-simple-steps-to-choosing-your-kids-over-your-phone/
ReplyHi Jenny, I’m not familiar with the Pro Photo theme, but if you’re having trouble finding where to insert the javascript code that Pinterest gives you, I did find this interesting plugin that might get the job done. If your Javascript code is in the right place, your sidebar counters should start working for you. Hope this helps!
ReplyWow! I have spent soooo much time in the last 24 hours roving around your amazing site! Your articles are so helpful and I’m looking forward to seeing them grow my blog! 🙂
I have recently had some problems in my blogger template after trying to edit a few things. I deleted my intensedebate comments by accident and cannot get it back onto the blog due to errors in the html 🙁 and I also had my pin it button (which was in template) muck up and now I’ve been adding the button manually to new/popular posts. I’d love to do these popular posts but fear stuffing up the html again!! Any tips? I’d love to know how much $$ for you to give me some advice and solve my html woes!! 🙂 Signing up to your newsletter now!
Thank you!! Just added the Pin It button next to a few of my posts’ cover pics. Can’t wait to have the time to add the side bar feature. Thanks for the tutorial. I just never played with it or really thought about it. Of course, I found you on Pinterest and pinned this post!
ReplyI love this post and it truly was easy to achieve so thank you so much!
I do have a question though. How do you figure out if the number of times a post has been pinned is accurate? For instance one of my most popular posts comes up with the number 37K+ next to it and I knew it was popular but had no idea it was that popular. How do I maximize the business/clicks associated with that particular post??
I appreciate your help in any way and hope you have a wonderful day
Hi Jenn, the 37K+ number is probably accurate. The best thing to do when you see a post taking off is to revisit that post and make sure it really represents the best of your blog, and add some internal links to other posts within your blog. You know, just mention them with a link, but naturally within the text. It encourages people to stay on your blog for awhile. And then make sure those posts are fantastic. If it’s appropriate, use an affiliate link for any of the materials you needed to make the project. And at the end of any post with high traffic, make sure you have a call to action – give them a way to subscribe to your blog and become regular readers. Hope these ideas help!
ReplyThis is great! Thank you! I will be doing this.
I have one question for you. I have been looking at my Pinterest source page for awhile now. It is constantly changing and doesn’t show ALL the things people have pinned from my blog. Is that normal? Is it supposed to show everything EVER pinned from your site? Or just the most recent things pinned? Mine definitely only shows the most recent.
thanks!
Also, I’m on blogger. Not sure I can translate all these steps for adding the pin it button to blogger. I don’t suppose you have a tutorial for that or know of a good one I could refer to?
thanks!
I figured it out! Thank you! Still wondering about my pinterest source page though.
ReplyThis is fabulous! I managed to get it done following your steps and it looks great! Thank you for sharing!
ReplyHi Jen!
Okay, I got it all set except the counter doesn’t seem to be working. I uninstalled and reinstalled that javascript (I am on Genesis too), emptied my cache, logged in and out of WP. The pin it button is there, but no number. The number is showing up in my preview where I created the button on the pinterest site.
PS, this is awsome and I am SO excited I found your site!
Kim
One other weird thing, when I click the “pin it” button under the photo, it takes me to one of my blog pages (the same one every time?
ReplyHi Kim, I took a look at the code on your site, and I’m pretty sure Pinterest is giving you bad code to use for the button. Every time you see two slashes (/) in a row, you need to have “http:” written in front of them. What you have there is bad code, and you have a 301 redirect plugin that’s sending the viewer to your “buttons” page because it sees the word “button” in the bad URL and it’s trying to match it. There are two places on each one of your Pin It buttons where this will need to be fixed. Hope this helps!
ReplyYou are such a rock star!
Thanks bunches, it is totally working and I am so excited:)
I already pinned this post, but I just may have to share it and all of your other goodies in a lil post of my own next week!
xxx
Kim
Hi Jeni,
I’m so glad I found your blog. I’ve been looking for straightforward help with CSS and I’ve finally found it. Thanks very much for sharing this tutorial.
This first widget I created worked like a charm but I’m having a problem with the description on the second one. In the widget, I entered “Julia Child’s Famous Sole Meunière” as the descripton but when I click on the Pin It button under the image it just shows “Julia Child”. I’ve tried again without the apostrophe but it didn’t make any difference.
ReplyHi Jen,
I succeeded in getting the image to my sidebar, but I cannot figure out what to do for the Pin it button. I went to the goodies page — tried it, failed. Could you be more specific about what to go to there? I do not actually see “pin it button for websites.” And I do have the Pin it button on my website, so am not sure about the javascript (whatever that means!). Sorry, tired mom here.
Left it on my website even though it’s not complete so you can see it.
ReplyI had been using your tutorial and have my sidebar all nice and pretty. Then tonight I decided I wanted to add a few new posts and the Pin-It code that Pinterest provides is TOTALLY different than the one you have above. I think with the new version they changed some things. Any idea on what to do now?
ReplyHi Danielle, it’s still the same process…you just navigate to a different place to get the button code:
About > Pin-It Button > (scroll down to the bottom) > (under Pinterest Widgets) Make Pin It Button.
Pin Count: Beside
…then just add the link URL, image location, and description as normal. When you cut and paste the code they give you, make sure that every time you see two slashes like this: // you put http: in front of it. As of yesterday, there was one place where Pinterest was leaving that out, and it’s necessary for things to work properly.
Hope this helps!
ReplyThank you so much for sharing this!! I updated my popular posts and am also writing a small blogging series explaining how I took my page views from 0-5 a day to 100 on average now! I was hoping I could share the link to this because it’s amazing how many pins I’m getting from this technique and my bounce rate is amazing, keeping more people on my blog!!
I tried putting this in a post, it seemed to work, but I just wanted to check and see if you know if the coding would get in the way at all?
ReplyHi Elizabeth, as long as you did all the buttons the same way, I’d think it’s something funny from Pinterest. That happens to mine occasionally – sometimes the counts are there; sometimes they’re not. If you don’t see them appear in a week, let me know and I’ll look a little more closely at your code. Great work! (Love your tagline, btw…) 🙂
ReplyHi, Jeni! This tutorial is AMAZING! I just used it to add a popular pin section in my sidebar. I was proud of myself because I figured out how to add my custom Pin It button beneath the picture. It’s sad that this tiny triumph made me feel like such a technology wizard 🙂 Thanks so much for your amazing work!
ReplyWow, Amy, that looks great! One quick thought: it might be a good idea to put a little more space underneath each “Pin It” button because by the third or fourth one, it’s hard to tell whether the button goes with the image above or below. Super cute site! Great work, you tech ninja. 🙂
ReplyThanks so much for taking time to look at my blog! And I think you’re totally right about the spaces and just added them. Can’t wait to explore more of your tutorials!
ReplyHi, again, Jeni-
I have to tell you (and all your other readers) that this strategy WORKS!
A couple of months ago, I saw this post on Pinterest, and revamped the sidebar of all my blogs. Today, I’m updating my sidebar images, and went back to see the number of times images had been pinned. The images I used last time were repinned MUCH more than the others. Yay!
ReplySo this is awesome! But, when I add one it works fine, but when I try and add 2 images, the counter no longer works…any ideas why? I am using Genesis, put in the Javascript, checked that I had all div tags…not sure what else is wrong!!
ReplyI love this technique! Your post is genius!
I am having a problem where the pin count doesn’t show up on the home page, but it does inside individual posts. I figured I could just live with it, but recently decided to dedicate a page to most-pinned posts. The pin count showed in my preview, but now that the page is live, pin counts are gone. 🙁 Any thoughts?
Thank you! Such a great tutorial. I’ve already added my first image and will be working on some others tonight. Love it!
ReplyStumbled upon this post on Pinterest appropriately. And it was a great help! Thanks so much!
ReplyThanks so much for a great tutorial! I had pretty good luck, but the title of my post is not showing up on the pic. Isn’t it supposed to?
ReplyHi Kim,
The title of the post appears in the Pinterest description box when you click on the Pin It button. People either label their images directly (with their photo editing software) or you could theoretically add a line of HTML with the name of the post below the image, as well…but the way you have it set up is what most people are doing. Hope this helps!
Warmly,
Jeni
Hi Jeni,
I just followed your steps to add three pins to my sidebar and I love it! Looking forward to adding more soon. Thanks for the great post!
I love the idea of using the white space in my sidebar to show off some of my Pinterest posts. Shooting this link over to my husband so he can implement this on my site. Thanks for this wonderful share Jeni!
ReplyHi Jeni. I am trying to get some of our favorite pins on to our sidebar and came across your post. I am having no trouble getting the pin on there. But when I do, it messes up my footer and I can’t figure out why. When I add one pin (that is clearly within the size of the sidebar) it moves our bottom right footer outside of the margin. When I add two pins, the whole footer comes up out of whack. Any ideas? We are using Genesis. Thanks!
ReplyHi Megan,
I’d love to take a look at this for you, but I need to see it while it’s “broken” in order to see what’s wrong. It sounds like an issue with the HTML code. If you can replicate your problem sometime tomorrow (Saturday) morning and let me know, I can pop over to take a look around lunch time.
Thanks!
Jeni
Thanks Jeni! I think all I had to do was post a question – we got it fixed LOL! We ended up shrinking our footer photo and I’ve added three pins and it didn’t mess anything up with spacing.
I do have another question though. Two of my pins are landscape and one is portrait. I was thinking of cropping the portrait one so it is more uniform with the other two. That means that the picture would only be part of what is on the post, as opposed to just being smaller. On our site, it’s the geology post, so it would only have the top of the rocks, instead of the whole photo.
If I did this, would the image that people end up pinning using the button below it be this altered one? I’m not sure that I want an altered photo to be pinned, but I’m not sure about having the pins be so different in the sidebar. What are your thoughts?
Thank you!!
ReplyYou can have the Pin It button pull any image you want – so first, you’ll add the cropped image to your sidebar. And second, when you go to Pinterest to create the button to link to that post, just make sure that the URL of the image for the button is the original post image. Hope this helps!
ReplyThanks for a great tutorial. It definitely took a couple of hours for me to do this start to finish since I had to create images with titles, but it was definitely worth it.
You also might want to update this post since Pinterest has changed their Goodies page and now has a build your own Pin here:
http://business.pinterest.com/widget-builder/#do_pin_it_button
I also found a site that gives you the number of pins for any of your URLs:
http://pinterestplugin.com/pincount/
I’ve added my top 5 pinned pages to my website. Thanks a bunch!
ReplyThis couldn’t have been easier! Thank you so much! I hope you get a chance to take a look and offer any feedback!
ReplyHi Jeni! My blog is almost 3 months old. I took a big plunge and went self-hosted on WP. HTML is going to be the death of me. I scrolled through all the comments to make sure this question wasn’t already asked. It was, but for wordpress.com folks.
So, I am on twenty twelve theme (again, self hosted). I do not have a Genesis option in my menu. So where do I paste the code for the counter? In the CSS thing? I am going to start a Pinterest account for my blog, and was looking around the internet for advice. Your video is awesome.
ReplyHi Karen, there’s a plugin called “Insert Headers and Footers” that should help you. WP Beginner has a great article about how to use it here: http://www.wpbeginner.com/plugins/how-to-add-header-and-footer-code-in-wordpress/
Hope this helps!
Replyi am just starting my blog on blogger and still didn’t launch it but will definitely try this if the blog was going good i think this will be an amazing add
thank you for the amazing tutorial great job you are doing
check it maybe you will like it http://www.prettyscraps.com
I was one of the idiots that thought Pinterest was just for women. I have since changed my mind and recently, I have found your site and it has really helped a lot! Great tips. I’ll probably come back to this and read it again! lol!
ReplyNew follower Jeni and I’m so excited to have found you!! You Rock! Amy Lynne Andrews is pumpin you up in her “Useletter” too!!
Thank you and blessings!!
Hi Jeni!
I’ve tried adding the javascript, but pin count is not showing up. It actually worked for several months, but no longer is and I tried readding it. Any ideas as to what might be going on or how I may be able to fix this? Any help is greatly appreciated!
ReplyHi Kim, if you’re using another Pinterest plugin on your blog already, then adding the Javascript code will likely cancel out the pin count. Try taking out the Javascript code and see if the pin counts appear. You may need to wait an hour or two and then check back. Let me know when you get it!
ReplyYou are a genius!!! Thanks sooooooo much for getting back to me…. it worked. Now I wish I would have asked you sooner! 😉
ReplyHi Jeni! Thanks so much for ALL of the info you have around here. It is my go to site. I do have 2 questions. 1. I added the pin it button to my popular posts in my sidebar but the counter is only showing up on my home page and one of the images never has a number (and I know it has been pinned.) Any ideas how I can get the counter to show up on all of my pages? 2. Which plugin do you use for the pin it button on your in post images? I want mine to show up all the time, not just when you hover and I would love the counter with it…pretty much just like you have. If you could point me in the right direction that would be wonderful! Thanks again!
ReplyHi Corey, if you have another Pinterest plugin running on your site, it’s possible that if you’re also adding the javascript code to your theme, the plugin and the extra code are crossing wires. Try removing the javascript code you added to see if that helps. Aside from that, you might try removing the Pin It button code from the image where the pin count isn’t working and try adding it again from scratch.
The plugin I use on my site is called Pin Button Attraction. There are a few tiny glitches with it right now with the latest WordPress releases, but I talked to the developer of it a few weeks ago and he said they’ll be working on an overhaul this coming Spring. But for now, I love it and it works really well for me. 🙂 Hope this helps!
ReplyHi, Jeni, I found this at IBN, so happy I did! However, I am doing something wrong…. I am putting the Javascript at the top of the widget — is that wrong? I am trying to put 5 pictures/pin it buttons, but every new one I add, the ones above it aren’t showing a count 🙁 So excited because one of mine has 7K+ and I had no idea!!! 🙂 Any advice — where should the Java script go? Thanks 🙂 🙂 (also, I can’t put the number count next to the button, like you have, only above….)
ReplyHi Amy, I just took a look at your blog and it appears that your pin counts are all working correctly now. Did you get it fixed?
Regarding the vertical vs. horizontal pin counts, that’s something you select on Pinterest.com when you’re creating the button – I believe there’s an option for vertical/horizontal that you can select. But it looks great the way you have it!
ReplyThank you so much! This has been on my to do list for awhile and you are the reason I was able to make it happen! =)
ReplyThank you, thank you, THANK YOU! I can’t get over how easy this was and it looks amazing! My sisters and I have been blogging for a year in April and, thanks to Pinterest, have had certain posts that have drawn thousands. Unfortunately, we haven’t had much luck keeping those Pinterest readers around. I’m hoping by linking them with other popular contend we can take a step toward fixing that. Thank you so much!
ReplyHi Jeni. I’m having trouble once again with my sidebar when I use the pin it button. It’s fine as long as I have a certain number of pin it posts. As soon as I add more than four posts with the pin it button, my footer comes up into my sidebar. It seems like I can have as many images over there as I want as long as I don’t have the pin it button/code attached. As soon as I add that, I’m limited to the number before the sidebar and footer get messed up again. Any ideas?
ReplyHi, thanks so much for the great tutorial. However, I am having issues. I was able to download the html file to filezilla, but when I go back to pinterest, and click verify, it said “whoops, can’t verify at this time.” I tried over and over and now it says I’ve “reached my limit with verifications and to try again later.” The name of my website is there in the corner, but there is no check mark and I can’t access pinterest analytics. Do you know what I am doing wrong? Thanks!
ReplyHi Lorien,
I’ve had several people report the same thing, and it has always been something on Pinterest’s end. Sometimes if you check back on your profile on Pinterest, you’ll find that it has already been verified, even though it says it hasn’t. What you’re looking for is the URL of your blog right at the bottom of your Pinterest profile. Please check there and let me know if it’s showing up, and if not, I’ll walk you through the second option of how to do it.
ReplyMy URL is there and I can click on it and it will send me to my website, but there is no check mark and more importantly, I can’t access analytics which I guess is one reason I’m verifying, right? Sorry, I’m clueless:)
ReplyThe analytics come if you have a Pinterest business account, and that’s a topic all of its own. 🙂 The alternative way to verify your Pinterest account is to use an HTML meta tag, and Pinterest has their own tutorial for that right here:
https://help.pinterest.com/entries/22488487-Verify-with-HTML-meta-tags
To add that to the header section of your site, you can use a plugin called “Header and Footer,” found here:
http://wordpress.org/plugins/header-footer/
Just install the plugin and go to the settings page where you’ll see an input box that corresponds with the “Header” area on your site. Then go over to Pinterest and get the code (following their tutorial, above) and paste it into the “Header” box on that plugin on your site. Then have Pinterest verify that it’s there. Hope this helps!
Warmly,
Jeni
Hey Jeni,
LOVE this & your many other helpful posts! I was able to add the images & PinIt buttons without any problem, but I’d like a little more space (blank rows) between the images. As it is now, readers may confuse which PinIt button goes with which image. Is there an easy bit of code to include just a little extra space between images?
Thanks much!!
Karen
Can you help me? I have gotten one of the posts to work, but can not for the life of me get the other one to work. Can you take a peek at my blog and tell me what I am doing wrong? I’ve followed the directions exactly….but it won’t work. Am I supposed to leave the Target blank thing, blank?
Thank you so much for your help!
Jenni, this is amazing – clear, helpful and easy. Can’t wait to make my Pinterest sing! Thank you so much.
Carol x
I did it Jenny, I’m so happy. I’ve been wanting to do this for awhile but didn’t think I’d be able to pull it off. Thanks so much for a great tutorial! The only problem I had was more space between the image and the Pin it button on the second and third images. Any idea what would cause this? Thanks again!
ReplyHi Chris, the top image is supposed to link straight to the post; there’s a problem with your link code for that one. You have “ahref=” all together there, and it needs to be “a href = ” with the URL in quotes right after it. When you get that image working properly as a link, the Pinterest button will move down just a bit and match the one below it. Hope this helps!
ReplyHey Jeni, as someone who creates screencasts regularly, let me say this is a tremendous how-to video. I intend to repost the YouTube video at my education video site, Learnitin5.com. I’ll send you a link, when it’s up, and I’ll be sure to link back here. Thanks for this. I’m looking forward to adding a Pinterest pic and link to my blog.
ReplyGreat tutorial!
I am having a problem getting the counter to work. I tried adding the java script and it still didn’t work so I removed it. I hope it is just a hiccup on Pinterest’s part. (The preview on Pinterest showed the counter.)
I am so glad I found your site and cannot wait to learn more so that I can make my blog better.
ReplyHi Lynda, I just checked over on your blog and it looks like you got your Pinterest pin counts working – great work!
ReplyJeni – today is the first day I came across your blog and I’ve probably skewed your traffic today because I’ve been on it for HOURS. Your posts are awesome!! Actually I was having a down day about my blog and reading your stuff has inspired me again!! Thank you so much.
I hate to ask because you’ve already been so helpful…..but there is quite a large gap between the image and Pinterest counter on my blog http://www.recipetineats.com Is there a way I can reduce that gap? I notice that the gap for yours is much smaller.
Thank you again! I am SO GLAD I found you!!
ReplyHi Nagi,
The gap between the pinterest counter and your image is due to the CSS that’s controlling images in your sidebar. I don’t know how comfortable you are inspecting and editing CSS, but your designer could fix that in a heartbeat. 🙂 Hope this helps!
Jeni
ReplyHi Jennifer,
I’m not entirely sure that this is the source of the problem, but I noticed that in the code for the pin button itself, the link’s URL is starting with two slashes ( // ), and this should have an http: right before it…in both links within that code, actually. Try adding the http: before those slashes and let me know if that solves the problem.
Hope this helps!
Jeni
Thanks so much for pointing out that the code wasn’t displaying, Cheryl. When WordPress updated last time, apparently it broke the code, but it’s fixed now. 🙂 I appreciate you letting me know!
ReplyJeni- This is SO great! I was able to do everything except the Pinterest button because the WordPress.org template I use already has some kind of hover button built in. I couldn’t figure out how to do the counting one. but I was able to have the PinIt button go to my Pinterest page. Thanks so much! Also for the 5 Things You Can Fix… guide. I implemented many of those tips as well. I am posting on my blog now about your site with links!
Please take a look at my revamped site (it’s always a work in progress, especially since I’m still new to blogging) http://thatwasthenthisiswow.com and see how my Pinterest sidebar feature came out! I also have the Pinterest widget right underneath it.
Thanks,
Paula
Hi Paula,
It looks like Pinterest has changed their layout since I created this tutorial; I’ll post new screenshots this weekend that should help point you in the right direction! Check back Monday and it will be ready. 🙂
ReplyHi Jeni, thank you so much for this tutorial. Just have a question. Why wouldn’t the image itself link to the post on my page ? I thought with the code you provided when you hover your mouse you will be able to click and see the post, but didn’t seem that way. I’m wondering if I did something wrong. This is what I have :
Thank you so much for your help.
ReplyHi Marv, I was just checking your site to see what’s up with the sidebar images not linking, but it looks like you got it fixed. 100 points for you! 🙂 Hope those widgets get you some extra reader love to those recipes!
ReplyHi Jeni,
I am reading “Growing your blog with Pinterest” Thank you. My question is about franchise stores, my company has 100 that range from having their own page to not touching a computer. How can I best benefit them with the corporate page? Can non tech franchisees use the corporate Pinterest URL for their customers, so they get the value of Pinterest without having to make their own page.
Thanks, Krin
Thank you so much!! Did Pinterest ever fix the counter? I couldn’t find that code you were talking about. Subscribed and looking forward to learning more!
ReplyHell yeah, this is a FANTASTIC idea. Off to get some pins on my sidebar now. Thanks a ton, Jeni – you ROCK! 😉
ReplyLOVE this tutorial, and I have been doing the widgets this way since I read your post a couple years ago! But now that I switched my website to have the sidebar on the left, when someone goes to pin something from my site, all of the pin it images in my sidebar show up before the images of the actual post, so for example, I have 8 images not related to the post, before the posts images load, which is distracting for people trying to pin one of the images in my posts. Is there a way to hide these widget images from Pinterest so they don’t show up when the “Choose a Pin to Save” page comes up? I tried nopin = “nopin” in the img src but it doesn’t seem to be working?
ReplyHi Debbie,
Unfortunately, that’s a limitation of how web browsers read web pages: they work top to bottom, then a full left column, then a full right column. You’re sending conflicting messages to Pinterest if you have a pin-it button below the image (with a link to pin the image) but don’t actually want it available for people to pin! It’s possible that your Pinterest plugin is interfering with the nopin code as well, but you wouldn’t want to sacrifice a Pinterest plugin for the sake of the sidebar images. Sorry I don’t have any specific solutions for you! If it were me, I’d switch to a right-hand sidebar if it’s a big enough deal. 🙂
ReplyHi Jeni !
My name is Helena, and I am a brazilian blogger on a personal development niche. Thanks a lot for your “pinterest serie”. Here, in Brazil, people doesn´t discover the pinterest´s power for their blogs. I like so much the pinterest, and now, I just know, how I do to get more subscribers to my blog with him ! Thanks a lot ! Sorry about my bad english, I still learning ! Best regards from Sao Paulo – Brazil, the big country in the South America. 🙂
Hey, thanks for the great video! It was very easy to follow, and and it worked great. I’ve only added one so far but I think I might add a couple more. Thanks for the great post!
ReplyJeni! I just did it and it looks great! You always make things so clear and easy to understand – for a non-techy person like me. I couldn’t figure out how to get the # of times it’s been pinned, but I’m happy with it like it is. I may try and figure out how to do it tomorrow. Why do you think it’s important to have the # next to the Pin it button? Do you think my header should say “Most popular pins” or “Most popular posts?”
ReplyEither way you go, Angela, it would work well. The main point is to show that this is your most popular content – so it doesn’t matter whether you call it a pin or a post. When you have the number of times the post has been pinned, it just adds an element of “social proof” – meaning your readers can see how popular it is.
ReplyHi Nicole,
If you’re on wordpress.com, your options are really limited…and if your reasons for using extra plugins or code are important for your business, it may be time to think about moving to self-hosted!
ReplyI loved this tutorial and have started implementing it! The problem I am having is that the pin count number doesn’t look right. The “2” is in the little arrow box, but the K and + are under the arrow box vertically. I have the Pin It Button Lite plugin. I tried it with and without the CSS and it is the same. Any ideas? Here is a link to my homepage. It is the Crazy Good Corn Dip on the primary side bar at the very bottom. Thanks!
ReplyHi! I can’t tell how old this post is but I really appreciate that you took the time in the written instructions to update the information in the video that is now not working – things move fast on the internet!
I’m way behind the eight ball when it comes to Pinterest but hopefully I’ll see a few more people sticking around – Thank you so much.