Pinterest – Sharing featured image on regular button and specific image on hover

Hey guys! ??

I am not seeking help, but rather giving help to others that may want the functionality described below.

I wanted for the universal button (sticky at bottom of page) to share the featured (first) photo of the blog post, and each hover button (on image) to share that specific image.

After checking many questions posted here, this is what I came up with:

a2a_config.overlays.push({
    target: 'img[class^="wp-image-"], img[class*=" wp-image-"]',
    services: ['pinterest', 'facebook']
});

a2a_config.callbacks.push({
    share: function(data) {
		// if we are sharing from the universal button, and not from specific image
		if (data.media != null) {
			return {
				media: data.media
			};
		} else {
			// Get the first image in the post if present on the page
			var image = document.querySelector('body.single article img');

			// If sharing to Pinterest and the image was found
			if ('Pinterest' === data.service && image && image.src) {
				// Set the shared image to the product image
				return {
					media: image.src
				};
			}
		}
    }
});

You have to put the above code in the ‘Additional JavaScript’ part in the Settings.

Use this as a base for your specific case, and adapt it to your needs. What might not work on your side is if the images have different classes. Then you would have to edit the first part of the script.

Cheers