Search code examples
metametatag

apply "nopin" to "og:image"


I'm not a coder but I was able to build my site from nonstop searching for "how to do xxxx" on this site. Thank you all so much for the posts and info!

I want to know how I can apply the "nopin" tag for pinterest to my "og:image"

Here is a link to a sample page http://jamesngart.com/harvester.html

I made a horizontally cropped image of the illustration to be used as the og:image for facebook and twitter links, but I dont want pinterest to pick it up. I used the nopin tag for some images that I dont want pinned and it worked, but I cant seem to apply it to the OG:image.

pin interest is also not picking up any of the data-pin info i enter, I was thinking to add "this is a cropped image please pin the others" but nothing works. Here is my code:

    <meta property="og:image" content="http://jamesngart.com/img/OG-Harvester.jpg" nopin="nopin" />

Thank you!

James


Solution

  • Don't add the nopin attribute to the facebook open (og) graph metatag.

    Instead create a new meta tag and add it below or above the opengraph tag. In the following example - pinning is disabled for the whole page:

    <meta property="og:image" content="jamesngart.com/img/OG-Harvester.jpg" /> <meta name="pinterest" content="nopin" />

    If you want to disable pinning per image you have to add the nopin attribute to the image (IMG) tag:

    <img src="jamesngart.com/img/OG-Harvester.jpg" nopin="nopin" />

    Read more about pinterest data-attributes and metatags in this article at csstricks