How to Hide a Vertical Image for Pinterest

Quick Navigation

[et_pb_section fb_built=”1″ admin_label=”section” _builder_version=”3.0.47″][et_pb_row admin_label=”row” _builder_version=”3.0.48″ background_size=”initial” background_position=”top_left” background_repeat=”repeat”][et_pb_column type=”4_4″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_text admin_label=”Text” _builder_version=”3.13.1″ text_font=”||||||||” text_font_size=”18px” background_size=”initial” background_position=”top_left” background_repeat=”repeat”]

In this post, 10 Reasons No One Is Pinning Your Post and How to Fix That!, one of the solutions that I shared was to include hidden images for Pinterest.

You will want to hide vertical images for Pinterest if you just don’t care for vertical images in your blog posts or if you want to include extra images for your readers to choose from when pinning – which is something that I recommend!

But be sure to read about Issue #2 before you decide not to include a vertical image.

If you don’t know how to include a hidden image, don’t worry – there are two super easy ways to do it!

Note: This post contains affiliate links, which means that if you buy something using one of the links in this article, I may earn a commission, but… It won’t cost you anything extra. Want to learn more about how you can make money blogging with affiliate marketing? ? Read this…

Affiliate Marketing for Bloggers – A Beginner’s Guide.

Option 1 – add html code directly in the text editor to hide the image.

I’ve included screen shots below to show you exactly how to add the necessary html code to hide any image.

First, insert your image as usual. In the text editor, you will see something like this…

How to Hide Pinterest Images

In the screen shot below, you can see the image displayed when I preview the post.

How to Hide Pinterest Images

Now, to hide the image, go back to the text editor and add the following:

Before the html for the image, add:

< div style=”display:none;” >

*** without the space after < and before > ***

After the html for the image, add:

< /div >

*** again without the space after < and before > ***

You can see the same image inserted in the text editor with the extra code below.

How to Hide Pinterest Images

Now, when the post is displayed again, the image is hidden! That’s all there is to it. 🙂

How to Hide Pinterest Images

Click on the Pinterest share button and you will see that the hidden image is still available to pin.

How to Hide Pinterest Images

Option 2 – add a ‘style’ in your theme’s header scripts.

For this method, add a style called ‘hidden-pinterest’ as shown below.

< style >

.hidden-pinterest {display:none;}

< /style >

*** Just remove the space after < and before > ***

How to Hide Pinterest Images

I use Beaver Beaver page builder to edit my posts, so I just click on “Add Content.”

How to Hide Pinterest Images

Click on the arrow next to “Basic Modules” to choose the type of content you want to add.

Then click on “Photo,” hold and drag to the row where you want to place the image, The Photo Settings window appears. Click on “Select Photo.”

How to Hide Pinterest Images

Select a photo from the media library.

How to Hide Pinterest Images

Be sure to edit the Title and the Alt Text.

How to Hide Pinterest Images

Click on the Advanced tab at the top of the Photo Settings dialog box.

How to Hide Pinterest Images

From the advanced tab, you will need to scroll down until you see the CSS Selectors area.

How to Hide Pinterest Images

Type ‘hidden-pinterest’ in the ‘Class” field.

How to Hide Pinterest Images

Save and preview. The image is now hidden.

How to Hide Pinterest Images

Click on the Pinterest share button and you will see that the hidden image is still available to pin.

How to Hide Pinterest Images

Are you already using hidden images in your blog posts for Pinterest? If not, give it try.

If you are, consider adding additional images to ‘test’ which one gets the most pins.

And be sure to read this post to learn about 10 reasons no one is pinning your post and how to fix that!

Did this work for you? If it was helpful, I’d love for you to pin this post! Of if you haven’t tried it yet, pin it to refer to later.

[/et_pb_text][et_pb_image url_new_window=”on” src=”https://www.chantelarnett.com/wp-content/uploads/2017/05/How-to-hide-images-in-blog-posts-for-Pinterest.jpg” _builder_version=”3.13.1″ url=”https://www.pinterest.com/pin/80783387049265713/”][/et_pb_image][/et_pb_column][/et_pb_row][/et_pb_section]

Share:

Share on pinterest
Pinterest
Share on facebook
Facebook
Share on twitter
Twitter

2 Responses

Leave a Reply

Your email address will not be published. Required fields are marked *

Hey there! Need help writing your welcome email series?