How to exclude images from Pinterest Sharing using JavaScript

Follow

IN THIS ARTICLE

To exclude all images within a section with ID selector called "sidebar" with jQuery:

<script>
jQuery(document).ready(function($) {
$("#sidebar img").attr("data-pin-nopin", "true");
});
</script>

To exclude all images within a section with class selector called "sidebar" with jQuery:

<script>
jQuery(document).ready(function($) {
$(".sidebar img").attr("data-pin-nopin", "true");
});
</script>

You can also combine the two into one simple statement:

<script>
jQuery(document).ready(function($) {
$("#sidebar img, .sidebar img").attr("data-pin-nopin", "true");
});
</script> 

The following would exclude all images from Pinterest:

<script>
jQuery(document).ready(function($) {
$("img").attr("data-pin-nopin", "true");
});
</script> 

Including the following meta tag in the </head> section of your template would also exclude all images from Pinterest from that page:

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

How to include jQuery in your template

Most sites already have jQuery available. In-case yours doesn't and you need to include jQuery, include the following in the </head> section of your template before you add any of the snippets detailed above. It is critical that jQuery is included before you try to use jQuery.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

You can grab the latest version of jQuery here: https://developers.google.com/speed/libraries/#jquery

 

Instafeed.js

If you're using Instafeed.js on your website and would like to exclude all images surfaced by this widget, you need to add the data-pin-no-pin attribute to the template variable:

<script type="text/javascript">
var feed = new Instafeed({
get: 'tagged',
tagName: 'awesome',
clientId: 'YOUR_CLIENT_ID',
template: '<a href="{{link}}"><img src="{{image}}" data-pin-nopin="true" /></a>'
});
feed.run();
</script>
Was this article helpful?