FC2ブログで関連エントリーリスト[HW]

スポンサーサイト

2008/05/12 13:21 | | TOP

Google App EngineでDjango (04/09)

Google App EngineでDjangoっぽくアプリ作る。Hello Worldの1歩先。 (04/09)

CSSEZリニューアルでお世話になりそうなあれこれまとめ。 (04/03)

CSSEZのリニューアルをちょっと垣間見てみない？？ (03/31)

Vicunaにあったらいいなと思うあれこれ。 (03/28)

YUIさんとYUI RADIO (03/06)

敢えて「ひいき」するということ。 (12/14)

プロセスの柔軟性を奪うことは何をもたらすのか。 (12/13)

ZAPAさんが読みたいブログ（自薦）募集中。 (12/09)

英語版、フィリピン語版CSSEZを公開しました。 (11/13)

ブログでアクセスアップをするために、ページビューを増やすのは大切なことです。そして、ブログでページビューを伸ばすのによい方法は、関連記事を表示して、似た記事を読者に紹介することです。

ただ、FC2ブログでは、タグのカスタマイズだけではその機能を実装することはできません。また、巷にある関連エントリージェネレーターは、毎回コピペで貼る手間がかかったり、広告がでかすぎたり、うまく関連エントリーを抽出できなかったりと、なかなか思うようにうまくいきません。

そこで、FC2ブログ専用の関連エントリージェネレーターを作りました。一度貼れば手間要らずで、自動的に関連エントリーを抽出して表示します。

・コードをコピペするだけ。
・一度貼れば、手間要らずで自動更新。
・はてぶ数表示やリスト数のカスタマイズが可能。
・リストは、タグまたはカテゴリーから選択可能。

こんな感じで、毎回設定する必要はありませんし、簡単に使うことができます。リストはタグをもとに関連度を測定しているので、ほかのジェネレーターに比べて関連度の高いエントリーを抽出することができます。カテゴリーの場合は、同カテゴリーの記事をリストアップします。

では使い方を説明します。

設定は、以下のコードをリストを表示したい場所にコピペするだけです。下のテキストエリアに表示されているコードを、あなたがリストを表示したい場所に貼り付けてください。例えば、記事の直後とかですね。オプションもお好みに合わせて設定してください。下のチェックボックスは選択と同時に、自動でコードは更新されます。

target="_blank": はてぶ数表示:抽出元: リスト数:
  <div id="related_entry"> 関連エントリー <script type="text/javascript" src="http://jp.cssez.com/entry_list.php?u=<%url>&e=<%topentry_no>&t=<%topentry_tag_list_parsename>-&c=<%topentry_category_link>&n=5"></script><noscript><a href="http://sayhelloworld.blog113.fc2.com/blog-entry-79.html" target="_blank">FC2ブログで関連エントリーリスト</a></noscript> </div>

アルゴリズムについて

関連エントリーの抽出はユーザータグまたはカテゴリーによって行っています。タグの場合、エントリーと同じタグが使用されているエントリーをリストアップし、そこからランダムに設定した数だけのエントリーを抽出しています。

確率的には、該当エントリーと同じタグが複数個ある記事のほうが、ひとつだけマッチした記事よりも多く表示されます。ですので、関連性が高い記事がより高い確率で表示されると言えるでしょう。タグのつけ方がキモですね。

カテゴリーの場合は、同カテゴリーのエントリーをランダムに抽出して表示します。

ここからは、リストのスタイルをカスタマイズしたい人向けです。どうでも良い人は読む必要はありません。

リストにスタイルを設定する。

リストは以下のような構成になっています。

   <div id="related_entry">
    関連エントリー
     <ul id="related_ul">
      <li class="related_li">記事のリスト</li>
      <li class="related_li">記事のリスト</li>
                    ・
                    ・
                    ・
     </ul>
	 	</div>

では、ひとつスタイルの設定例を書いておきましょう。

#related_entry {
 margin: 25px 15px 25px 55px;
}

#related_ul {
 padding: 5px;
}

.related_li {
 list-style: url(bullet.gif);
}

こんな感じでデザインを変更したい場合は、適当にスタイルを設定してください。

注意事項

以下の項目に同意した方のみご使用ください。

1. この関連エントリージェネレーターはβ版です。動作保証は致しません。
2. リストの一項目をPRに使ったり使わなかったりするかもしれません。
3. 仕様が変更される場合があります。カスタマイズはほどほどに。

もし気に入って頂けたら、ブログなんかで紹介してもらえると、うれしいです。張り切って、より使いやすいように改良します！それと、質問や感想などのコメント・トラックバックも大歓迎です。