SEO and Pinterest Description Secrets

SEO and Pinterest Description Secrets

SEO and Pinterest go together like bread and butter. Not only is Pinterest a search engine (yes, really) it can also help to boost your search engine rankings! But Pinterest and SEO can sometimes be at odds can run into serious trouble when making our websites best fit what works on Pinterest. Namely, it’s when we use alt text for Pinterest descriptions.

As well, Pinterest can be a total pain in the butt when it comes to getting what you need out of it.

  • Pinterest friendly images can slow down our websites – Bad for SEO!
  • We’re not capitalizing on Pinterest search and Related Pins – Bad for Pinterest SEO!
  • People who click through often end up at the homepage – Bad for Pinterest SEO!

Guess what? Pinterest has a secret solution for these problems. And when you use it, you can actually get more pins than you did before!

Video Tutorial – Learn how to hide images for Pinterest

Improve SEO by Hiding Pinterest Sized Images

Pinterest-Call-to-Action-ToolPinterest images are typically MASSIVE. And slow down loading our websites, which isn’t great for SEO. But did you know that Pinterest allows you to display one image but allow readers to pin a completely different image?!?

Yup. Mind blown when I discovered that.

It’s also handy to create Pinterest specific calls-to-action for your images!

The image on the right appears on my blog post that went viral on Pinterest a few years ago. It blew up the number of pins created by my website visitors and has brought an enormous amount of traffic to my website to this day.

But this image with a call-to-action like this is not what we want on Pinterest. A CTA like that is a bit odd on the platform, but not odd on your blog.

You can do this with some extra fancy HTML behind the scenes. Don’t worry, it’s easy!

Improve Pinterest SEO With One Step

Pinterest works through javascript and pulls all the information it needs to create a pin through this code. Basically, when someone clicks the Pin It button on their browser bar or on your website itself, it executes code that hangs out over on Pinterest’s website and pulls up the Pinterest pinning overlay on your website, which looks like this.

How to hide images on your blog for Pinterest

On this post, you’ll see that when you click the Pin It button, there’s a longer version of my pin that pulls with a different description than what’s in my alt-text. The image is also full sized dimensions for Pinterest, rather than the small size that’s available on my blog itself.

As well, if someone clicks the Pin it button while on my image in my post at the bottom of this post, the special description will pull up in the Pinning window:

You can hide a special Pinterest Description in your code

Inside the code behind the scenes, I’m creating the Pinterest description than what’s in my alt-text. Take a look at this:

How to hide Pinterest images on your blog

That’s probably a bunch of nonsense to you, but if you look, it has one description that is in the alt tag that reads “Learn how to use Pinterest descriptions to get more repins and have better SEO” but the Pinterest description that appears when pinning starts “Pinterest provides better tools” and is different than the SEO optimized alt-tag I created.

Here’s how you hide special Pinterest images and descriptions on your site:

You can use the following code to tell Pinterest where to get the image, a special Pinterest description, what individual post URL the pin comes from, and what publisher pin to repin from. For Pinterest SEO, having repins of your original pin can do wonders for turning up in Pinterest search!

<img src="http://yourblog.com/your-image-url.jpg" alt="SEO description goes here" 
data-pin-description="Pinterest specific description here" 
data-pin-url="http://yourblog.com/posturl" 
data-pin-media="http://yourblog.com/wp-content/uploads/year/month/imageyouwantthemtopin.jpg"
data-pin-id="PinterestIDNumber"/>

Learn how to use Pinterest descriptions to get more repins and have better SEO

  • data-pin-description: The all-important Pinterest Description!
  • data-pin-url: The link where you want the pin to point to!
  • data-pin-media: The link where a Pinterest friendly image lives!
  • data-pin-id: Your original pin from the article!

When you’re inserting your image on whatever CMS platform you’re using (WordPress, Squarespace, etc), you want to insert the image like you normally would and create your SEO optimized alt tag. Then look at the code behind the scenes. In WordPress, you’ll click the Text tab in your editing window to get to the code that creates the image. You’ll also want to upload your Pinterest-friendly image to your website but not embed it into your post.

