最紀クライアント様から設置して欲しいという要望の多い「OGP（Open Graph Protocol）」（※以下OGPとします。）をMovableTypeに設置する際の方法を纏めてみました。

ちなみにOGPとはFacebookやTwitterをはじめとするソーシャルネットと自分たちが展開しているウェブサイトやブログなどの連携を行うために必要なhtmlソースコードへの記述をルール化したものを指します。

そのOGPを設置する時はhtmlのメタプロパティーにて以下の要素を埋め込むことで実装できます。

 

メタプロパティーの各要素

og:site_name	ブログもしくはウェブサイトの名称
og:title	ブログ記事もしくはウェブページのタイトル
og:url	ブログ記事もしくはウェブページのURL
og:image	記事中の画像、あるいはブログアイコンなど
og:description	ブログ記事もしくはウェブページの概要
fb:admins	ブログ管理者のfacebookアカウントID Facebookにログインした状態で下記にアクセスしますと簡単に取得できます。 FacebookのユーザーIDを取得する
fb:app_id	Facebookインサイトによるアクセス解析を利用する場合、専用のアプリを作ってそのアプリIDを設置します。

そして実際にMovableTypeに埋め込んで行く際は下記のソースコードをご参照ください。

※上記コードで「こうやった方がええよ！」というアドバイスがありましたらコメントお寄せください。

 

テンプレートへの埋め込み作業が完了しましたら、適切に設置できているか確認してみましょう！

再構築を実施してテンプレートの内容が反映できましたら、任意の記事のURLをコピーします。
そしてURLリンターというFacebookのデベロッパー向けのチェック画面へ移動し、正常に表示されているかを確認します。

Facebook：URLリンター

こんな感じでOGP（Open Graph Protocol）が設置できるはずです。

是非お試しください！！

<$MTAssetURL$>" />








<$MTAssetURL$>" />






images


<$MTAssetURL$>ロゴ画像などエントリーに画像がない場合の代替画像のパス" />
" />





images


<$MTAssetURL$>ロゴ画像などページに画像がない場合の代替画像のパス" />
" />