Hi Marinela,
Instead of opening Pinterest’s image picker, you can have AddToAny share the page’s main “preview” image to Pinterest by adding a block of code to the plugin.
Add the following code to your “Additional JavaScript” box in Settings > AddToAny:
// Share the page's "og:image" to Pinterest instead of loading Pinterest's image picker.
a2a_config.callbacks.push({
share: function(data) {
if ( 'Pinterest' === data.service ) {
var image = document.querySelector('meta[property="og:image"]');
if (image) data.media = image.getAttribute('content');
}
return data;
}
});
This code uses AddToAny event handling to share a specific image to Pinterest. WordPress developers can alternatively specify the media using the AddToAny shortcode or using PHP code.
Thank you for your prompt reply.
I added the code but that doesn’t resolve my problem. Now when I click on the Pinterest share button it leads me to share the first photo of my post. My question is how to make shareable only the image from my post that I want to be pinnable (not the first photo of every post).
For example, in the link I sent you, that is the last image with the text on it (at the end of my post). I want only that photo to show in the options when someone clicks on the Pinterest button and that one should be shared :)) I hope you understand.
Ah, I see what you’re going for with Pinterest. 🙂
Since the code above uses the preview image “meta tag” set by the Yoast plugin on your site, if you want your image-with-text-on-it to be used by both Pinterest and Facebook, I’d suggest just changing the image with Yoast and keeping the above code.
To use your preferred image-with-text-on-it for Pinterest only, you’ll need to give the image a unique class name. If you’re using the WordPress Editor, tap the image, go the Block tab > Advanced > Additional CSS class(es) and give it a class name such as the-pinterest-image.
Then add the following code to your “Additional JavaScript” box in Settings > AddToAny:
// Share the page's ".the-pinterest-image" to Pinterest instead of loading Pinterest's image picker.
a2a_config.callbacks.push({
share: function(data) {
if ( 'Pinterest' === data.service ) {
var image = document.querySelector('.the-pinterest-image');
if (image) data.media = image.getAttribute('src');
}
return data;
}
});
