Rich Pins on Pinterest are just like standard Pins but they include some extra information about the source of the pin, quite similar to Twitter Cards. There are five different types of Rich Pins at the moment – products, movies, recipes, articles or blog posts and places.
Decide what type of Rich Pin suits your content the most. I’ll be using Article Rich Pins for this tutorial as they are great for most bloggers. Aside from what normally shows when someone pins a post from your site, the pin will now include the name of your website or blog, your favicon, the name of your post, the date the article was published, author name and the description of the article. This can be seen in the image below. Once you’ve enabled Rich Pins using the steps below, this is shown automatically using data from your template markup.
How to Enable Pinterest Rich Pins on Blogger
1. To set up Rich Pins for Blogger you’ll need to add some code to your posts in your template. On Blogger go to Settings > Search Preferences > Meta Tags and enable Description. You can enter a brief description about your blog content here. Now in the post editor (Posts > New Post / Edit Post) you’ll see a field in options on the right for Search Description. Add a relative description about your post to this area – it can be a summary or just the first few lines of your content. If you don’t add a description, it will use the start of your blog post.
2. Go to Template > Edit HTML > Click into the HTML Editor and press CTRL / CMD F to bring up the search bar. Find
<b:includable id='post' var='post'>There might be a black arrow on the left beside the numbering, if there is then click it to open the code. Underneath <b:includable id='post' var='post'> add the following
<meta content='article' property='og:type'/>
<meta expr:content='data:post.title' property='og:title'/>
<b:if cond='data:blog.metaDescription'>
<meta expr:content='data:blog.metaDescription' property='og:description'/>
<b:else/>
<meta expr:content='data:description' property='og:description'/>
</b:if>
<meta expr:content='data:blog.url' property='og:url'/>
<meta expr:content='data:blog.title' property='og:site_name'/>
<meta expr:content='data:post.author' property='article:author'/>
<meta expr:content='data:post.timestamp' property='article:published_time'/>
<meta content='BLOG TOPIC' property='article:section'/>
<b:loop values='data:post.labels' var='label'>
<meta expr:content='data:label.name' property='article:tag'/>
</b:loop>
Change BLOGTOPIC to be the main topic on your blog. This adds the needed open graph data to each blog post on your site using the information already there. For example the og:title will be your post title data:post.title.
3. Enter the link from your latest blog post into the field on the Validator page here. Click Validate and wait for the page to load. Check that the information is correct, click Apply, select HTML tags and Apply Now.
4. Pinterest will email you once you’ve been applied. They say it takes a couple of days but mine took a few months so unfortuntely you’ll just have to be patient.
How to Enable Pinterest Rich Pins on WordPress
1. The easiest way is to install Yoast SEO plugin. Once installed go to SEO > Social and select the checkbox that says “Add Open Graph meta data”. This will add the necessary code to your blog posts without you having to do so manually.
2. Enter the link from your latest blog post into the field on the Validator page here. Click Validate and wait for the page to load. Check that the information is correct, select HTML tags and click Apply.
3. Pinterest will email you once you’ve been applied. They say it takes a couple of days but mine took a few months so unfortuntely you’ll just have to be patient.
