リッチピンは、あなたのウェブサイトの情報を自動的にピンに同期するオーガニックピンの一種です。リッチピンは、クリックすると画像の上下に追加情報が表示されます。元のウェブサイトに変更が加えられると、リッチピンにも定期的にその変更が反映されます。
リッチピンは、Pinterest のビジネスアカウントを所有するユーザーであれば誰でも無料で利用できます。リッチピンを作成するには、最初に
注意:記事リッチピンとレシピリッチピンは、あなたのサイト上の編集内容を反映して自動的に更新されます。
リッチピンの利用を開始するには、まず検証する必要があります。これは、データが正しく同期するか確認するためです。
Pinterest は申請を受けてから 24 時間以内に処理します。
サイトが承認されると、あなたが
あなたのウェブサイト上の特定のページからリッチピンのデータを削除したい場合は、以下のタグをページのヘッダー部にある終了タグ </body> の前に挿入してください。
<meta name="pinterest-rich-pin" content="false" />
このタグはそのページのみでリッチピンのメタタグを無効にするため、タグを他の個別ページに追加しない限り、サイト上の他のすべてのページには影響を与えません。リッチピンを再びオンにしたい場合は、このタグを削除してください。
レシピピンでは、料理名、出来上がりの分量、調理時間、レシピの評価、材料リストをあなたのウェブサイトからレシピに追加できます。また、パレオ、ベジタリアン、ビーガン、グルテンフリーといった表記も可能です。
サイトにレシピピンを追加する
- Schema.org または h-recipe のマークアップを、レシピリッチピンを有効にする各ページの HTML コードの <head> と </head> との間に追加します。
- リッチピン検証ツールを使用してリッチピンデータが表示されることを確認します。
- 正しく表示されたら、「今すぐ申請」をクリックします。 申請の際には、HTML タグを選択してください。
レシピの評価
レシピピンには、評価情報を追加できますが、それには 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 デベロッパー向けサイトをご覧ください。
記事とは文章を含むページのことで、ニュース記事やブログの投稿などを指します。リスト記事(まとめサイト)や、画像がほとんどで文章がわずかしかないページは記事とは見なしていません。
サイトに記事ピンを追加する
- Open Graph または Schema.org のマークアップを、記事リッチピンを有効にしたい各ページの HTML コードの <head> と </head> との間に追加します。
- リッチピン検証ツールを使用してリッチピンデータが表示されることを確認します。
- 正しく表示されている場合は、「今すぐ申請」をクリックします。リッチピン検証ツールから申請する際、HTML タグを選択してください。
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 にプロダクトピンを追加する前に、あなたのウェブサイトでユーザーが直接商品を購入できるように設定する必要があります。
あなたのウェブサイトでプロダクトピンを作成するには、以下の方法またはカタログを使用してください。カタログを使用して商品のデータソースをアップロードし、類似のプロダクトピンをまとめて商品グループを作成しましょう。ショッピングアドとしてプロモートできるのは、カタログを使用して作成したプロダクトピンのみです。
ウェブサイトにプロダクトピンを追加する
ウェブサイトにプロダクトピンを追加すると、あなたのウェブサイトからの情報を自動的にピンに同期することができます。ウェブサイトに変更が加えられると、プロダクトピンが更新され、変更が反映されます。
- Open Graph または Schema.org のマークアップを、プロダクトピンを有効にしたい各ページの HTML コードの <head> と </head> との間に追加します。
- リッチピン検証ツールを使用してリッチピンデータが表示されることを確認します。
- 正しく表示されている場合は、[今すぐ申請] をクリックします。申請の際には、正しいマークアップを選択しているか確認してください。
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 時間以内に表示されます。
Shopify ストアからプロダクトピンを追加する
- Shopify サイトで特定の商品の URL を開きます。「Buy」ボタンや「Add to Bag」ボタンのあるページです。
- リッチピン検証ツールを開き、商品へのリンクを貼り付けます。
- リンクの末尾に「.oembed」を追加します。すると、商品にリッチピンの情報が表示されます。
- マークアップオプションとして Shopify を選択します。
- 「検証する」 をクリックします。
- プレビューが表示されたら、「申請する」をクリックします。ウェブサイトから申請する必要がある商品 URL は 1 つのみです。
Shopify ストアにプロダクトピンを追加する
- Shopify サイトで特定の商品の URL を開きます。「Buy」ボタンや「Add to Bag」ボタンのあるページです。
- この商品 URL をリッチピン検証ツールにコピー&ペーストして、商品 URL の末尾に「.oembed」と入力します。すると、商品にリッチピンの情報が表示されます。
- 「検証する」をクリックします。
- プレビューが表示されたら、「申請する」をクリックします。ウェブサイトから申請する必要がある商品 URL は 1 つのみです。
24 時間以内にプロダクトピンがリッチピンになります。