How to Hide a Pinterest Image in your Blog Post

Posted March 27, 2017 by Julie in Tips and Resources, TopPosts, Website and Blogging / 11 Comments

How to Hide a Pinterest Image in your Blog Post

I get it.  Pinterest images are HUGE. And sometimes they just don’t look that great in your post. Would you rather hide Pinterest images in your blog posts?

Hide a Pinterest Image in your Blog Post


Images that are Pinterest-optimized are big and tall and beautiful, but they do take up a lot of visual space in your blog post. This isn’t always a problem, especially when you use these images to break up text and have the blog visually skimmable.

I sometimes put my largest image, or one of them if I have several Pinnable images, at the bottom of the post. Like I did with this post.  Personally, I like the big images. But not everyone likes to have large images in their blog posts.

I have seen some bloggers even suggest loading an image directly into Pinterest and linking to the post, and omitting the image from their blog post completely.  I don’t recommend this practice because you are missing out on all the people who want to pin your post directly. And since Pinterest is a top source of blog traffic, you certainly do not want to lose out on those shares.

I have rounded up some solutions for you!

How to hide an image for Pinterest in your blog post using HTML

Did you know you can hide an image in your blog post and still have it show up as an option to Pin (when someone clicks the Pinterest share button)? You can do this with a little bit of HTML! But you do need to know a bit about HTML to do this successfully.

This post will show you how to hide an image in a WordPress post, but I am sure the method is similar on other platforms.

First, you would load your image with the add media button as you normally would. Then, switch to the “text” editing format of your blog post, and locate that image tag.

Recommended Post:  What important details you should include in a Nanny Contract

It looks like this:

<img src="YOUR IMAGE.JPG" alt="Image Description"  />

Then you add the special div code below, around your image. Specifying the style to display:none (which means invisible!). Like so:

<div style="display:none;">  <img src="YOUR IMAGE.JPG" alt="Image Description"  />   </div> 

Important Note: If you copy/paste the code I share above, please be sure to update the ” (quotation marks). If they look curly, the HTML reader won’t process them properly. Just erase and replace with the ” key again while in your text editor, and all is well.

It looks like this screenshot in the code:

Hide a Pinable image in your blog post

I like to put this hidden code at the very top of my blog post, so the hidden image still gets picked up for my theme preview and social media shares. You know, the ones that insist on picking the first image in your post?


How to hide an image for Pinterest in your blog post WITHOUT using HTML

Hey, I hear ya. Sometimes messing with HTML code is just not easy. Here’s another option for you to hide an image in a blog post- no coding required!

When you load your image with your add media button, you can specify the size.

Pick full size when you load the image, and then hover over the image itself in your visual editor, and select the pencil.

Select custom size and make the image 1px by 1px. Woot, that’s practically invisible, looks like an empty space, and boom, no image showing up. But when you click the “Pin it” button? The image is there.

Hide Pinable Image


How to not hide an image for Pinterest at all

There’s yet another option that’s kind of a bonus for ya! If you don’t want to mess with all this, but prefer the option I mentioned at the start – loading the image directly to Pinterest and linking to your post, here’s what you can do.

Recommended Post:  15-Minute Family Favorite Dinner: Salsafied Chicken and Rice

Simply grab the link to your pin from your account and add a link to it in your post.

You can say something like:

Enjoyed this post? Pin it! 

And link the words “pin it” to your pin that you just uploaded!

Alternatively, you can use Pinterest’s widget builder to embed the pin, but smaller. Just thought I’d throw that option in there. Call it option #4.

Not only will this allow people to share your post on Pinterest, but it counts as a RE-PIN to your original pin, which is extra brownie Pinterest points for you!


There you have it, folks! Three (four?) different ways you can hide an image in your blog post, or even omit the image entirely, and still have it pinned on Pinterest.

Over to you – do you include large Pinterest images in your posts or do you hide them?


How to Hide a Pinterest Image in your Blog Post



Join the Working Mom Tribe

Join the Working Mom Tribe and get support and tools to help you thrive! Tribe members get access to my library of resources and printables.

Powered by ConvertKit
JuliepicI'm Julie, a new mom who works full time and blogs, all while wishing I had more time to read fun books. I write about being a first time working mom in order to help myself and other working moms in our journeys to find balance between family, responsibilities, and hobbies so we can thrive both at home and at work.
I can be found blogging at Fab Working Mom Life and Chapter Break, and hanging out on social media: Twitter ~ Pinterest ~ Facebook ~ Instagram

11 responses to “How to Hide a Pinterest Image in your Blog Post

      • I used the code. But I have a new theme for the second blog I’m starting- I still can’t hide pins on my other blog with my current theme! I think it’s because that theme is from Etsy and not WordPress!

    • There are tricks for everything heh. But especially when people have like 5 different pin images per post, you just can’t display them all.

Leave a Reply