In this video, I'll walk you through step-by-step how to create hidden pin images for Pinterest.

I adore Pinterest. And Pinterest adores nice long pinnable images. What if you don't want to clutter up your blog post with a giant, long image? My friend, you've come to the right place. With a little CSS code, and adding the class to the image, we can work some Pinterest magic.

First, let's make a secret image. My pinnable images are 735px x 1470px. If you don't have Photoshop, you can use Picmonkey.com or Canva.com to create your image.

The anatomy of a great pin image

A great pin image has:

1. An image that relates to the post.
2. The title of the post in an easy to read font. Seriously, readability is your friend. Save your fancy fonts for Instagram.
3. Eye-catching colors.
4. Points out the Extras – like Free Download, Video Walkthrough,  Downloadable Template – basically your content upgrade for the post if you have one.
5. Your URL!

Got your pin image ready, then it's time to place it in your blog post.

1. Open up your finished post in WordPress, click the “TEXT” tab so you're in code mode.
2. Put your cursor at the very front of your first word so your pin will be the first image that shows up.
3. Click “Add Media” and upload your Pin image. Don't forget to add your alternate text and description to the image. That's important.
4. Find the class area of the code, shown here as in example in pink: <img class=”alignnone size-full wp-image-4709 hidden-pinterest” src=”//yoursite.com/wp-content/uploads/yourpinimage.jpg” alt=”Make Sure You add Your Title here in the Alternate Text” width=”735″ height=”1470″>
5. Add hidden-pinterest inside the quote mark at the end of your image class, note do not add the period in front of hidden-pinterest (see above).
6. Copy the CSS code and add it to your CSS style sheet.
7. Go and Pin your new pin!

Copy this CSS CODE below and add it to your CSS Style sheet:

/*——Hide Large Pinterest Images—-*/

.hidden-pinterest {
opacity: 0;
position: absolute;
top: 0;
left: 0;
height: 0px;
width: 0px;
}

How did this work for you? Leave me a comment below and include your Pinterest URL, too! Follow my boards here.