Movable Type 備忘録

 Ajaxでアクセス・ランキングを表示する

[2009.03.20] 以下のページでご紹介してます最新の prototype 版ランキングスクリプトをご利用ください。

via: アクセスランキング・プラグイン(prototype.pagerank.js)

アンニョンハセヨ~(●´∀`●)

先週からページ・アクセス・ランキングなるものをトップページにて表示させてみました。
以前、PHPの勉強がてら作ったものなのですが、サーバ負荷でまともにページ表示できない時期があったので取り外してたものです。

それをサーバ負荷も考慮して(るつもり)、Ajaxでアクセス・ログ、リスト表示するよう変更してみましたの♪

巷ではもっと高性能なページ・ランキングを配布しているサイトさんもありますが、わたしのサイトでは自給自足的な、自分でできそうなことはできる限り作る!! が基本なので、ページ・アクセス・ランキングも作ってみました。

ホントはデータベースを使用しようと思ったのですが、わたしのサイトではMySQLを使ってるので、他のデータベース(SQLiteなど)を使用してる人は使えないな・・・ということで、テキストファイルでアクセス・ログを取るようにしてみました。

機能説明

今回作成した、Ajax版ページ・アクセス・ランキングの機能は以下の通りです。

  • Ajaxを使用しているので、JavaScript + PHPによるページ・アクセス・ランキングです。
  • prototype.jsを併用してます。
  • 収集したログはすべてテキストファイルに保存されます。
  • 任意の期間に達すると自動的にログを削除します。
  • Cookieを使用して、重複アクセスをカットします。
    ※同一ページのカウントは1ユーザ: 1日1回としています。
    ※もちろん、Cookieの有効/無効設定も可能です。
  • 自宅IPアドレスのアクセスは意識してカットしてません。でも、Cookie使えばカンタンにできると思います。

    [2007.06.01] 訪問者さんのご質問で、自身のアクセス(たとえば、自宅)によるカウントは除外したいとのことでしたので、以下のコメントの内容のようにすれば可能です。
    http://bizcaz.com/archives/2007/02/17-165010.php#c1545

  • デザインをお好みで変更できます。
  • めちゃくちゃなアクセスが集中した場合、もしかしたらログ落ちするかも、です。 一応それなりに、ログ収集側はできる限り処理を簡潔にさせてるつもりでいます (; ̄∇ ̄A

と、こんなかんじでしょうか。

ログ収集の仕方

今回は以下のようなディレクトリ構成として説明します。

  1. http://●●●.com/
  2.  +--- pagerank/
  3.       +-- ajax-loader.gif
  4.       +-- prototype.js
  5.       +-- ajaxrank.js
  6.       +-- index.php
  7.       +-- rank_config.php
  8.       +-- rank_post.php
  9.       +-- rank_view.php

以下のURLから圧縮ファイルをダウンロードして、適当なフォルダに展開します。
pagerank.zip

次に各自の環境に合わせてファイルを修正します。
まず、pagerank/ajaxrank.jsをテキストエディタで開いて、以下のように変更します。

  1. 3行目あたり
  2.  
  3. /*
  4.  * 以下2つのファイルのURLを設定します
  5.  */
  6. var rank_post_url = 'http://●●●.com/pagerank/rank_post.php'
  7. var rank_view_url = 'http://●●●.com/pagerank/rank_view.php'
  8. /*
  9.  * Cookie有効/無効フラグ(0:無効、1:有効)
  10.  * ※Cookieを無効にすると、ページにアクセスされるたびにカウントアップされます
  11.  * また、当然PHPスクリプトはその都度実行されます
  12.  */
  13. var rank_enable_cookie = 1;

青い字の部分では、これからアップロードするpagerank/rank_post.phpとpagerank/rank_view.phpファイルのURLを指定します。
赤い字の部分は、Cookie有効/無効の設定です。 Cookieを無効にしたい場合には、'0'を設定します。 ちなみに、ここでCookie無効の設定を行うと重複アクセスの制限が外れます。

一通り変更したら保存します。
次にpagerank/rank_config.phpファイルをテキストエディタで開いて、以下のように修正します。

  1. /*
  2.  * ページ・アクセス情報を保存するファイル名
  3.  */
  4. $GLOBALS['RANK_DATA'] = '●●●.data';
  5. /*
  6.  * 更新履歴情報を保存するファイル名
  7.  */
  8. $GLOBALS['PERIOD_DATA'] = '■■■.period';
  9. /*
  10.  * 上位何位まで表示するか設定します
  11.  * ★0を指定するとすべて表示します
  12.  */
  13. $GLOBALS['VIEW_COUNT'] = 20;
  14. /*
  15.  * 表示データ削除の周期を設定します
  16.  * ★必ず以下の設定範囲内で設定してください。
  17.  * ★未使用時は 0 を設定してください。
  18.  */
  19. $GLOBALS['PERIOD_MONS'] = 1;// 月:0~ 3の間で設定
  20. $GLOBALS['PERIOD_DAYS'] = 0;// 日:0~31の間で設定
  21. $GLOBALS['PERIOD_HOUR'] = 0;// 時:0~24の間で設定

赤い字の部分は任意の名前で構いませんので必須で変更してください。
ファイル中にコメントしていますが、青い字の部分は表示件数、履歴削除までの期間を指定します。 以下に設定例を記します。

  1. 3ヶ月周期でログクリア
  2. $GLOBALS['PERIOD_MONS'] = 3;
  3. $GLOBALS['PERIOD_DAYS'] = 0;
  4. $GLOBALS['PERIOD_HOUR'] = 0;
  5.  
  6. 1週間周期でログクリア
  7. $GLOBALS['PERIOD_MONS'] = 0;
  8. $GLOBALS['PERIOD_DAYS'] = 7;
  9. $GLOBALS['PERIOD_HOUR'] = 0;
  10.  
  11. 12時間周期でログクリア
  12. $GLOBALS['PERIOD_MONS'] = 0;
  13. $GLOBALS['PERIOD_DAYS'] = 0;
  14. $GLOBALS['PERIOD_HOUR'] = 12;

一通り変更したら保存します。
そして、pagerankフォルダごとサーバにアップロードします。 ここでは、上記で示したディレクトリ構成でアップロードするものとして説明しています。

最後にテンプレートを変更します。
メインページやエントリ・ページ、カテゴリページなど、ログとして収集したいテンプレートの<head>~</hread>の間に以下を追加します。

  1. <script type="text/javascript" src="<$MTBlogURL$>pagerank/prototype.js"></script>
  2. <script type="text/javascript" src="<$MTBlogURL$>pagerank/ajaxrank.js"></script>

青い字の部分を各自の環境に合わせて変更します。
次に</body>タグの直上あたりに以下を追加します。

  1. <script type="text/javascript">
  2. ajax_rank_post(<$MTBlogID$>, "<$MTBlogURL$>", "<$MTBlogName encode_html='1'$>");
  3. </script>
  4.  
  5. </body>

青い字の部分はブログIDになります。これは特に変更する必要ないと思います。
赤い字の部分はページのURLになります。各テンプレートのURLは以下のように指定するといいです。

  1. メインページ
  2. "<$MTBlogURL$>"
  3.  
  4. エントリアーカイブ
  5. "<$MTEntryPermalink$>"
  6.  
  7. カテゴリアーカイブ
  8. "<$MTCategoryArchiveLink$>"
  9.  
  10. 日別・月別アーカイブ
  11. "<$MTArchiveLink$>"

緑の字の部分はページのタイトルになります。各テンプレートのタイトルは以下のようになります。

  1. メインページ
  2. "<$MTBlogName encode_html='1'$>"
  3.  
  4. エントリアーカイブ
  5. "<$MTEntryTitle$>"
  6.  
  7. カテゴリアーカイブ
  8. "<$MTArchiveTitle decode_html='1' remove_html='1'$>"
  9.  
  10. 日別・月別アーカイブ
  11. "<$MTArchiveTitle decode_html='1' remove_html='1'$>"

以上で各ページのアクセスログを取得することができます。 後はいつものように再構築します。
再構築したら適当なページにブラウザからアクセスしてみてください。 そして、pagerank/index.phpをブラウザから表示してください。正しく表示されればOKです。

アクセス・ページ一覧の表示の仕方

最後にアクセス・ページの一覧表示です。
とりあえず、ここではメインページに一覧表示するものとして説明します。

メインページのサイドバーなどに以下を追加します。

  1. <img id="rank-progress" style="display:none;" src="ajax-loader.gif" alt="Loading..." />
  2. <div id="rank-viewer"></div>
  3. <script type="text/javascript">
  4. ajax_rank_view(1, 'rank-viewer', 'rank-progress');
  5. </script>
Ajaxload - Ajax loading gif generatorからお好みで作成してURLを変更してください。
赤い字の部分にアクセス・ページ・ランキングが表示されます。

変更したら保存して再構築します。
一覧表示は以下のようなXHTMLで出力されます。

  1. <ul id="page-rank">
  2. <li class="rank-list rank-list-eve"><a title="■■■" href="●●●"><strong>タイトル</strong> <span>アクセス数 hits</span></a></li>
  3. <li class="rank-list rank-list-odd"><a title="■■■" href="●●●"><strong>タイトル</strong> <span>アクセス数 hits</span></a></li>
  4. </ul>

CSSを使用して各自のお好みで変更してください。
また、まったく異なる表示で変更したい場合には、pagerank/rank_view.phpファイルの以下の部分を修正します。

  1. 30行目
  2. /*
  3.  * ▼ここからXHTML出力です▼
  4.  ***************************/
  5. $cnt = 0;
  6. $s = '<ul id="page-rank">'."\n";
  7.  
  8. foreach ($count as $key => $val)
  9. {
  10.     if ( $cnt++ % 2 )
  11.         $class = 'rank-list-odd';// 奇数番号の場合
  12.     else
  13.         $class = 'rank-list-eve';// 偶数番号の場合
  14.  
  15.     $s .= '<li class="rank-list '.$class.'"><a title="'.$title[$key].'" href="'.$url[$key].'"><strong>'.$title[$key].'</strong> <span>'.$val.'hits</span></a></li>'."\n";
  16.  
  17.     // 指定された上位ランク数に達したら終了します
  18.     if ( $GLOBALS['VIEW_COUNT'] && $cnt >= $GLOBALS['VIEW_COUNT'] ) break;
  19. }
  20.  
  21. $s .= '</ul>';
  22. /*
  23.  * ▲ここまでXHTML出力です▲
  24.  ***************************/

上記コードのところで、先ほど説明した一覧を出力結果を作成しています。
PHPの構文の知識がなくても、多少の変更ならXHTMLの知識があれば変更可能かと思います。

以上ざっと説明しましたが、何か不明点などありましたらご連絡ください ( ̄∇ ̄)/
では、SEE YOU

[2007.02.23] 不具合のご報告がありましたので修正しました。
修正内容は以下の通りです。

  • rank_view.php内で’PERIOD_DATA’で指定されたファイルのアクセスができないでいた。
  • rank_view.php内で’RANK_DATA'で指定されたファイルのアクセスができないでいた。

動作確認後に、他の人でも見やすくしようと思って一部関数化したのですが、その影響で上記変数のスコープ外で使用する形になってしまっていました。
ご迷惑をおかけしてすいません (m;_ _)mペコ

[2007.02.20] アクセス・ページのURL、リンク元URLのエンコード処理を追加しました。
ブラウザから直接CGIを実行された場合の処理を追加しました。

[2007.02.19] Ajaxを使用してPHPスクリプトを実行すると、PHPスクリプト側では正しいリンク元アドレス(REFERER)が取得できないみたいですの。
ですので、JavaScript側でリンク元アドレスを取得してPHP側に送信するよう修正しました。

 Trackback Pings(2)

from MOVABLETYPEでスキップ

MovableType備忘録さまでAjaxを使用したページランキングプラグイン...

from 【オープンソース情報サイト】 - 00px -

MovableType + Ajax でアクセスランキング

 Comments(39)

#1: Posted by gouache0125 @ February 22, 2007 [REPLY]
user-pic

はじめまして。「ページ・アクセス・ランキング」をブログで使ってみたのですが、以下のようなエラーが出てしまっています。指定されたファイルのパーミッションを変えても出てしまいました。
また、このエラーの下に、ちゃんとランキングの結果が表示されています。

Warning: flock(): supplied argument is not a valid stream resource in /home/●●●/lolipop.jp-dp********/web/blog_t/pagerank/rank_view.php on line 80

Warning: fputs(): supplied argument is not a valid stream resource in /home/●●●/lolipop.jp-dp********/web/blog_t/pagerank/rank_view.php on line 81

Warning: fclose(): supplied argument is not a valid stream resource in /home/●●●/lolipop.jp-dp*******/web/blog_t/pagerank/rank_view.php on line 82

どういうことなのでしょうか?

#2: Posted by ルアー @ February 22, 2007 [REPLY]
user-pic

XREAのサーバー環境でアップして動かしてみようと思ったのですが、うまく動作してくれません。
index.phpにアクセスしてもずっとロード画面のままになってしまいます。
また、rank_config.phpで設定したログファイルはアップすべきなのでしょうか?
よろしくお願いいたします。

#3: Posted by bzbell @ February 22, 2007 [REPLY]
user-pic

>>1 gouache0125 さん

はじめまして^^

ごめんなさい。
わたしのミスです(つω-`。)

