リッチピンとは、あなたのサイトの情報を自動的に同期するピンです。ピンをクリックすると、画像の上下に追加情報が表示されるものがリッチピンです。元のサイトに変更が加えられると、リッチピンにも定期的にその変更が反映されます。
記事リッチピンとレシピリッチピンは、あなたのサイトに加えた編集内容を反映するために自動的に更新されます。Pinterest 側では、レシピや記事のリッチピンを手動で編集すると、追加した新しい情報がリッチメタデータに上書きされます。
データが正しく同期されるようにするには、サイトにタグを追加してください。 あなたのサイトに商品、記事、レシピなどのコンテンツがある場合、該当するページに
あなたが新しいピンを作成したときに、適切なメタタグが適用されているページ上のコンテンツすべてがリッチピンとして表示されるようになります。また、リッチピン用のメタタグが適用されたページにリンクされている既存のピンも、以降はリッチピンとして表示されるようになります。
注意：サイトのコンテンツがリッチピンに同期されるまで最大 24 時間かかる場合があります。
あなたのウェブサイト上の特定のページからリッチピンのデータを削除したい場合は、以下のタグをページのヘッダー部にある終了タグ </body> の前に挿入してください。
<meta name="pinterest-rich-pin" content="false" />このタグはそのページのみでリッチピンのメタタグを無効にするため、タグを他の個別ページに追加しない限り、サイト上の他のすべてのページには影響を与えません。リッチピンを再びオンにしたい場合は、このタグを削除してください。
レシピピンでは、料理名、出来上がりの分量、調理時間、レシピの評価、材料リストをあなたのウェブサイトからレシピに追加できます。また、パレオ、ベジタリアン、ビーガン、グルテンフリーといった表記も可能です。
サイトにレシピピンを追加する
レシピリッチピンのデータをサイトに統合するには、レシピリッチピンを有効にする各ページの HTML コードの <head> </head> セクションの間に Schema.org または h-recipe のマークアップを追加します。
これが完了すると、これらのリッチピン対応ページにリンクされているピンのリッチピンコンテンツがシステムに表示されます。
レシピの評価
レシピリッチピンには、評価情報を追加できますが、それには Schema.org マークアップから必要なメタタグを追加してください。ウェブサイトへの評価情報追加に関してサポートが必要な場合には、Schema.org にアクセスするか、このピンの例で bettycrocker.com による導入事例を参考にしてください。
注意：評価情報を追加するには h-recipe ではなく Schema.org マークアップが必要です。また、評価情報は iOS と Android デバイスのみで表示されます。
Schema.org と h-recipe のマークアップ
各マークアップのリッチピン必須フィールドは以下のとおりです。黒の項目を編集して、レシピに適用してください。
<div itemscope itemtype="https://schema.org/Recipe">
<span itemprop="name">
オレンジとパイナップルと人参のスムージー</span>
<span itemprop="description">
レシピの説明文。</span>
<span itemprop="aggregateRating">
集計された評価がここに表示されます</span>
<meta itemprop="url"
content="https://myrecipesite.com/pineapple.html"/>
<span itemprop="recipeYield">1 人分</span>
材料：
<span itemprop="ingredients">材料 1</span>,
<span itemprop="ingredients">材料 2</span>,
<span itemprop="ingredients">材料 3</span>,
<span itemprop="ingredients">
必要なだけ材料タグを追加してください</span>。
作り方：
<span itemprop="recipeInstructions">
パイナップル、氷、オレンジジュース、人参、
バナナをミキサーに入れ、なめらかになるまでミキサーにかけます。</span>
</div>
h-recipe タグ：
<article class="h-recipe">
<h1 class="p-name">ベーグル</h1>
<ul>
<li class="p-ingredient">小麦粉</li>
<li class="p-ingredient">砂糖</li>
<li class="p-ingredient">イースト</li>
</ul>
<p><time class="dt-duration" datetime="1H">1 時間</time>,
<data class="p-yield" value="4">4 人分</data>.</p>
<div class="e-instructions">
<ol>
<li>最初にすべての材料をよく混ぜます。</li>
</ol>
</div>
</article>
詳細は Pinterest デベロッパー向けサイトをご覧ください。
記事とは文章を含むページのことで、ニュース記事やブログの投稿などを指します。リスト記事（まとめサイト）や、画像がほとんどで文章がわずかしかないページは記事とは見なしていません。
サイトに記事ピンを追加する
記事リッチピンデータをサイトに統合するには、記事リッチピンを有効にする各ページの HTML コードの <head> </head> セクションの間に Open Graph または Schema.org マークアップを追加します。
これが完了すると、これらのリッチピン対応ページにリンクされているピンのリッチピンコンテンツがシステムに表示されます。
Open Graph および Schema.org のマークアップ
各マークアップのリッチピン必須フィールドは以下のとおりです。強調表示されている項目を編集して、記事に適用してください。
Open Graph のマークアップ：
<meta property="og:title" content="記事のタイトル"/>
<meta property="og:description" content="記事の説明文" />
<meta property="og:type" content="記事" />
Schema.org のマークアップ：
<meta property="og:site_name" content="サイト例” />
<div itemscope itemtype="https://schema.org/article">
<meta itemprop="url" content="Https://www.example.com/2013/10/article.html" />
<span itemprop="name" content="記事のタイトル” /> - 著者：<span itemprop="author" content="遠藤翔太” />
<span itemprop="description">記事の説明文または概要。</span>
</div>
プロダクトピンとはリッチピンの一種で、あなたのサイトから取得した最新の価格、在庫状況、商品のタイトルと説明文が表示されます。場合によっては、ある Pinterest の商品カテゴリ内で最も購入されたアイテムの一つになった場合は「売れ筋商品」というラベルがピンに付き、ある Pinterest の商品カテゴリ内で最もクリック回数の多いプロダクトピンの一つになった場合は「人気商品」というラベルがピンに付くことがあります。
注意：商品の在庫があり、価格が正確で、最近データが更新されており、マーチャントガイドラインを遵守している場合に限り、この情報がプロダクトピンに表示されます。
サイトにプロダクトピンを追加する理由と方法
プロダクトピンを使うと、あなたのサイトに Pinterest のユーザーを誘導し、商品の購入を促進できます。ただし、Pinterest にプロダクトピンを追加する前に、あなたのサイトでユーザーが直接商品を購入できるように設定する必要があります。
あなたのサイトでプロダクトピンを作成するには、以下の方法またはカタログを使用してください。カタログを使用して商品のデータソースをアップロードし、似ているプロダクトピンをまとめて商品グループを作成しましょう。ショッピングアドとしてプロモートできるのは、カタログを使用して作成したプロダクトピンのみです。
サイトにプロダクトピンを追加する
プロダクトリッチピンのデータをサイトに統合するには、プロダクトピンを有効にする各ページの HTML コードの <head> </head> セクションの間に Open Graph または Schema.org マークアップを追加します。
これが完了すると、これらのリッチピン対応ページにリンクされているピンのリッチピンコンテンツがシステムに表示されます。
Open Graph および Schema.org のマークアップ
各マークアップのリッチピン必須フィールドは以下のとおりです。強調表示されているテキストまたは緑の数値を編集して、記事に適用してください。
Open Graph のマークアップ：
<meta property="og:title" content="De Young Copper Bookmark" />
<meta property="og:type" content="product" />
<meta property="product:price:amount" content="15.00"/>
<meta property="product:price:currency" content="USD" />
Schema.org のマークアップ：
<div itemscope itemtype="https://schema.org/Product">
<meta itemprop="name" content="De Young 黄銅製ブックマーク" />
<meta itemprop="url" content="Https://shop.famsf.org/do/product/BK5160"/>
<div itemprop="offers" itemscope itemtype="https://schema.org/Offer">
<span itemprop="price">.00</span>
<meta itemprop="priceCurrency" content="USD” />
<meta itemprop="availability" itemtype="https://schema.org/ItemAvailability"
content="https://schema.org/InStock"/>
</div>
Etsy、Teachers Pay Teachers、eBay にサイトがホストされている場合、マークアップの追加は必要ありません。これらのサイトの新しいピンの商品情報は 24 時間以内に表示されます。