What are Rich Pins?
Rich Pins are a way to give people useful information about the Pin they're looking at. This can be the price of a new laptop, vital ingredients for a recipe, and headlines for news releases. Supplemented with pinned images, these extra details help pinners decide whether they should make a recipe or not, or whether they can afford the latest iPhone.
Rich Pins ultimately might make the difference between a click and a glance.
How To use Rich Pins?
If you have a place, or feature products, recipes, movies or articles on your site, then you can use Rich Pins. You have to mark these objects on your website, so that Pinterest can identify your content and show the relevant information to pinners.
The marking can be done via various methods, including schema.org markup, Open Graph meta tags, etc. Since schema.org tags are the most popular and are supported by Google and other search engines, we'll be focusing on it.
Products
Following is an example HTML body markup for a products page.
<meta property="og:site_name" content="XYZ Store" />
<div itemscope itemtype="http://schema.org/Product">
<meta itemprop="name" content="Product Name" />
<meta itemprop="url" content="http://shop.xyz.org/do/product/123" />
<meta itemprop="image" content="http://shop.xyz.org/images/1.jpg" />
<meta itemprop="image" content="http://shop.xyz.org/images/2.jpg" />
<span itemprop="description">Sample description.</span>
<div itemprop="color" itemscope itemtype="http://schema.org/ProductColor">
<span itemprop="name">Aqua</span>
<meta itemprop="map" content="blue" />
<meta itemprop="image" content="http://cdn.example.com/a.jpg" />
</div>
<div itemprop="color" itemscope itemtype="http://schema.org/ProductColor">
<span itemprop="name">Rose</span>
<meta itemprop="map" content="red" />
<meta itemprop="image" content="http://cdn.example.com/B.jpg" />
</div>
<a itemprop="relatedItem" href="http://shop.xyz.org/do/product/4"></a>
<a itemprop="relatedItem" href="http://shop.xyz.org/do/product/2"></a>
<a itemprop="relatedItem" href="http://shop.xyz.org/do/product/3"></a>
<div itemprop="offers" itemscope itemtype="http://schema.org/Offer">
<span itemprop="price">$15.00</span>
<meta itemprop="priceCurrency" content="USD" />
<meta itemprop="availability" itemtype="http://schema.org/ItemAvailability"
content="http://schema.org/InStock" />
</div>
</div>
- url
- name
- description
- brand
- productid
- image
- relatedItem
- referencedItem
- productExpiration
- gender
- color
- aggregateRating
- name
- description
- sku
- price
- priceCurrency
- standardPrice
- availability
- availabilityStarts
- availabilityEnds
- eligibleRegion
As in the sample HTML shown, you can modify and of the fields, or add more according to your needs. You can find the complete documentation here.
Once you have marked up your content, it's time to validate it. To do this, simple follow this validation page, and enter the URL you want to validate. The rest is simple.
Have you marked up any pages recently and used Rich Pins? Let us know about your experience in the comments section below! Cheers :)
If you don't want to get yourself into Serious Technical Trouble while editing your Blog Template then just sit back and relax and let us do the Job for you at a fairly reasonable cost. Submit your order details by Clicking Here »
This post is very timely, just when I need it. Good thing I've come across this site while surfing. Thank you for that Pinterest topic. I just thought to share this website I've visited prior to your blog, I find it very helpful, especially for people like us. Here's the link http://goo.gl/XQCjni check it out. Maybe you can feature it as well, it helped me and maybe some of the bloggers too in the near future.
ReplyDeleteSo to do that I have to edit every post? No other easier way?!
ReplyDelete