OGP (Open Graph Protocol)とは?
facebook、mixi、GREEなどのSNSで使われている共通の仕様のことで、
「このウェブページはこんな内容ですよ」と明言するためのものです。
例えばfacebookでは、あるページにいいね!がされると
「〇〇さんが〇〇についていいね!と言っています」とウォール上に投稿されます。
これはOGPを導入していないサイトの場合に表示される内容です。
OGPを導入しているサイトがいいね!された場合は「記事元のURL、ページタイトル、サイト説明、サムネイル等」を表示させる事ができます。
このように、いいね!された時の表示をサイト側で指定するためのOGPについて少しまとめてみました。
OGPの例
index.html
<meta property="og:type" content="ウェブページが何のページであるか(必須)">
<meta property="og:title" content="ウェブページの名前(必須)">
<meta property="og:image" content="ウェブページのサムネイル(必須)">
<meta property="og:url" content="ウェブページの URL(必須)">
<meta property="og:description" content="ウェブページの説明">
<meta property="og:site_name" content="サイト名">
<meta property="og:email" content="連絡先">
<meta property="og:locality" content="場所">
<meta property="og:latitude" content="経度緯度での位置情報">
基本的には、meta property=”何を指定するか” content=”どのように指定するか”
といったように記述していきます。
他にも様々な設定がありますので下記に本家サイトURLを記載しておきます。