「いいね!」ボタン設置に引き続き、FC2ショッピングカートにOGP設定を試みてみました。
FC2無料ショッピングカート
商品ページにOGP(Open Graph Protocol)を設定したのは、「いいね!」をクリックしたときに情報が伝わりやすくするためです。
多分、うまく行ったので、記録。
OGPの設定について、下記の記事を参考にさせていただきました。
- フェイスブック、ミクシィ、グリーで使われている OGP (Open Graph Protocol) とは何か – IT戦記(必ずこの記事に立ち返る気がします)
- facebook いいねボタンの仕様変更?OGPの設定についてまとめました( localeプロパティについて) | HTML5でサイトをつくろう
- 【最新】facebook いいねボタン設置時のOGP設定方法♪
- Facebook の OGP 設定の有無による違い – Life like a clown
FC2カートには、ソーシャルボタン設置のオプションが無いので、テンプレート変数を参照しながら、ヘッダを変更しました。
下記に、参考ソースを載せます。
- html要素にxmlns属性を追加
-
<html lang="ja" xmlns:og="http://ogp.me/ns#" xmlns:fb="http://www.facebook.com/2008/fbml">
- OGPのメタタグを追加
-
{if DSP_ITEMDETAIL} <meta property="og:locale" content="ja_JP"> <meta property="og:title" content="{current.name_item} - {shop_name}"> <meta property="og:type" content="article"> <meta property="og:url" content="http://shopxxx.cart.fc2.com{foreach item}{item.item_url}{/foreach item}"> <meta property="og:site_name" content="ショップ名"> <meta property="og:image" content="{foreach item}{item.list_img}{/foreach item}"> <meta property="og:description" content="{current.name_ca1}、{current.name_item}。{foreach item}{if item.comment1}{item.comment1}{/if}{/foreach item}"> {/if}