FacebookのOGPをMTに設定する方法
2011年4月28日
FacebookのOGPをMTに設定する方法をご紹介します。
htmlタグにxmlnsを設定
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:og="http://ogp.me/ns#" xml:lang="ja" lang="ja" xmlns:og="http://opengraphprotocol.org/schema/">
アプリIDを取得
Facebookデベロッパーズサイトのアプリ作成画面にアクセスしてアプリIDを取得します。
http://developers.facebook.com/setup/
「OGP」のタグをテンプレートに組み込む
MTでブログ記事、ウェブページ、インデックステンプレート、タグ、検索機能を使用している事を想定した分岐コードは以下になります。
<MTIf name="main_index">
<meta property="og:title" content="<$MTBlogName$>" />
<meta property="og:type" content="blog" />
<meta property="og:url" content="<$MTBlogURL$>" />
<meta property="og:image" content="<$MTBlogURL$>サムネイル画像までのパス" />
<meta property="og:site_name" content="<$MTBlogName$>" />
<meta property="fb:app_id" content="取得したアプリIDが入ります" />
<MTElseIf name="entry_template">
<meta property="og:title" content="<$MTEntryTitle$>｜<$MTBlogName$>" />
<meta property="og:type" content="article" />
<meta property="og:url" content="<$MTEntryPermalink$>" />
<mt:Setvarblock name="ogimage">
<mt:EntryAssets sort_order="ascend" lastn="1"><$mt:AssetURL$></mt:EntryAssets>
</mt:Setvarblock>
<meta property="og:image" content="<mt:If name="ogimage"><$mt:GetVar name="ogimage"><mt:Else><$MTBlogURL$>サムネイル画像までのパス</mt:If>" />
<meta property="og:site_name" content="<$MTBlogName$>" />
<meta property="fb:app_id" content="取得したアプリIDが入ります" />
<MTElseIf name="page_template">
<title><$MTPageTitle remove_html="1"$>｜<$MTBlogName$></title>
<meta property="og:title" content="<$MTPageTitle$>｜<$MTBlogName$>" />
<meta property="og:type" content="article" />
<meta property="og:url" content="<$MTPagePermalink$>" />
<meta property="og:image" content="<$MTBlogURL$>サムネイル画像までのパス" />
<meta property="og:site_name" content="<$MTBlogName$>" />
<meta property="fb:app_id" content="取得したアプリIDが入ります" />
<MTElseIf name="category_archive">
<meta property="og:title" content="<$MTArchiveCategory$>｜<$MTBlogName$>" />
<meta property="og:type" content="article" />
<meta property="og:url" content="<$MTCategoryArchiveLink$>" />
<meta property="og:image" content="<$MTBlogURL$>サムネイル画像までのパス" />
<meta property="og:site_name" content="<$MTBlogName$>" />
<meta property="fb:app_id" content="取得したアプリIDが入ります" />
<MTElse>
<meta property="og:title" content="<$mt:Var name="title"$>｜<$MTBlogName$>" />
<meta property="og:type" content="article" />
<meta property="og:url" content="<$mt:Var name="searchUrl"$>" />
<meta property="og:image" content="<$MTBlogURL$>サムネイル画像までのパス" />
<meta property="og:site_name" content="<$MTBlogName$>" />
<meta property="fb:app_id" content="取得したアプリIDが入ります" />
</MTIf>
※サムネイル画像は全ページ共通を想定しています。
※検索、タグのページやインデックステンプレートにはタイトルを<$mt:Var name="title"$>URLを<$mt:Var name="searchUrl"$>と任意の変数にあらかじめ設定しておいてください。
詳しくは＜遂に公開＞SEOの2倍のアクセスを稼ぐFacebook活用術。皆が知らない「いいね！」ボタンと「OGP」の設定方法、超解説をご参考ください。詳しく解説されています。