Tuesday, 12 March 2013

How to Prevent Photos Being Pinned on Pinterest

Pin It!

Yes it is slightly ironic that I am writing  a post about preventing your Blogger pictures from being pinned on Pinterest when there is a "Pin It" button at the top of the page. I love Pinterest and am delighted when people like something I have written/created enough to pin it! Seriously, feel free to pin this post. But there are certain scenarios where you may want to stop a particular image from being pinned.

On the rare occasions when I am using someone else's image(s) I want people to pin from the original source and not my blog because otherwise it's  a little like taking credit for somebody else's work. The "nopin" command means people have to visit the original website to pin the picture. You might have your own reasons for blocking pinning (photos with your children in, link party features, professional photography - there are lots of situations that can arise). So here is some coding that is easy to slip into your posts.

Using the "nopin" command on specific images

The HTML code for the "nopin" command is as follows:

nopin = "nopin"

It needs to be place somewhere inside the img tag of the photo you don't want pinned.

<img src="" width="" height="" alt=""  nopin = "nopin" />


 To do this in Blogger you will need to switch from "Compose" to "HTML" and manually insert the command. It will look something like this:


Once you have added the nopin command to a picture it will no longer appear among the selection of images when you are pinning from a page. 

Using the "nopin" command for an entire site

If you don't want any images from your blog or website being pinned the "nopin" command can also be inserted into your template, so that you don't need to manually add it to every picture you upload.

The following code will need to be inserted into the head tag of your blog template:

<meta name="pinterest" content="nopin"  />

To edit your template in Blogger go to the dashboard and select Template/Edit HTML. If you are not confident with HTML and customizing templates then I highly recommend that you save a copy of your blog template before making any alterations, so that you are covered if anything goes wrong.


Look for the </head> tag by clicking the "ctrl" and "f" key and putting it in the search box. The nopin coding needs to be placed just before the </head> tag



If someone attempts to a pin an image from your website they will see the following message:

"This site doesn't allow pinning to Pinterest. Please contact the owner with any questions. Thanks for visiting!"

You can customize the message by adding a description to the meta tag in your template:

<meta name="pinterest" content="nopin" description="Please do not pin images from this website. Thank you!"  />

Hope you found this little tutorial useful. I'm by no means an expert on HTML and editing blog templates, but if you do have any problems using "nopin" on your website please leave me a comment with your question and I'll do my very best help you!



You might also be interested in:


Blogging Printables
Blogging Printables
Organised Blogging
Blog Planner
Adding a Signature in Blogger
Adding a Signature in Blogger
Adding a Project Gallery
Adding a Project Gallery

15 comments:

  1. Thanks for this info! I do post pictures once in a while that I prefer not to be pinned, so, this is great!

    ReplyDelete
  2. I love this! Thanks for sharing!

    Amberly
    http://amberlyandjoe.blogspot.com

    ReplyDelete
  3. Thank you so much for sharing this! I have been trying to figure this out when I do feature. I will be putting this to use! I found you at Not Just a housewife party and I am following. Please feel free to stop by.

    Thanks,
    Joanne @ Creative mess
    www.jmacreativemess.blogspot.com

    ReplyDelete
  4. This is so helpful!! I do have the occasional photo that I don't want people to pin, so (ironically) I'll be pinning this for future use!

    - Chaney
    Found you through Shabby Creek Cottage link party :)

    ReplyDelete
  5. Thanks for sharing this helpful hint. Stopping from two yellow birds

    ReplyDelete
  6. This is a wonderful tip! I'vwe been reluctant to add a Pin It feature to my blog because I'm having a baby soon and don't want pictures of my kids spread all over God knows where. This'll be a great help!

    ReplyDelete
  7. Thanks for sharing! I am pinning this and will definitely utilize it in the future!

    ReplyDelete
  8. This is a really good idea! I love it for features - I think it's great when blogs feature others work, but it's a bummer when the photos aren't pinned from the original source! Pinning this, lol!

    ReplyDelete
  9. I think it's super ironic that I pinned this but it got me thinking. I don't really want pictures of my son pinned. Thanks for the tip.

    ReplyDelete
  10. I just used this on a picture of my son. Thanks so much for the tip. I feel like a HTML genius.

    ReplyDelete
  11. What a helpful post and much more easy to understand than others I have read... thank you so much! http://www.thebestbydianne.blogspot.com

    ReplyDelete
  12. Thank you Angela for your great tutorials! I'm new to blogger and they are very helpful for me. I already add my signature and the social media buttons to my post template and everything looks good. As I have a code for the hover pin it button in my template, the pin it button also appears on this images and I don't know how and where to place the nopin coding to fix it.

    ReplyDelete
    Replies
    1. I'll be honest, I had to look it up as I've never used the hover version:

      To disable hoverbuttons for specific images, add this code to the specific IMG tag:

      img data-pin-no-hover="true" src="yourimage.jpg" /

      (taken from the Pinterest blog https://help.pinterest.com/entries/23624997-Add-a-widget-to-your-website).

      You can view the image tags by switching from 'compose' mode to 'html' when you write a post, then insert data-pin-no-hover="true" into the relevant tag between 'img' and 'src'. Hope that helps. :-)

      Delete
  13. Thanks for your post. After reading several blogs regarding this situation, I decided to ask you my questions and hope you can take the time to answer. Am I correct that although someone may block a specific pin, someone can still copy and paste it to there personal computer (and if desired then upload it themselves to there pinterest site). So much for the idea that my kid's photo won't end up in pinterest land. My second question is this, is the code used above to block pins only good on a web site and not pinterest? I was hoping to block pins from being re-pinned directly from my pinterest site so no one could quickly duplicate my hard work of creating a custom site for my home town. Sure would appreciate any feedback.

    ReplyDelete
    Replies
    1. Hi. Yes, someone can save a no-pin image to their computer and then upload it to Pinterest manually. Even if you set up your page so that nothing can be saved to somebody's computer I still know of at least one way round it (but you would have to be really determined to got through all that effort).

      You can't block pins from being repinned, as far as I know (might be worth emailing Pinterest directly about that). The only way to stop people repinning your boards is to set it up as a secret board but I'm not sure that would suit your needs.

      Hope that helps.

      Delete

Thank you for taking the time to leave me a comment. I try to respond to as many as possible. :)