WordPressプラグイン「BF Click Counter」

自作曲コーナーに設置してある「いいね」ボタンは、自作のWordPressプラグインです。
ショートコードでIDを書くだけで、独自の「いいね」ボタンが作れて、ボタンを押すとカウントアップしてくれて、１ページにたくさん設置できる、いわゆる「クリックカウンター」を探していたのですが、ページ単位だったりとなかなか良いものがなく、「ないのなら、作ってしまえ！」ということで、見よう見まねで作ってみました。Facebookの「いいね」は共有を目的としていますが、この「いいね」はサイト独自のもので、みんなに褒めてもらうだけを目的としたものです。

まだ、正式なプラグインとして公開できる代物ではないので、コードを紹介するに留めます。
Ajaxを使ったWordPressのプラグインとしては、むずかしいことをしていないので、すごく基礎的なコードかなぁと思います。

デモ

こんな感じで動きます。押すとカウンターが増える。それだけです。
このコードがいいなと思った人も、押してあげてください。
ちなみにここでは名古屋弁にしてあります。
Like!(1907)

使い方

編集画面にショートコードを書くだけ
［bfcc id="christmas_day"］
（かっこは半角にしてください）
id には適当な文字列を入れてください。そのIDを認識してカウントアップします。
要するにidの中身を別の文字列にするだけで、新しいカウンターを作成することになります。
同じIPの連続カウントアップは受け付けません。
bootstrapのCSSを使うことを前提として class名が「btn btn-default」のリンクを生成します。bootstrapが無い方は自分でスタイルをつけてください。

ご注意

自己責任でご自由にお使いください。このプログラムが損害を与えたとしても責任はとりません。
前処理、後処理が適当です。インストールするとwp_bf_click_counterというテーブルが作成されますが、アンイストールしても残ります。不要になったらテーブルを削除してください。

設置方法

（１）wp-content/plugins の中に、 bf-click-counter というディレクトリを作成
（２）さらにその中に bf-click-counter.php というファイル名で、以下のコードを作成。
（３）WordPressのプラグイン一覧に「BF Click Counter」が表示されるので有効化。
（４）あとは上記「使い方」を見て、じゃんじゃんショートコードを設置してください。

<?php
/*
Plugin Name: BF Click Counter
Author: Taichi MARUYAMA
Plugin URI: https://maruyama.breadfish.jp/
Description: シンプルなクリックカウンターです。
Version: 0.11
Author URI: https://maruyama.breadfish.jp/
Text Domain: bf-click-counter
*/

global $wpdb;
global $bf_click_counter;		// IDをキーにしてカウント数を格納
global $bf_click_ip;			// IDをキーにしてIPアドレスを格納

/**
 * DBで使うテーブル名を返す
 * 
 * @access public
 * @return void
 */
function bf_click_counter_get_table_name() {

    global $wpdb;
    return $wpdb->prefix . "bf_click_counter";

}

/**
 * アクティベーション。テーブルの作成を行う。
 * 
 * @access public
 * @return void
 */
function bf_click_counter_activation() {

    global $wpdb;
    $charset_collate = $wpdb->get_charset_collate();
    $table_name = bf_click_counter_get_table_name();	

    $sql = "CREATE TABLE $table_name (
      id mediumint(9) NOT NULL AUTO_INCREMENT,
      keyname text NOT NULL,
      count int NOT NULL,
      ipaddress text NOT NULL,
      register_datetime datetime DEFAULT '0000-00-00 00:00:00' NOT NULL,
      update_datetime datetime DEFAULT '0000-00-00 00:00:00' NOT NULL,
      UNIQUE KEY id (id)
    ) $charset_collate;";

    require_once( ABSPATH . 'wp-admin/includes/upgrade.php' );
    dbDelta( $sql );	

}

register_activation_hook(__FILE__, 'bf_click_counter_activation');

/**
 * ロード時に変数を初期化する.
 * 
 * @access public
 * @return void
 */