動作確認してた頃からチョビッとコードを変更したため、その影響でした。
修正版をアップしましたので、rank_view.phpを上書きしちゃってください。

#4: Posted by bzbell @ February 22, 2007 [REPLY]
user-pic

>>2 ルアー さん

はじめまして^^

> index.phpにアクセスしてもずっとロード画面のままになってしまいます。

ということは、何らかの影響で応答がないためにクルクル回りっぱなしな状態なんだと思われます。
以下のことを確認してみていただけますか。

  1. ajaxrank.js内の3、4行目でPHPスクリプトのURLを指定しますが、そちらは問題ありませんか。
    記述したパスをブラウザから直接実行した場合、真っ白な画面になるか確認してみてください。
  2. prototype.jsの場所は正しいでしょうか。
    index.php内では、各PHPと同じ場所にあることを前提とした記述になっています。
  3. ディレクトリなどのパーミッションは問題ありませんか
    ディレクトリに読み書き権限がないとファイルが作成できませんので。

思い当たることはこんなところでしょうか。

> また、rank_config.phpで設定したログファイルはアップすべきなのでしょうか?

いえ、なければ新規にファイル作成されますので、特にアップする必要はないです。

#5: Posted by ルアー @ February 23, 2007 [REPLY]
user-pic

>>bzbellさん
お答えいただきありがとうございます。

