OGP(Open Graph Protocol)表示
OGPとはOGPとは「Open Graph Protcol」の略で、FacebookやTwitterなどのSNSでwebページやブログの記事がシェアされた時、設定したWEBページのタイトルやイメージ画像、詳細などを表示させる仕組みのことです。OGP(Open Graph Protocol)設定についてOGPタグを有効にすることで以下のページにOGPタグを設置することができます。・TOPページ ・商品詳細ページ ・カテゴリページ ・フリーページ ・LPフォーム OGPタグを有効にする手順1. OGP用のメイン画像をアップロードメイン画像(TOPページ等)アップロード先: upload/ogp_image/top/main(.jpg|.png|.gif) 例: upload/ogp_image/top/main.jpg メイン画像が存在しない場合、全てのページでOGPタグが設置されません。 まずはメイン画像をアップロードしてください。 2. ogp.tpl を読み込む記述を追加 ・templates/テンプレートディレクトリ名/site_frame.tpl ・smp/templates/テンプレートディレクトリ名/site_frame.tpl 上記テンプレートファイルのmetaタグ付近にogp.tplを読み込む記述を追加 ※pr_default ディレクトリ直下の site_frame.tpl を参考に以下のタグを挿入してください。 <!--{include file=$smarty.const.FTPROOTPATH|cat:"/ogp_template_files/ogp.tpl"}-->
3. 優先するOGP画像をアップロード(任意)商品詳細ページ・カテゴリページ・フリーページ・LPページで、 優先して設定したいOGP画像がございましたら下記を参考にアップロードして下さい。 OGP用優先画像アップロード先【商品詳細】表示優先順位 upload/ogp_image/product/【商品ID】(.jpg|.png|.gif)＞商品の「詳細-メイン拡大画像」＞商品の「詳細-メイン画像」例: upload/ogp_image/product/27.jpg 【カテゴリーページ】 表示優先順位 upload/ogp_image/category/【カテゴリID】(.jpg|.png|.gif) ＞ メイン画像例: upload/ogp_image/category/13.png 【フリーページ】 表示優先順位 upload/ogp_image/free_page/【http://■■/pages/●●の●●部分】(.jpg|.png|.gif)＞メイン画像例: upload/ogp_image/free_page/access_map.jpg 【LP】 表示優先順位 upload/ogp_image/lp/【LPフォームキー】(.jpg|.png|.gif)＞メイン画像例: upload/ogp_image/lp/rice.jpg titleやdescription等の記述titleやdescription等の記述は、/ogp_template_files/tpl/common.tpl 内の記述をベースに、他のtplファイル内の記述を行っていただけますようお願いいたします。 注意 FacebookにてOGPタグが反映されない場合は、FacebookのDebuggerでFacebook側のキャッシュ削除をお試しください。 |
この記事の目次 |
ありがとうございました。
よろしければ、ご意見をお聞かせください。
件名、コメントをご入力いただき、『送信』ボタンをクリックしてください。
ご意見を送られない場合は、『閉じる』ボタンをクリックしてください。