Lab.

【備忘録】OGP設定とタグ一覧

WEBサイトを作る時に、OGPの設定をいつも検索して調べてその都度、忘れちゃって、また検索!ってのを繰り返してたので、今一度復習もかねて、備忘録を作成します。


OGPの概要


OGPとは、Open Graph protocolの略です。WEBページがどのような内容であるか、共通のフォーマットで記載し、WEBアプリケーションなどで効率的に利用できる様に開発された仕様です。プログラムが理解しやすい様に設計されており、これをfacebookやmixiなどでが利用して、投稿した記事がどんどん拡散していくというわけです。今後はSNSだけでなく、WEB上のいろんなサービスで使われていくはず(?)だから、ちゃんと設定しなきゃね!



基本のOGPタグ一覧



本家のタグ一覧を参考にOGPタグの一覧を掲載しておきます。


■サイトの名前
<meta property="og:site_name" content="名前" />
■コンテンツの種類
・記事の場合
<meta property="og:type" content="article" />
※ここで、そのタグで指示する内容がなんであるかの設定を行います。

■コンテンツのURL
<meta property="og:url" content="ページのURL" />

■画像のURL
<meta property="og:image" content="画像のURL" />


ちょっとマニアックなOGPタグ一覧



■音楽データに関するOGPタグ
・音楽のファイルのURL
<meta property="og:audio" content="音楽ファイルのURL">
・曲名
<meta property="og:audio:title" content="曲名">
・アーティスト
<meta property="og:audio:artist" content="アーティスト名">
・アルバム名
<meta property="og:audio:album" content="アルバム名">
・音楽のファイル形式
<meta property="og:audio:type" content="application/mp3" />


■動画データに関するOGPタグ
・動画ファイルのURL
<meta property="og:video" content="動画ファイルのURL">
・動画のサイズ
<meta property="og:video:width" content="300">
<meta property="og:video:height" content="200">
・動画形式
<meta property="og:video:type" content="application/x-shockwave-flash" />

※その他の関連タグ

video:actor
video:actor:role
video:director
video:writer
video:duration
video:release_date
video:tag




■書籍に関するOGPタグ
・著者名
<meta property="og:book:author" content="著者名" />
・ISBN
<meta property="og:book:isbn" content="ISBN" />
・発売日
<meta property="og:book:release_date" content="発売日(YYYYMMDD)" />
・書籍に関連するタグ
<meta property="og:book:tag" content="本に関するタグ" />

とりあえず、使えそうなのだけ書き出しましたが、まだまだいっぱいあるみたい。
機会があれば、また掲載します。

related article