動作いたしました。
ファイルは修正版の前では作成してくれなかったのですが、修正版で作成してくれました。
しかし、下記のようなエラーが出ちゃいます。
Warning: unlink() [function.unlink]: No such file or directory in /pagerank/rank_view.php on line 99
パーミッションなど色々試行錯誤してみましたが上記のエラーだけがどうしても解決できません。
お忙しいところ大変失礼いたしまうが回答のほうよろしくお願いいたします。

#6: Posted by bzbell @ February 23, 2007 [REPLY]
user-pic

>>5 ルアー さん

こんにちわ^^

あちゃ (>∀< )

ごめんなさい。
一部、関数化したところがありまして、その関数内の処理でエラーしちゃってました。
関数化しなきゃよかった(。-ω-)ボソ

修正版をアップしましたので、ご確認お願い致します (m;_ _)mペコ

#7: Posted by gouache0125 @ February 23, 2007 [REPLY]
user-pic

>>bzbellさん
お答えありがとうございます。

修正版をアップしてみましたが、また同じエラーがでてしまいました;

#8: Posted by bzbell @ February 23, 2007 [REPLY]
user-pic

>>7 gouache0125 さん

こんにちわ^^

> 修正版をアップしてみましたが、また同じエラーがでてしまいました;

ガ━━(゜ロ゜;)━━ン
先ほどわたしの方でも、データファイルを削除して確認したところ、同じ現象がでることを確認しました。
ホントごめんなさい。

