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?

If you’re wondering how do I hide a Pinterest sized image in my post, keep reading!

 

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.

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:

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.

 

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.

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?