Popularity Contest

アクセス回数やコメント数・トラックバック数を元に各エントリをランク付けして人気エントリを表示するプラグインPopularity Contest 日本語版を導入しました。
日本語での解説はこの辺りが詳しいです。

んで、人気度をテキストで表示するだけだと寂しかったのでちょっと修正して棒グラフで表示するように変更。
棒グラフは2枚の画像ファイルとCSSで表示しています。


プラグインを有効化すると、本文の後に以下のコードが自動的に挿入されます。

<p class="akpc_pop">人気度: 20%</p>

このまんまでも良いんですが、ちょっと寂しかったので、グラフ表示させることにしました。
まずは、これを吐き出している関数 akpc_content_pop() を修正しましょう。

function akpc_content_pop($str) {
        if (is_feed() || is_admin_page() || is_page()) {
                return $str;
        }
        global $akpc, $post;
//        return $str.'<p class="akpc_pop">'.$akpc->get_post_rank($post->ID).'</p>';
        if (strstr($akpc->get_post_rank($post->ID), '%')) {
          $wk_popularity = preg_replace('/^.* (\d+)%.*$/i', '$1', $akpc->get_post_rank($post->ID));
        } else {
          $wk_popularity = 0;
        }
        return $str.'<dl class="akpc_pop"><dt>'.__('Popularity:', 'alexking.org').'</dt><dd><div style="width:'.$wk_popularity.'%;"><strong>'.$wk_popularity.'%</strong></div></dd></dl>';
}

この修正で、以下のコードを吐き出すようになります。

<dl class="akpc_pop"><dt>人気度:</dt><dd><div style="width:20%;"><strong>20%</strong></div></dd></dl>

あとは、これを棒グラフとして表示してやります。
CSSで以下のように指定すればよいですね。

/* for Popularity */
dl.akpc_pop {
 margin:0;
 padding:0;
 float:right;
 clear:both;
}

dl.akpc_pop dt {
 position:relative;
 display:block;
 float:left;
 width:123px;
 height:12px;
 margin-right:17px;
 font-size:.75em;
 text-align:right;
 line-height:12px;
}

dl.akpc_pop dd {
 position:relative;
 display:block;
 float:left;
 width:123px;
 height:12px;
 margin:0 0 15px;
 padding:0;
 background:url("percentImage.png");
}
* html dl.akpc_pop dd {
 float:none;
}

dl.akpc_pop dd div {
 position:relative;
 float:left;
 background:url("percentImage_back.png");
 height:12px;
 width:75%;
 text-align:right;
}

dl.akpc_pop dd div strong {
 position:absolute;
 font-size:0.75em;
 text-align:left;
 right:0em;
}

CSSで使った画像ファイルを置いておきます。


追記:2007年10月5日
導入するだけで簡単に棒グラフ表示するプラグイン Popularity bar graph をリリースしました。
よろしければ、そちらもお試しください。

Popularity Contest」への8件のフィードバック

  1. ピンバック: 使用している WordPress Plugin : 独断と偏見の何でもレビュー

  2. をかもと 投稿作成者

    Snail さん、どもです。

    $wk_popularity = ereg_replace('[^0-9]', '', $akpc->get_post_rank($post->ID));
    数値以外を消すってことですね。
    注意しなければいけないのは、今後のバージョンアップで "$akpc->get_post_rank($post->ID)" が % 以外の数字を含むようになってしまったときだけですが、今使用しているバージョンでは問題ないですね。

    返信
  3. Snail

    どうしても一桁しか取得できないようです。

    んで、PCにPHP環境をインストールして、あ〜だこ〜だいじくってみました。
    要はあの変数から数字を抜き出せば良いのだから……ってことで、ちょっと関数を変えてみました。

    $wk_popularity = ereg_replace('[^0-9]', '', $akpc->get_post_rank($post->ID));

    あの一行をこんな風に変えてみたところ、期待通りの結果が得られているようですが、どうでしょう? 問題ないですよね。

    返信
  4. Snail

    あ、、、そこは(?d+)になっていたりします。 気が付いてスペースだけを消すように自力でしていたりします(^_^;
    なのに、あの結果なんですよねぇ。。。(T_T)
    うみゅ〜。

    返信
  5. をかもと 投稿作成者

    Snail さん、どもです。

    コメント内に書いた文が間違ってました。
    $wk_popularity = preg_replace('/^.*(\d+)%.*$/i', '$1', $akpc->get_post_rank($post->ID));
    # コメント欄に半角の+を入力すると、なぜか消えちゃうみたいです。<code>タグでくるめば、おっけ

    \d+で、「数値の1回以上の繰り返し」を表しますので、これで取れるはず。
    \dだけだと任意の1文字の数値になるので、一の位の桁だけしか取ってきません。

    返信
  6. Snail

    私のブログにもコメントいただきまして有り難う御座いました。
    うまくグラフ表示されるようになりました。?(^o^)/

    ただ……、また1つ問題が……。
    現状グラフ表示にしてありますが、オリジナルで表示されるパーセンテージの数値が変わってしまっているようです。
    オリジナルで表示させると、47%->7% 28%->7% 31%->1% てな感じで、大幅に変わっています。
    10の位の桁落ちかな?とも思いましたが、28が7になるってのも、不思議だったりします。

    ちなみに、うちの一番人気の記事は100%なんですが、それも0%とかになっているんですよねぇ。
    なんでなんでしょ(T_T)

    返信
  7. をかもと 投稿作成者

    Snail さん、はじめまして。

    $wk_popularity がうまく取れてませんね。
    1579行目を
    $wk_popularity = preg_replace(‘/^.*(\d )%.*$/i’, ‘$1’, $akpc->get_post_rank($post->ID));
    # ".*" と "(\d )%" と ".*" の間のスペースをカット
    にすると、どうでしょうか?

    返信
  8. Snail

    初めまして。
    こちらの人気度グラフ表示が気に入ったので、見よう見まねで導入してみましたが、どうもうまくいきません。
    思うに、正規置き換えがうまくいっていないような感じです。
    現状のまま私のサイトにで見られますので、問題点が分かれば教えて頂きたいです。
    私、正規表現の置き換えが全く分からないので、直せなくて……(T_T)

    返信

コメントを残す

メールアドレスが公開されることはありません。