When it comes to Pinterest for bloggers, any blogger can tell you how importaint it is to include striking Pinterest images in their blog posts. There are many ways to do this, amd a million WordPress plugins that can help you do it. The truth is that with a few simple lines of code you do not need to use a WordPress plugin to manage your Pinterest pins!
The question you may be asking yourself right now is “Well, why wouldn’t I be using a WordPress plugin?”. Good question! In our guide to picking the best WordPress plugins we talked about a few importaint points.
The first thing to remember is that every time you install a WordPress plugin on your blog, it takes up your blog’s resources, potentially slowing it down. That is why it is important to pick a plugin that can do as many things as possible (like the All in One SEO Pack plugin for example) and make sure you really do need a plugin to accomplish what you want to do!
Let’s take a look at what a Pinterest pin really is, and then how to easily put them in your blog posts without a WordPress plugin.
In This Guide
What Makes Up a Pinterest Pin?
When it comes to including Pinterest pins in your blog posts, the pin itself really breaks down into a couple things:
- Pinterest pin image
- Pinterest pin title
- Pinterest pin description
- Pinterest pin URL
If we include all this information in our pin, it makes it easy for our readers to post directly to their Pinterest boards with little effort.
Now, let’s look at a step by step process for adding this information to our pin in our blog post.
how to add pinterest link to wordpress blog
How to Add Pinterest Link to a WordPress Blog – Step 1 – Upload Your Pinterest Pin (Pinterest Image)
Start by uploding your Pinterest pin or image to your blog post, and make sure you fill out your alt tag information. Then, click the Text portion of your WordPress editor. You will see something like this:
<img class="aligncenter wp-image-931 " src="https://yourwebsite.com/your-pin.jpg" alt="your alt image tag information here" width="350" height="525" />
- img class=”aligncenter wp-image-931″
Don’t worry about this too much. It is just the code telling WordPress you uploaded an image, you may see slighly diferent text here based on what WordPress theme you are using. The key is img - src=”https://yourwebsite.com/your-pin.jpg”
This just tells WordPress where you uploaded your image. You will see your website URL and your media path here. Remember to give your images a name that include keywords! - alt=”your alt image tag information here”
When you enter your alt tag information, you will see it here. - width=”350″ height=”525″
These are the specific values I use, and they are represented in Pixels. I use the same dimensions for every Pinterest pin I upload. Be sure to pick a size that looks great on your website.
This is your basic image tag! I hope you are using the alt attribute when you upload images to your website. It can help you when it comes to SEO. Be sure to check out the guide to easy SEO to learn more!
There are a few more things we need to do to make sure our blog images are Pinterest friendly.
Step 2 – How to add Pinterest html tag to WordPress
We are going to add two simple tags to the above in order to make sure we are optimized for Pinterest
- data-pin-description=”Your pin description here, optimized for #Pinterest!”
This is the description you would write just like if you were uploading a pin to Pinterest or scheduling a pin in Tailwind. - data-pin-url=”https://your-blog.com/post-url”
This is the URL of where you want the pin to go when somene clicks it. This is very importaint to fill out if you are including a pin to a different blog post. You will also want to make sure you make your image a hyperlink to that post when you include a pinterest pin on another link in your blog. - data-pin-title=”Your Title Here”
Pin titles have become a big thing since I originally wrote this guide, so if you want to specify your pin’s title, you can use that HTML snippet. If you don’t use this, it will just pull the title from your blog post, which may or may not work for your pin!
How to add Pinterest Image to Blog Post – Step 3 – The Finished Product –
Here is the first example of how to put a Pinterest pin into your blog:
<img class="aligncenter wp-image-931 " src="https://yourwebsite.com/your-pin.jpg" alt="your alt image tag information here" width="350" height="525" data-pin-title="My Great Pin!" data-pin-description="Your pin description here, optimized for #Pinterest!" data-pin-url="https://your-blog.com/post-url" />
I always use the data-pin-description tag first, then the data-pin-url tag second, just for consistency. Also, please note the space between the final /> which closes your HTML tag.
If you want to use data-pin-title, it can go wherever you want actually, it does not need to go before the url or description. I have been putting it before.
If you want to make sure the pin is also a clickable link, the code would look like this:
<a href="https://yourwebsite.com/blog-post-url"><img class="aligncenter wp-image-931 " src="https://yourwebsite.com/your-pin.jpg" alt="your alt image tag information here" width="350" height="525" data-pin-description="Your pin description here, optimized for #Pinterest!" data-pin-url="https://your-blog.com/post-url" /></a>
You can see the addition I made in bold. We wrapped our image HTML code with the link code. In case you were wondering, href stands for hyper refrence, like a hyper link.
Testing Your Pinterest Image for Your Blog Post
I always test my pins when I am previewing a post, or right after I have published it. I prefer to use Tailwind to test my pins, so I can easily see all of them at once.
First things first, I use Tailwind to schedule all of the pins in the post, I can immediately tell where I have issues just by looking at it at my Pinterest pins for my blog post:
In this case, it is clear that the Pinterest pin description did not work. Here are a couple of reasons why it may not have:
- You simply forgot to include it (oops! it happens!)
- You do not have quotation marks enclosing the pin description as shown in the example.
- You do not have a space before the final closing of the HTML tag ( />)
All of these are simple to fix! The next thing we need to check is that our URLs are correct, as illustrated here:
Just click in the spot with the URL, and you will see the complete URL. Make sure it is correct for each pin! It may be incorrect for any of the reasons above! You can use the same steps to fix them.
After you have verified your pins are correct, you can of course schedule them right there with Tailwind! I have mentioned Tailwind a couple times, and it has been my most essential tool for managing my Pinterest account, including manging and scheduling to group boards, and buidling my follower base.
Tips for Managing Pinterest Pins on Your Blog
Now, let’s summarize what we learned in this post, and a few more tips I have for managing Pinterest pins on your blog, and in general.
- Decide on a uniform Pinterest pin size for your blog posts up front, and make sure to size all pins accordingly.
- Do not forget your Pinterest pin description (data-pin-description)
- Do not forget your Pinterest pin URL (data-pin-URL)
- Do not forget to make your pin a clickable link to the blog you are refrencing
- Keep a list of all your Pinterest pin descriptions so you can tweak them for future pins as needed
These tips make it simple to manage Pinterest pins on your blog, without a WordPress plugin.
BONUS: Making a Pinterest Image Unpinnable
Do you want to make an image on your site unpinnable? Such as a featured image? This means users will not be able to pin certain images to Pinterest.
Simply add the data-pin-nopin="true" attribute to your Pin’s HTML code snipped. Users will not see the images with this tag when they try to click on their PinIt button or Tailwind scheduler.
BONUS: How to Add a Pinterest image to a Blog Post and Hide It
As we all know Pinterest is a fickle beast, and likes things done a certain way. They say there is the most power in an image if it is pinned directly from your website.
If you want to put additional Pinterest images in blogs posts and hide them, just do everything I just taught you. Then, add a little bit of code before and after the image code:
<div style = “display:none;”> PIN CODE HERE </div>
If you do this, someone will see all of the pins you created when they pin from your site, but you won’t have a gross blog post cluttered with Pinterest pins. It helps you get the best of both worlds, and keeps things neat and tidy.
When it comes to putting Pinterest images on your WordPress blog, it doesn’t have to be hard. We just learned how to add the Pinterest html tags to WordPress in three simple steps, no plugin required!