構造化マークアップで商品ページであることをGoogleに理解させる

構造化マークアップを施すと、Googleに「このページは「商品」の情報を掲載しています」と効果的に伝えることが出来る。

タグの中に埋め込むのは手間なので、JSON-LD方式を選んだ。

Googleの構造化データに関する一般的なガイドラインを参考

コードを商品詳細テンプレートの最下部へマークアップ

消費税設定が外税で3番のタイプ:表示が、1,058円(税78円)のタイプのお店は、このままコピーペーストで使えるとおもいます。

<script type="application/ld+json">
{
"@context": "http://schema.org/",
"@type": "Product",
"description": "<{$product.explain|strip_tags}>",
"name": "<{$product.name}>",
"SKU": "<{$product.id}>",
"image": "http:<{$product.img_url}>",
"offers": {
"@type": "Offer",
"availability": "http://schema.org/InStock",
"price": "<{$product.sales|regex_replace:"/\,/":""|regex_replace:"/円|\(税.*円\)/":""}>",
"priceCurrency": "JPY"
}
}
</script>

解説

カラーミーの価格のタグ<{$product.sales}>は、このストアの場合、3,240円(税240円) という表記になっていた。

schemaは、桁区切りコンマや日本語、カッコを取り除いた、3420という数字だけにしなくてはいけない。

その部分を処理しているはこの部分。

<{$product.sales|regex_replace:"/\,/":""|regex_replace:"/円|\(税.*円\)/":""}>

smartyのregex_replace関数を適用、「 , 」 そして「 円(税 円)」 を空白文字列に置換してます。

マークアップが間違っていないか確認

URLをペーストすると分析、マークアップにエラーがあれば教えてくれます。


Latest Article

 FXのチャートデータからMIDIを生成するプロジェクト h3,h4,h5{margin: 3rem 0;padding:.5rem;}
IntelliJ IDEAのターミナルをWSL にする方法 win10編 あっちこっちのVPSやAWSにSSHでちょっとだけ覗...
Golangで楽天をスクレイピングしてカラーミーCSV生成 楽天運営中のお客様がカラーミーにも出店す
GAE/PHPをIntelliJ IDEAでデバッグ、俺ならこうお世話になった Google App Engineの開発環境をつくって、IntelliJ I
IntelliJ IDEA 設定、2年目の初心者の俺ならこうやってる IntelliJ IDEAを購入(2018/02/26)して、約2年の初心...
カラーミー商品詳細ページSEO対策 構造化マークアップ