You’ll see code that starts off with img src, like in the above code, and your alt tag you created. After the final quote mark after the alt tag, you want to write out the Pinterest specific code. You can copy the code below and change the bits inside the quote marks for your own information.

data-pin-description="Pinterest specific description here" 
data-pin-url="http://yourblog.com/posturl" 
data-pin-media="http://yourblog.com/wp-content/uploads/year/month/imageyouwantthemtopin.jpg"
data-pin-id="PinterestIDNumber"

 

You’ll need to grab the URL where the image you want to be pinned, your Pinterest-friendly image, lives on your site. If you’re a WordPress user, go to Media, click on the image and copy the link in the URL that’s show in the URL field. You’ll paste this URL to replace my placeholder URL the data-pin-media line. This tells Pinterest to pull the hidden image instead of the image that’s actually showing on your blog post.

The important part here to know is that if you haven’t yet pinned your post, you don’t want to include the final line where it says data-pin-id because this is the ID number of your first pin. Since Pinterest has changed the way they’re showing repin counts, I’m unsure if this is important anymore to Pinterest SEO but personally believe that it’s still important to include. You can add that last bit of information about your pin after you’ve published your post.

If you get a little lost, take a look at the code of my site and look for the final image on the page to see how I used this code.

VIDEO TUTORIAL – Step-by-Step Tutorial to Hide Pinterest Images

Keep in mind some plugins will prevent you from using this additional code bonus. But it’s a great way to use Pinterest and capitalize on Pinterest SEO without messing up traditional SEO.

Don’t know how to select keywords? Be sure to check out my SEO 101 course where I teach you how!

