If you want traffic from Pinterest, it is essential to create a Pinterest perfect image for every post you write. I’ve already taught you about the size your graphics should be and how relevant images help you on Pinterest. Today I want to help those of you that don’t necessarily want those big vertical images in your blog posts.
“Hiding Pins” has become a popular trick amongst Pinterest users. The problem is that most people are using a technique that Google has a tendency to frown on. <display: none>
If you want to stay on Google’s nice list and “hide” an image for Pinterest, use Pinterest code instead. You’ll need to include an image in your blog posts for this to work, but it can be any size: a smaller version of the full-size pin you want Pinners to save, a horizontal image, or even an image CTA.
Lately, I’ve been adding a landscape or square image into my posts, but when people click the pin it button or the hover button, Pinterest will pop up the Pinterest perfect image I’ve created for the post.
Test it out with the image below. Click your browser pin it button or the hover button on the image below and see what pops up. (While you have it open, you might as well pin this post to your Pinterest tips board, wink. wink.)
If you’d like to do this in your blog posts, here’s how.
To start, I add the image I want to show up in the post. In order to hide an image for Pinterest, it has to be attached to an image in the post that you do want to show up.
<img class="aligncenter size-full wp-image-6600" src="https://kristiehill.com/wp-content/uploads/2017/02/hide-a-pin.png" alt="Computer with pinterest feed." width="800" height="600" >
Then, I add this Pinterest code into that image code. I keep this code in a sticky note on my desktop for easy reference.
data-pin-url= this is the URL you want people to visit when they click your pin
data-pin-media= this is the image you want Pinners to save, but not show up in your post
data-pin-description= This is the description you want Pinners to include with your pin
The final product for my image looks something like this:
<img src="https://kristiehill.com/wp-content/uploads/2017/02/hide-a-pin.png" alt="Computer with pinterest feed."
data-pin-description="Hide pinnable images in your blog posts without ruining the flow and branding of your posts" />
If you’re in a time crunch, you can get away with only adding in the data-pin-media to let Pinterest know which image to use. Your readers will just have to fill in the comment description on their own.
Why you can do this and still be on Google’s nice list
“He’s making a list, he’s checking it twice. He’s gonna find out who’s naughty or nice. Google’s always checking your site”(cheesy, yes. true, yes)
When you hide pin images using the display none method, Google might think you’re trying to manipulate the system by hiding content. This is especially true for all you bloggers who are using really heavy keywords in your Pinterest descriptions.
By adding Pinterest data to hide your images Pinterest and Google will be happy with you. You’re not actually hiding any images, you’re just telling Pinterest what image to use. Plus, your readers will be able to save pinnable images to your blog post > resulting in more traffic to your site.
Happy pinning, friends!