Today I’m coming at you with a quick Pinterest tip. How to hide Pinterest images in your WordPress blog posts.
If you’re a Pinterest user you’ve probably already noticed that all the images on Pinterest are long and vertical. But, this type of image may not fit with your blog post layout.
Your blog’s featured image may be square or horizontal. So how do you add vertical pinnable images to your blog without changing the layout?
I found this easy to use trick to add pinnable images to your blog, without changing the layout.
Hide a Pinterest Image
There’s two main benefits of hiding Pinterest images on your blog.
- Maintain a clean blog layout – no need to add multiple long vertical images throughout your blog post which can be distracting to readers
- Pinterest loves new content – by changing up the hidden Pinterest images every couple of months you can trick Pinterest into thinking the content is new so your post will get seen more
Instead of having a vertical image as your blog post’s featured image, I’m going to show you how to add a hidden image. That way, when someone clicks the Pinterest share button on your post the hidden image that’s optimized for Pinterest will appear.
Here’s an example from my own blog to show how I use hidden Pinterest images on my blog.
This is a screenshot of a recent blog post. As you can see, the featured image is horizontal.
But, when someone clicks on the Pinterest share button here’s what they’ll see:
On the bottom right you can see the blog post featured image. To the left of that there’s another image that doesn’t appear anywhere in the blog post. This image is a long vertical image specifically made for Pinterest. So when someone wants to pin this article, they will be able to choose the image that is optimized for Pinterest.
How to Hide a Pinterest Image in your WordPress Blog
- Create a pinnable image (you can use a free progam like Canva to create Pinterest images)
- Add a new post or edit a published post in your WordPress dashboard
- Place the pinnable image in the body of your post (I place mine at the bottom of each post) To upload your pinnable image, in the WordPress post editor click on ‘add media’, upload your pinnable image – now you should see it in your blog post
- Switch from the visual editor to the text editor (as seen below)
- Place this code directly in front of the img code
<div style=”display: none;”>
- Place this code directly after the img code
- Switch back to the visual editor – you shouldn’t see the image in your blog post anymore
Your code should now look like this
Troubleshoot: If you can still see the image when you switch back to the visual editor, go back into the text editor. Check to make sure an extra “ didn’t get added to the code. This happens sometimes, as shown below. Just remove the second “ and you should be good.
Now, when a reader clicks your Pinterest share button, all of your hidden images will appear. If you add more than one Pinterest image your reader can choose which image they want to pin.
Tip: Don’t go crazy and add a lot of hidden images. Even though the images don’t show up in the post, they still have to load in the background. If you have too many hidden images it can slow down the load time of your site. I suggest having only two hidden Pinterest images at a time.
If you want to learn how to monetize your blog (even if it’s brand new), check out Monetize Your Blog With Affiliate Links and Pinterest
Did you find this Pinterest tip helpful? Be sure to pin it for later so you’ll always have access to the instructions.