Don’t forget to pin me and see how this works! >>>>

  1. Hi Kim! I am very confusing about this. Is this code for all the images or a specific one for example, a hide image? What happened with the alt text needed for SEO in google search? I’ve been uploading to the boards different images that I have in the blog (large ones) and fill the information. Can you please explain further how to use the code? Thanks!

    1. So to answer your questions:

      1- This is for a specific image, but you can use it for all of them by editing the HTML behind the scenes. To add it to a featured image you’ll have to get into the code of your website and add custom fields, so this is really for images inside of your post body.

      2- The alt text is still there too! I’ve added an example so you can see it a bit better of how the code works in real life.

      As I replied to another comment of yours, I’ve updated the post! But wanted to answer you questions in case someone else had the same ones too.

  2. Hi Kim. Can you please explain further about how this code works? Where to put it? I am interested but I am confused how to use it. Thank you!

    1. Thanks for your question! I revised the post to explain it better. Take a look again and let me know if you still have questions.

      1. Oh yes, I just looked at it and that’s better, thanks. My only question is about the hide image, if I upload the image how does it remain hided? I’ve been hiding some with the tag diplay: none and they show up when you click the button. Thanks again!

        1. You want to just upload but not embed. So if you’re in the editing window on WordPress and click “add media” you want to upload but then uncheck it and just use the URL that you can grab of where the image lives in your wp-uploads folder. It’s the URL at the top of the pane where you’d normally write the alt text.

      2. Great tips but I’m also confused. I followed all the instructions but then you say to copy and paste this code in the text editor where the image should go? When I changed out the items between the “” the code was showing. Did not work for me so must be missing a step. In one of the comments you mentioned you added a video but could not find that.

        data-pin-description=”Pinterest specific description here”
        data-pin-url=”http://yourblog.com/posturl”
        data-pin-media=”http://yourblog.com/wp-content/uploads/year/month/imageyouwantthemtopin.jpg”
        data-pin-id=”PinterestIDNumber”

        1. You’ll need to put it into the img src code in your text tab if you’re on WordPress.

          In other words you’ll have:
          img src="http://yourblog.com/wp-content/uploads/year/month/imageyouwantdisplayed.jpg" data-pin-description="Pinterest specific description here" data-pin-url="http://yourblog.com/posturl" data-pin-media="http://yourblog.com/wp-content/uploads/year/month/imageyouwantthemtopin.jpg" data-pin-id="PinterestIDNumber"

          You’ll want to put this inside of a single <>

          If you look at the sign up boxes included throughout the post, you can sign up for access into the video where I explain it a bit better. It requires email signup to gain access to it.

  3. Loved your talk on Simple Pin Media podcast and jumped over here for this delicious nugget of Pinterest wisdom. I’m not exactly clear on where to put this html, though. Do you have a tutorial that spells that out for tech newbies? TIA.

    1. Thanks for listening, Christine! Recording that episode was a blast. I’ve revised the post to better explain how to use the code. Take a look and let me know if you have any questions!

  4. This is very interesting. I am not all that clued up on coding but have been looking for a way to optimise my site but still get good pins off the posts. What I have been doing is pinning an optimized image which is different to the post but want to have it in reverse too so that readers still get good pins and my site isn’t slow.

  5. Is there a way to do this if I have a gallery of images? Not like a slideshow, just two side-by-side images set up as a gallery. Right now the code looks like this [gallery columns="2" link="none" size="large" ids="2669,2670" ], which is so very different from the code for a basic image. I wouldn’t even know how to begin with this?

    1. Thanks for your question, Mackenzie!

      There’s no straightforward way to add meta data to shortcodes without having to dig into the code that creates the shortcode in the first place (which is what it’s called when you have code between [] like in your example). It’s likely the shortcode is created with a plugin or an extension of your theme so you could edit the files there to add custom fields to allow meta data to be added in — but this is pretty advanced coding and is beyond the scope of the coding advice I can provide! Sorry I can’t be of more help here.

      I’d ask your theme developer if they can share any insight in how to add this function.

  6. Hi!
    Thanks for the great info! I have an idea & request . I am a newbie & think it would be a good idea to offer a short pdf guide in STEP 1 then STEP 2 ect., format. It would be a great way for you to get subscribers on your email list if everyone had to opt-in to get the pdf guide.

      1. Thank you 🙂 I have not seen anyone else describe your method & I am no where near as tech savvy as you & need the kindergarten version lol

  7. New to the Pinterest game and this is a great tutorial. I have two questions…where is the best place to find out what the current optimal size for Pinterest photos is? Also, maybe a dumb question, but what if someone does not choose the “Pinterest optimized” photo and chooses the one made for your blog instead? Does this just not happen that often?

    1. The current size is 735px by 1100px, according to my pal Kate over at Simple Pin Media. She has great resources for Pinterest marketing and I totally recommend going to check out her site! People generally pick the pinterest sized image because they want to see something that’s big and beautiful in their boards—-but if you use this tutorial to add the extra code, only the correct image will show up for pinning! I hope that helps.

  8. I’ve added the data-pin-… code to a few of my sites, and it was working correctly – but now it seems to have stopped working. The pins come up with my “pin this” image instead of the data-pin-media I have specified. I don’t know if you’re still active in this, but if you are, could you take a look? Thanks!

    1. I took a look at your most recent post on your Texas Emoji site & looks like you didn’t switch out the Pinterest ID number with the original pin ID number. That’s going to cause issues and might be why it’s having trouble. Do you have any examples of others that are having issues? Feel free to share a link here and I’ll take a look!

      (also, as an OU fan, I feel morally obligated to say F*** Texas. Sorry. I’d lose my street credit if I didn’t! ?)

    1. Thanks for sharking, Brianna! I’m definitely going to be testing that plugin out and will add it to this post if it works as intended. I’d always wanted to set aside time to make a plugin that did this so I’m happy someone else did!

Leave a Reply

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

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Get more Pinterest Traffic with Pinterest SEO
Up Next:

The Ultimate Guide to Pinterest SEO

The Ultimate Guide to Pinterest SEO