2011年7月30日土曜日

[Blog] Bloggerにzenbackで関連記事を表示しよう


いろんなブログを見てて、zenbackを目にしたことはありませんか?

zenbackは、関連記事や関連リンク、ソーシャルリンクのブログパーツです。

30分もあれば、簡単にあなたのBloggerブログに設置できます。
※他ブログでは、zenbackのヘルプを参照ください。

まず、zenbackにアクセスして、会員登録します。

途中、ブログパーツに表示する項目を選択できます。[関連リンク]と[関連キーワード]は必須ですので、非表示にできません。
※zenbackの管理画面であとからでも変更できます。


ブログに設置する際のスクリプトコードが表示されますので、メモ帳などにコピーしておいてください。
※zenbackの管理画面から再度見えます。

Bloggerの管理画面を開き、[デザイン]-[HTMLの編集]とたどります。


[テンプレートを編集]のところで、[ウィジェットのテンプレート展開]にチェックを入れます。

下記のようにテンプレートに追加する必要があるのですが、一つ一つ説明します。

ブラウザの検索機能を使って、ページ内で下記の箇所を探してください。
※Windowsなら[Ctrl]+[F]、Macなら[Command]+[F]で検索ウィンドウを表示できます。
<b:if cond='data:blog.pageType == "item"'>
  〜ここに追加する〜
  <b:include data='post' name='comments'/>
</b:if>


下記の文字列で検索するとすぐ見つかります。
  <b:include data='post' name='comments'/>

zenbackからコピーしたスクリプトコードを、メモ帳などで編集します。赤色の行を追加してください。
<!-- X:S ZenBackWidget --> <script type='text/javascript'>
// <![CDATA[
document.write(unescape("%3Cscript")+" src='http://widget.zenback.jp/?base_uri=http%3A//kumacoro.blogspot.com/&nsid=98050198168677732%3A%3A98050214274852389&rand="+Math.ceil((new Date()*1)*Math.random())+"' type='text/javascript'"+unescape("%3E%3C/script%3E"));
// ]]>
</script> <!-- X:E ZenBackWidget -->


さきほどの[〜ここに追加する〜]に、編集したスクリプトコードを貼り付けます。
<b:if cond='data:blog.pageType == "item"'>
  〜ここに追加する〜
  <b:include data='post' name='comments'/>
</b:if>


[テンプレートを保存]ボタンをクリックして、ブログパーツ設置完了です。

記事のページを見てみてください。
※情報が表示されるまで数時間〜数日かかります。

0 件のコメント:

コメントを投稿