function bf_click_counter_initialize() {
    global $wpdb, $bf_click_counter, $bf_click_ip;
    $bf_click_counter = array();
    $table_name = bf_click_counter_get_table_name();	

    $results = $wpdb->get_results("SELECT * FROM $table_name");
    foreach($results as $one) {
        $bf_click_counter[$one->keyname] = $one->count;
        $bf_click_ip[$one->keyname] = $one->ipaddress;
    }
}
add_action('init', 'bf_click_counter_initialize');

/**
 * ショートコードの処理。ボタン（カウント数）を表示する
 * 
 * @access public
 * @param mixed $atts
 * @return void
 */
function bf_click_counter_display($atts) {
    global $bf_click_counter;

    extract(shortcode_atts(array(
        'id' => '0',
    ), $atts));
  
    // カウンターがすでにある場合
    if (array_key_exists($id, $bf_click_counter)) {
        return '&lt;a href="javascript:void(0);" class="btn btn-default bf-click-counter" data-id="' . $id . '">いいね(&lt;span class="count">' . $bf_click_counter[$id] . '&lt;/span>)&lt;/a>';
    }

    // カウンターがない場合はカウント数ゼロでボタンを表示
    return '&lt;a href="javascript:void(0);" class="btn btn-default bf-click-counter" data-id="' . $id . '">いいね(&lt;span class="count">0&lt;/span>)&lt;/a>';
}
add_shortcode('bfcc', 'bf_click_counter_display');

/**
 * JavaScript(Ajax)の出力（いいねボタンの押下を受け付ける）
 * 
 * @access public
 * @return void
 */
function bf_click_counter_ajax() {
?>
    &lt;script>
        var bf_ajaxurl = '&lt;?php echo admin_url( 'admin-ajax.php'); ?>';

        jQuery(function() {
            jQuery('.bf-click-counter').click(function() {
                var self = this;
                jQuery.ajax({
                    type: 'POST',
                    url: bf_ajaxurl,
                    data: {
                        'id' : jQuery(this).attr('data-id'),
                        'action' : 'bf_click_counter_countup',
                    },
                    success: function( response ){
                     	jQuery(self).find('.count').html(response);   
                    }
                });				

                return false;
            });
        })

    &lt;/script>
&lt;?php
}
add_action( 'wp_head', 'bf_click_counter_ajax');

/**
 * Ajaxの受付処理
 * 
 * @access public
 * @return void
 */
function bf_click_counter_countup(){
    bf_click_counter_initialize();
    global $wpdb, $bf_click_counter, $bf_click_ip;
    $id = $_POST['id'];
    $ipaddr = $_SERVER["REMOTE_ADDR"];
    $nowdate = date('Y-m-d h:m:s');	// 登録日付

    // カウンターがすでにある場合、インクリメントしてDBをアップデート
    if (array_key_exists($id, $bf_click_counter)) {
        // 同じIPからの連続いいねは阻止
        if ($bf_click_ip[$id] != $ipaddr) {
            $bf_click_counter[$id]++;
            $wpdb->update(bf_click_counter_get_table_name(), array('count' => $bf_click_counter[$id], 'ipaddress' => $ipaddr, 'update_datetime' => $nowdate), array('keyname' => $id));
        }

    // カウンターがない場合、DBにインサート
    } else {
        $bf_click_counter[$id] = 1;		// 初期値は1
        $wpdb->insert(bf_click_counter_get_table_name(), array('keyname' => $id, 'count' => 1, 'ipaddress' => $ipaddr, 'register_datetime' => $nowdate));
    }
    echo $bf_click_counter[$id];
    die();
}
add_action( 'wp_ajax_bf_click_counter_countup', 'bf_click_counter_countup' );
add_action( 'wp_ajax_nopriv_bf_click_counter_countup', 'bf_click_counter_countup' );

WordPressプラグイン 「BF Click Counter」

デモ

使い方

ご注意

設置方法