As a blogger, Pinterest has the potential to drive huge amounts of traffic to your site. Optimising your blog posts specifically for Pinterest by using vertical images is important, but sometimes it doesn’t suit to have such a long image in your post.
One technique is to hide vertical images in your post so that they aren’t visible to readers but can still be pinned. A lot of posts online will tell you to wrap the image in a div using display:none; to hide the image but this method can be seen as spammy to search engines, especially if you’re adding a lot of keywords to the alt tags of your Pinterest images.
Hiding text or links in your content to manipulate Google’s search rankings can be seen as deceptive and is a violation of Google’s Webmaster Guidelines
This post will explain how to properly “hide” vertical images for Pinterest in your blog posts without annoying Google and other search engines by using code from Pinterest themselves. This code can be added to any image within your blog post but when readers click to share on Pinterest, the vertical image you’ve created will be visible.
How to hide vertical images for Pinterest in your blog posts
1. Upload an image to your blog post that you want visible to your readers. Depending on the platform you’re using, it will look something similar to the following
<img src="IMAGE URL" alt="IMAGE DESCRIPTION" />2. Upload the vertical image you want to use on Pinterest. We’ll store the image on your blog using this method, but won’t actually place it within your blog post.
3. Now add the Pinterest specific code to your img tag, this will specify what you want used.
data-pin-media– lets you specify an alternate version of an image for Pinterest, your vertical image that you don’t want visible in your blog postdata-pin-url– lets you set the click-through link for your vertical image, set this as your blog post URLdata-pin-description– lets you set a default Pinterest description for your vertical image
<img src="IMAGE URL" alt="IMAGE DESCRIPTION" data-pin-media="VERTICAL IMAGE URL" data-pin-url="POST URL" data-pin-description="PINTEREST IMAGE DESCRIPTION" />That’s it! Now the vertical image won’t show within your post but will be available to be pinned by your readers. It will automatically include a link back to your blog post and your set description which can be changed by the person sharing the image on Pinterest.