Happy-Go-Lucky: [Blogger] OGP を設定してみた

[Blogger] OGP を設定してみた

Pocket

時刻: 0:00 ラベル: Blogger

Oオジサンは Gグンゼの Pパンツ

@toshiya240 です。

以下の記事を読んで OGP を設定してみようと思いました。

OGPとは? 改めてOGPの重要性について考える時が来た。 | Last Day. jp
φ(ﾟДﾟ )ﾌﾑﾌﾑ…

正確に言うと、設定していたつもりでしたがテキトーすぎました(^o^;

Google 先生にお伺い

知っておきたいFacebookのOGPをBloggerに対応させる活用法 | Will feel Tips
前回の記事『自分の指定した任意の場所でJavascriptを実行させる Tipsまとめ』の中で、Javascriptを活用したSNSシェアボタンの設置を紹介しました。簡単でスピーディな情報拡散ツールとしてのSNSの利用を考えるのであれば、Facebookのいいね！ボタンもアクセス数を伸ばす一つの要素になっています。但し、そのままボタンを設置しただけでは殆ど意味は無く、OGPを設定してあげることで本来の機能を引き出すことが出来るようになります。今回は現状での最善策と考えられる、BloggerをFacebo ...
発見！

φ(ﾟДﾟ )ﾌﾑﾌﾑ…わかりました。

設定してみた

Blooger のテンプレートの head タグの配下に以下のように追記しました。

<!-- OGP -->

<b:if cond='data:blog.pageType == &quot;index&quot;'>

  <meta property='og:type' content='blog' />

</b:if>

<b:if cond='data:blog.pageType == &quot;item&quot;'>

  <meta property='og:type' content='article' />

</b:if>

<b:if cond='data:blog.pageType == &quot;static_page&quot;'>

  <meta property='og:type' content='article' />

</b:if>

<b:if cond='data:blog.pageType == &quot;archive&quot;'>

  <meta property='og:type' content='article' />

</b:if>

<meta property='og:title' expr:content='data:blog.pageTitle' />

<meta property='og:url' expr:content='data:blog.url' />

<meta property='og:site_name' expr:content='data:blog.title' />

<meta property='og:image' content='http://www.gravatar.com/avatar/1defc346744650a5d07edf83b705806f?s=200' />

<meta property='og:locale' content='ja_JP' />

<meta property='fb:app_id' content='126592340754723' />

参考にしたページではページのタイプ毎に og:title を変更していますが、すべてページタイトルにしました。
og:image は Gravtar のアバター画像にしました。 HeartRails Capture を用いたページのキャプチャにしようとしたのですが、エラーになってしまいました。
og:description はとりあえず設定しないことにしました。