ところで、Bloggerを使用している人ならご存知でしょうが、Bloggerには「関連記事リスト」を自動生成するような機能は用意されていません。では、どうやったのかと言うと・・・。
世の中には似たようなことを考える人は必ずいるもので、ググれば大抵、解決策(あるいはそのヒント)が見つかるものです。
今回も、Googleで検索して見つけた、下記ページを参考にさせていただきました。このページでは、記事に付けられたラベルを基に、BloggerのGDATA APIを利用して関連記事を検索し、一致するラベルの数・投稿日でソートして表示する、という方法を採用しています(いわゆるAJAXの手法ですね)。
組み込み方等、詳細については記述されていませんが、「気になる方はこのページなりJavascriptなファイルなりを参照して下さい」とのことでしたので、遠慮なく、参照して一部手直しの上、利用させていただきました(^^)。この場を借りてお礼申し上げますm(__)m。
さて、ここで、簡単に組込み手順を説明しておきます。興味のある方は参考にしてください。
- 関連記事リスト作成用のJavaScriptを入手する
このページのソースを表示して、
<!-- InsertRelativeLinks begin --> から
<!-- /InsertRelativeLinks end --> までを
テキストファイルにコピーし、適当な場所にセーブしてください。
もしくは、上のページを参照して、InsertRelativeLinks.jsファイルをダウンロードしてください。
# ただし、オリジナルのスクリプトは、ラベルで絞り込んだ記事が1件のみの場合、一覧ページでも関連記事リストが表示されます。必要に応じて修正して下さい。 - テンプレートに関連記事リスト表示用のタグを追加する
Bloggerの[レイアウト]-[HTMLの編集]ページで、[ウィジットのテンプレートを展開]にチェックを入れ、テンプレートを以下のように変更します。<b:includable id='comments' var='post'>
斜体字の部分が追加するタグです。挿入する場所は「id='comments'」で検索してください。
<div class='comments' id='comments'>
<a name='comments'/>
<!-- add by Magica -->
<div>
<h4>関連する記事</h4>
<div class='sidebar' id='RelativeLinks'/>
</div>
<!-- /add by Magica -->
<b:if cond='data:post.allowComments'>
なお、class='sidebar'となっているのは、関連記事リストのスタイルを、サイドバーのリストスタイルに合わせるためです。必要に応じて変更してください。 - 関連記事リスト作成用のJavaScriptをページの一番最後に追加する
Bloggerの[レイアウト]-[ページ要素]ページで、HTML/JavaScriptガジェットを追加して、手順1でセーブしておいた、関連記事リスト作成用のJavaScriptをページの一番最後に追加します。
ページの一番最後でないと、他のブログパーツ等と競合して、正常に動作しない場合がありますので注意してください。
なお、ブログの閲覧者が「全てのユーザー」になっていないと、関連記事リストは表示されませんのでご注意を(GDATA APIが機能しないようです)。
# つまり、会員制とかの非公開のブログでは使えません。
関連する記事
0 コメント:
コメントを投稿