How To Create “Hidden” Pinterest Images

With Pinterest being one of the best search engine marketing tools to date, creating eye-catching Pin-able images is a must for any blogger.  When you create great Pinterest-specific graphics which include the title of the post on the actual image, the visibility of your blog post can reach new heights.  Many bloggers are already practicing this and include Pin-able images within their blog posts.

But, what if you’ve created a post but don’t want to include the Pinterest-specific graphic within that post directly? Or what if you want to include a variety of options for Pinterest images to share? You’ll need to hide Pinterest images from your visitors.

If you click the Pin button on this page, you will see that there are options for Pin-able images that are not present on this blog post at all. How is it done?

It’s really pretty easy and just requires a little bit of basic CSS.

  1. First, upload all of your Pinterest-friendly images into your post. I usually add them to the very bottom of the post to keep things extra simple.
  2. Switch on over to the Text/HTML composer view
  3. Before your first “secret” image code, add the following code: <div style="display:none">
  4. And after the last one, close the open code with this: </div>

Hide your Pinterest images!

What this does is hides the image from your actual post, but because the Pinterest share buttons pick up all images on the page and do not read your HTML, they become visible in the sharer.

So easy, right?!  Why not try it out and give this post a Pin 😉

Hide your Pinterest images with CSS The best way to add more Pinterest images to a post!

Was this article helpful?

Related Articles