原因は、一部関数化したことによって、内部変数が有効範囲外で使用したことが原因でした。
ちゃんと新規ファイルが作成されることを確認しましたので、お手数ですが再、再度ダウンロードして確認してみていただけますか (; ̄▽ ̄A

何度もごめんなさい...

#9: Posted by gouache0125 @ February 23, 2007 [REPLY]
user-pic

>>bzbellさん
何度も申し訳ないのですが、やはり以下のようなエラーが出ます。

Warning: flock(): supplied argument is not a valid stream resource in /home/●●●/blog_t/pagerank/rank_view.php on line 107

Warning: fputs(): supplied argument is not a valid stream resource in /home/●●●/blog_t/pagerank/rank_view.php on line 108

Warning: fclose(): supplied argument is not a valid stream resource in /home/●●●/blog_t/pagerank/rank_view.php on line 109

Warning: file(blog1data.txt): failed to open stream: No such file or directory in /home/●●●/blog_t/pagerank/rank_view.php on line 21

この前は一番最後のエラーは出なかったのですが、それは、手動でblog1data.txtというファイルをサーバに作ったからだと思います。

#10: Posted by bzbell @ February 23, 2007 [REPLY]
user-pic

>>9 gouache0125 さん

ガ━━(゜ロ゜;)━━ン

> 何度も申し訳ないのですが、やはり以下のようなエラーが出ます。

いえいえ、それはゼンゼン気になさらなくていいのですが…まだワーニングが出る!! ってのがショックです。
あのぉ…以下のことを確認していただいても構いませんか (; ̄▽ ̄A

rank_view.phpを以下のように変更してランキング表示してみてもらえますか。

17行目に追加
$GLOBALS['bzbell'] = 'bzbell';
110行目に追加
echo $GLOBALS['bzbell'];

上記の追加により、ブラウザには'bzbell'という文字列が表示されます。
確認したらすぐに削除されて構いませんので、'bzbell'が表示されるか否かをお手数ですが確認して頂けますか。

チョビッと原因が分からないんです。
ロリポのサーバだと出る現象なのかなぁ。

#11: Posted by gouache0125 @ March 1, 2007 [REPLY]
user-pic

>>bzbellさん
確認が遅くなってしまって申し訳ないです。
「bzbell」という文字列が表示されました。

#12: Posted by bzbell @ March 2, 2007 [REPLY]
user-pic

>>11 gouache0125 さん

こんにちわ^^

ということは、変数の値は正しいようです。

とすると、もしかして gouache0125 さんはrank_config.php内で記述するファイル名にパスなど指定してたりしますか!?
たとえば以下のようなかんじで♪

5行目
$GLOBALS['RANK_DATA'] = '../test.data';
9行目
$GLOBALS['PERIOD_DATA'] = './test/test.period';

わたしが確認したところでは、ディレクトリ名などを付加したファイル名では新規ファイルが作成されないことを確認しております。

もし、パスを指定していた場合にはお手数ですが、各PHPファイルと同じ場所を指定してみてもらえますか (; ̄∇ ̄A
ごめんなさい。勉強不足でパス指定は現状できないようです。

#13: Posted by gouache0125 @ March 2, 2007 [REPLY]
user-pic

>>bzbellさん
tank_config.phpを確認したところ、パス指定はしていませんでした。

#14: Posted by bzbell @ March 2, 2007 [REPLY]
user-pic

>>13 gouache0125 さん

こんにちわ^^

>>4でもお聞きしたのですが、ディレクトリのパーミッションに書き込み権限は付けてますでしょうか!?
たとえば、以下のようなディレクトリ構成の場合、pagerank/ディレクトリに書き込み権限を付加する必要があります。

http://●●●.com/blog/
+--- pagerank/    <-------- このディレクトリを777に変更します
+--- ajaxrank.js
+--- rank_config.php
+--- rank_view.php

データファイルを自動的に新規作成などするので、書き込み権限がないとファイルが作成されず、上記ワーニングが表示されると思うんです ( ̄∇ ̄)b
しつこいようですけど、再度確認お願い致します (m;_ _)mペコ

#15: Posted by ルアー @ March 3, 2007 [REPLY]
user-pic

おはようございます
色々と試行錯誤してみましたが、xreaで動作しませんでした
Warning: file() [function.file]: Unable to access blog1data.txt in /pagerank/rank_view.php on line 21

Warning: file(blog1data.txt) [function.file]: failed to open stream: No such file or directory in /pagerank/rank_view.php on line 21

Warning: Invalid argument supplied for foreach() in /pagerank/rank_view.php on line 24

index.phpにアクセスするとこんな感じでエラーが表示されます。
一応、
blog1period.txtは作成できてるみたいですが・・・

#16: Posted by bzbell @ March 3, 2007 [REPLY]
user-pic

>>15 ルアー さん

こんにちわ^^

上記エラー内容から、たぶんログファイルがないのにファイルオープンしようとして怒られてるんだと思います。
昨日そこら辺のエラー処理を追加したバージョンをアップしています。

// ファイル存在チェックします
if (!file_exists($GLOBALS['logfil'])) return;

上記のようなかんじでエラー処理を追加しました。
ワーニング出力しないようにしてもいいんですけどね (; ̄∇ ̄A

#17: Posted by gouache0125 @ March 15, 2007 [REPLY]
user-pic

>>bzbellさん
パーミッションを変更したらうまくできました!
どうもありがとうございます。

#18: Posted by bzbell @ March 15, 2007 [REPLY]
user-pic

>>17 gouache0125 さん

こんにちわ^^

> パーミッションを変更したらうまくできました!

やりましたねっ (>∀< )
良かったですぅ♪

今後ともよろしくお願い致します (m_ _)mペコ

#19: Posted by love210 @ May 5, 2007 [REPLY]
user-pic

アクセスランキング表示を、今日初めて組み込ませていただいたのですが、ブラウザで各ページを見ても真っ白になってしまいます。
pagerank/rank_post.phpも、pagerank/rank_view.phpも、pagerank/index.phpも真っ白です・・・ローディングのGIFは一瞬表示されますが・・・

ちなみにディレクトリのパーミッションを777に変更する前までは、Warningが出ていました。
rank_config.php内で記述するファイル名はURLで表示しています。

自分では原因がわからず困り果てました・・・宜しければ教えていただけると幸いです。

#20: Posted by love210 @ May 5, 2007 [REPLY]
user-pic

す・・・すみません!今自分のブログを確認したら、ログが表示されるようになっていました。

先ほどコメントしてから全く設定をいじっていないので、恐らく単にブログへのアクセスがまだ無かったから何も表示されなかった・・・ということでしょうか。

色々な意味で恥ずかしいです。ご面倒をおかけしてすみませんでした・・・。

#21: Posted by love210 @ May 31, 2007 [REPLY]
user-pic

何度も質問してすみません。
(1)ログをクリアする方法はあるでしょうか?
(2)また、自分をカウント除外する方法はあるでしょうか?

1ヶ月間のアクセス数を知りたかったのですが、導入したのが月初めではなく半端な日だったため、一旦ログをクリアしたくなりました。
お手数をおかけしますが指南お願い致します。

#22: Posted by bzbell @ June 1, 2007 [REPLY]
user-pic

>>21 love210 さん

こんにちわ^^

ご質問の件ですが、

  1. はい。普通にログファイルを削除するだけです。
    通常だと、rank_view.php と同じ場所にテキストファイルが作成されますので、そちらをバッサリと削除してください。

  2. はい。以下のようにすれば可能です。

    • まず除外したい IP アドレスを、以下のスクリプトを使ってチェックします。

      rank_check.php
      <?php echo "あなたのIPアドレスは {$_SERVER['REMOTE_ADDR']} です" ?>
      

      上記スクリプトを rank_check.php というファイル名で保存して、rank_config.php と同じ場所にアップロードします。

    • 上記スクリプトをブラウザから実行して、IP アドレスをチェックします。

    • そして rank_config.php に上記スクリプトでチェックした IP アドレスを追加します。
      たとえば、123.456.789.123 と 456.789.123.456 の2つの IP アドレスを除外したい場合以下のように追加します。

      rank_config.php::24行目
      $GLOBALS['SELF_ADDR'] = array('123.456.789.123', '456.789.123.456');
      
    • 次に rank_post.php に以下を追加します。

      rank_post.php::12行目あたり
      /*
      * 任意IPアドレスによるアクセスを除外します
      */
      foreach ($GLOBALS['SELF_ADDR'] as $value)
      {
      if ($value == $_SERVER['REMOTE_ADDR']) return;
      }
      
    • 一通り追加したらサーバにアップロードします。

以上で任意の IP アドレスによるアクセスは除外することができます。
ただし、除外する IP アドレスはアクセスされるたびにチェックしますので、あまり多過ぎないように気をつけてくださいね ( ̄∇ ̄)b

#23: Posted by love210 @ June 1, 2007 [REPLY]
user-pic

>>22 bzbell さん

丁寧な解説ありがとうございました!お陰様でログのクリア、カウント数の自分除外の二つとも実現できました。
お伺いするまで、ログのクリアのためにテキストファイルの「中身」を必死に消そう消そうとしておりました・・・・・しゅ、修行します。

#24: Posted by bzbell @ June 2, 2007 [REPLY]
user-pic

>>23 love210 さん

こんにちわ^^

お返事が遅くなりすいません (m;_ _)mペコ

> 丁寧な解説ありがとうございました!お陰様でログのクリア、カウント数の自分除外の二つとも実現できました。

よかったですね。love210 さんの目的のことができてなによりです (●´∀`●)
お互いがんばりましょっ♪

#25: Posted by irori @ June 8, 2007 [REPLY]
user-pic

はじめまして、こちらのアクセスランキングを利用させていただこうとしているのですが、
index.phpが白紙表示されて困っております。(ロード画像は表示されます)

ディレクトリは以下のように設置しております。
http://suere.sakura.ne.jp/
+--- skip/ (ブログのフォルダです)
  +--- pagerank/
  +-- ajax-loader.gif
  +-- prototype.js
  +-- ajaxrank.js
  +-- index.php
  +-- rank_config.php
  +-- rank_post.php
  +-- rank_view.php

さくらインターネットをしようしておりますので、フォルダ、PHPファイルともに、
パーミションを「755」に設定しています。

ajaxrankの、3、4行目は以下のように修正しています。
var rank_post_url = 'http://suere.sakura.ne.jp/skip/pagerank/rank_post.php'
var rank_view_url = 'http://suere.sakura.ne.jp/skip/pagerank/rank_view.php'

エントリーのランキングをとりたいので、エントリーアーカイブに下記を追記しました。
script type="text/javascript" src="<$MTBlogURL$>pagerank/prototype.js"></script>
<script type="text/javascript" src="<$MTBlogURL$>pagerank/ajaxrank.js"></script>

<script type="text/javascript">
ajax_rank_post(<$MTBlogID$>, "<$MTEntryPermalink$>", "<$MTEntryTitle$>");
</script>

試しに、エントリーに接続したところ、blog1skip.periodとblog8skip.dataが生成され、
アクセスした記録はされていたのですが、肝心のindex.phpに表示されていない状態です。

手順どおりにやったつもりなのですが手詰まりになっております。
どこかおかしいところがあるのでしょうか?ご指摘よろしくお願いいたします。

irori

#26: Posted by bzbell @ June 8, 2007 [REPLY]
user-pic

>>25 irori さん

こんにちわ^^

ご質問の件ですが、ログは収集されているとのことですね ( ̄∇ ̄)b
また、irori さんの環境の pagerank/index.php をブラウザでアクセスしても表示されないということですね!?

  1. では、pagerank/index.php 内の以下の太字の部分をログ収集しているブログの、ブログIDに変更してください。

    ajax_rank_view(1, 'rank-viewer', 'rank-progress');
    
  2. 次に、ブラウザから pagerank/index.php を表示させてみだくさい。
    正しく表示されれば、pagerank/index.php 内で使用している以下のコードを、ランキング表示させたいテンプレート内に埋め込みます。

    <img id="rank-progress" style="display:none;" src="<$MTBlogURL$>image/ajax-loader.gif" alt="Loading..." />
    <div id="rank-viewer"></div>
    <script type="text/javascript">ajax_rank_view(<$MTBlogID$>, 'rank-viewer', 'rank-progress');</script>
    

    注意するところを太字にしています。

これでランキング表示されると思います ( ̄∇ ̄)b

#27: Posted by irori @ June 9, 2007 [REPLY]
user-pic

>>26 bzbell さん

こんばんは、iroriです。すばやいお返事ありがとうございました。
index.phpを書き換えましたら、正常に表示されました。
次に表示用のタグをWidgetにしてトップページに表示してみましたが、
ページエラーが発生したとのことで、<head>の間に
<script type="text/javascript" src="<$MTBlogURL$>pagerank/prototype.js"></script>
<script type="text/javascript" src="<$MTBlogURL$>pagerank/ajaxrank.js"></script>
を追加したら無事にトップページに表示されました。
こんなに早くお返事いただけるとは思っていなかったので感激です。
これからもいろいろ参考にさせていただきます。
ありがとうございました。

#28: Posted by bzbell @ June 9, 2007 [REPLY]
user-pic

>>27 irori さん

よかったですね (●>∀<●)
こちらこそよろしくお願いします (m;_ _)mペコ

#29: Posted by iron @ July 24, 2007 [REPLY]
user-pic

CSSはどのように設定されていますか?

#30: Posted by bzbell @ July 24, 2007 [REPLY]
user-pic

>>29 iron さん

こんばんわ^^

わたしのとこでは、ランキングにイメージファイルを使用しています。
ですので、以下のような CSS になります。

ul#page-rank li span {/* すべてのランキングに共通なスタイル */
line-height: 2;
background-image: url(pagerank-loader.gif);
background-repeat: no-repeat;
background-position: right 3px;
}
ul#page-rank li span.rank-list-1st {/* ランキング 1 位 */
background-image: url(pagerank1-loader.gif);
background-position: right 3px;
}
ul#page-rank li span.rank-list-2nd {/* ランキング 2 位 */
background-image: url(pagerank2-loader.gif);
background-position: right 3px;
}
ul#page-rank li span.rank-list-3rd {/* ランキング 3 位 */
background-image: url(pagerank3-loader.gif);
background-position: right 3px;
}

ご参考までに (●´∀`●)

#31: Posted by iron @ July 24, 2007 [REPLY]
user-pic

?

という事はXHTMLはどうなっていますか?

#32: Posted by bzbell @ July 25, 2007 [REPLY]
user-pic

>>31 iron さん

こんばんわ^^

あちゃ (>∀< )

記事内容が古いままでしたね。すいません。
XHTML は以下のように出力されます ( ̄∇ ̄)b

<ul id="page-rank">
<li class="rank-list rank-list-eve"><a title="■" href="●" target="_blank"><span>アクセス数 hits</span>タイトル</a></li>
<li class="rank-list rank-list-odd"><a title="■" href="●" target="_blank"><span>アクセス数 hits</span>タイトル</a></li>
</ul>

また、わたしのサイトの場合、テンプレート的にアクセス数が右に回りこまれます。
具体的には以下のようなかんじになります。

ul#page-rank li a {
width: 95%;/*これは任意*/
line-height: 2;
display: block;
}
ul#page-rank li span {/* すべてのランキングに共通なスタイル */
float: right;
}

その際、ランキングリストの最後で回り込みを解除する必要があります。
iron さんが使われてる CSS にて回り込みを解除(clear:both;)してください。

または、rank_view.php を以下のように変更します。

71行目
変更前
$s .= '<p style="text-align:right;">1ヶ月間ログを集計します。</p>';
変更後
$s .= '<p id="rank-text">1ヶ月間ログを集計します。</p>';

そして CSS を以下のようにします。

p#rank-text {
text-align:right;
clear: both;
}

そうすれば、わたしのサイトと同様のランキング表示がされると思います ( ̄∇ ̄)b
まとめると以下のようになります。

ul#page-rank li a {
width: 96%;/*これは任意*/
line-height: 2;
display: block;
}
ul#page-rank li a span {/* すべてのランキングに共通なスタイル */
float: right;
line-height: 2;
background-image: url(pagerank-loader.gif);
background-repeat: no-repeat;
background-position: right 3px;
}
ul#page-rank li a span.rank-list-1st {/* ランキング 1 位 */
background-image: url(pagerank1-loader.gif);
background-position: right 3px;
}
ul#page-rank li a span.rank-list-2nd {/* ランキング 2 位 */
background-image: url(pagerank2-loader.gif);
background-position: right 3px;
}
ul#page-rank li a span.rank-list-3rd {/* ランキング 3 位 */
background-image: url(pagerank3-loader.gif);
background-position: right 3px;
}
p#rank-text {
text-align:right;
clear: both;
}
#33: Posted by nao @ August 23, 2007 [REPLY]
user-pic

