AMP pages Display Custom Pinterest Image

The Pinterest image is added with an inline style of display:none; and a Pinterest related data-pin-media="true" attribute. It looks like both of these are being stripped from the image output by the AMP plugin by whatever the plugin does to modify the images for AMP output.

The plugin currently does not add a custom class to the image output, but I will add one so that you could add some CSS to your AMP pages to hide the image. (If you are comfortable updating plugin files manually, you can download an updated version of the plugin from Github, the develop branch, specifically just the Pinterest output class). However, without the Pinterest attribute, I do not think that you would get the benefit of the hidden image as it relates to Pinterest. This is being removed, probably by the AMP plugin, so you would need to see if you can change that behavior.

Hi Robin,
Thank you for your quick response and your willingness to help.
Frankly, I don’t feel comfortable with updating plugin files manually, so I would prefer the “adding some CSS” option, or some other option for an ordinary user:)
I agree with you that a hidden image won’t give any benefit but two identic images (difference in size only) don’t look great either.
Ideally, I would be happy if the Pinterest sharing button provided by AmpforWP could use the custom Pinterest image provided by your plugin, but I don’t know if it’s really possible. Unfortunately, at the moment the AMPforWP’s Pinterest button pulls the post’s featured image to share on Pinterest and displays your plugin’s custom image at the end of the content.

The custom image class will be in the next update, so you’ll be able to add some CSS at that time. However, I don’t think that having the image hidden will override the AMP plugin sharing button’s behavior–that is likely coded to use the featured image, regardless of what other images are in the content. And with the Pinterest pin attribute removed by the AMP plugin as well, the custom Pinterest image may not be offered as an option by Pinterest’s own JavaScript, if a user has its bookmarklet or whatever installed. It might; I’m just not sure.

Thank you Robin! Well, at least it will solve the problem of two images on the page. The AMPforWP plugin lets the user add some custom CSS. Will you be so kind as to give me the code when you make the update ??

Thank you so much, Robin! I’ve updated your plugin to 3.1, and the excess image has disappeared from AMP pages.