15

Hi I have chrome Pinterest plugin installed and when it is enabled, I see "Pin It" button (on hover) on all images on my website, How can i stop "Pin It" button to appear on my website, even when a chrome extension is enabled

After googling, I found the following on a blog:

You can easily disable this as an individual who has installed the extension, but if you don’t want it to conflict with any other social software you may have on your site, all you need to do is add this to ever IMG tag:

<img src="myimage.jpg" data-pin-no-hover />

But that's for single image, is there any other way to override the plugin to disable "pin it" button from chrome extension? using JS/jQuery?

Chrome extension js: http://assets.pinterest.com/ext/cr.js

EDIT

<img src="myimage.jpg" data-pin-no-hover /> doesn't seem to work anymore

7 Answers 7

26

Okay I just read the Pinterest documentation, To disable the pinterest on a page or website, just add a meta tag:

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

And pinterest button will stop appearing on the website anymore.

1
9

Edit, sorry should say that my response addresses your edit specifically:

You need to specify the true switch for the attribute if you just want to disable the hover pin it button on one image.

<img src="myimage.jpg" data-pin-no-hover="true" />

... will do it

2
  • 2
    data-pin-no-hover="true" doesn't work anymore, use nopin="nopin" help.pinterest.com/en/articles/… Commented Apr 27, 2018 at 6:18
  • 1
    @SaurabhSharma actually it still works; in fact it worked over nopin= "nopin" for me ..
    – Snerd
    Commented Jan 2, 2023 at 20:53
6

If you want to disable the hover pin it button on Google Chrome, use this mark up in your HEAD:

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

You can read more about it on Pinterest's blog: http://businessblog.pinterest.com/post/77184942682/a-smarter-pin-it-button

using the no pin code disables pinning on that image

Hope that helps,

Kristie

1
  • Thanks, That's a nice solution too :) Commented Aug 3, 2014 at 11:52
3

I spent hours to figure this out, only to find that it is as easy as adding this to your image tag

nopin="nopin"

1
  • @j morley this helped me
    – shivgre
    Commented Feb 19, 2017 at 19:09
2

You have two methods:

1) Disabling it to a single image (Charlie's answer), as you'd have done, but you have forgotten the value "true", it is necessary:

<img src="myimage.jpg" data-pin-no-hover="true" />

2) Disabling it to the whole document (Saurabh Sharma's answer), at document's <head>:

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

You just have to chose which case will suit you better.

0
0

If you want to disable it for all images, you could try the following jQuery:

$('img').attr('data-pin-no-hover', '');
2
  • Please check the edit as data-pin-no-hover doesn't seem to work anymore Commented Mar 6, 2014 at 18:01
  • Would you be able to provide the url for the website in question so I could see the markup? Commented Mar 6, 2014 at 18:06
0

Charlie's answer from Mar 12 '14 at 20:34 is now outdated. The most reliable method is to add nopin="nopin" as an image attribute:

<img class="block__el--hide" src="path/imgname_1500x900.png" nopin="nopin">

~DR

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.