はじめまして
興味深く記事拝見させて頂きました。

早速私も試してみようとDLさせていただきました、
うまくログをとり表示させるまではうまくいったのですが

ログの書き出しがeuc-jpになってしまうのはどうしてでしょうか、出来ればutf-8で書き出したいと思っております。。。

初歩的な質問と思いますがよろしくお願いします

#34: Posted by nao @ August 23, 2007 [REPLY]
user-pic

解決しました

phpのmbstring.internal_encodingがeuc-jpだったのが問題だったようです
サーバー環境は変えられないので

rank_post.phpに
define('Charset', 'UTF-8');と定義することで問題が解決いたしました
お騒がせしてすいません^^;

#35: Posted by bzbell @ August 23, 2007 [REPLY]
user-pic

>>33 nao さん
>>34 nao さん

こんばんわ^^

> rank_post.phpに
> define('Charset', 'UTF-8');と定義することで問題が解決いたしました

一足違いだったようですね。
以下のページで文字化け対策が紹介されてたんだけど・・・覚え書になっちゃいました。
http://tsuttayo.sytes.net/php/char_trn/index.html

でも解決してよかったです (●´∀`●)

#36: Posted by さじ @ October 9, 2007 [REPLY]
user-pic

はじめまして。
いつも参考にさせていただいております。
アクセスランキング使ってみたいなと思っているのですが、MT4からつかえるMultiBlogを使っていまして、複数のBlogのランキングをまとめて表示したいなと思っているのですが、可能ですか?
説明を読んでみたのですが、そこらへんがわかりませんでした。
もしできれば教えてくださいませ、よろしくおねがいします。

#37: Posted by Author Profile Page bzbell @ October 9, 2007 [REPLY]
user-pic

>>36 さじ さん

こんにちわ^^

> 説明を読んでみたのですが、そこらへんがわかりませんでした。

すいません。説明が下手で orz

> もしできれば教えてくださいませ、よろしくおねがいします。

複数のブログのランキング表示は可能です。
すべてのブログにスクリプトを埋め込むだけです。
そうすれば、1 つのログファイルに集約されます。

ただし、デフォルトではブログ固有としています。ですので、ブログ ID に依存しないようにする必要があります。

帰宅したら後ほどご紹介します♪

#38: Posted by さじ @ October 10, 2007 [REPLY]
user-pic

>>37 bzbell さん
お手数かけます。
すみません、読解力が不足していまして。。。いつも詳しい説明で助かっておりますよ。

お時間できましたら、ご教示よろしくおねがいします。

#39: Posted by Author Profile Page bzbell @ October 10, 2007 [REPLY]
user-pic

>>38 さじ さん

こんばんわ^^

> お時間できましたら、ご教示よろしくおねがいします。

はい♪
少しお時間ください。

 Post a Comment

 

コメント用フィード