【WordPress】いいねボタンを1記事に複数設置する方法『カウント付き』

ブログ記事 いいね 複数設置

基本的にブログで使用する『いいねボタン』は1記事に1つ、その記事を評価してもらうために使いますよね?

 

ある日ふと、1記事の中に複数の『いいね』ボタンを設置しているサイトをみて

「あ、自分もやってみたい!」と思いました。

というのも、記事の評価はもちろん知りたいけど、もっと細かく記事中で特にどの部分に共感してもらえたかを知りたかったからです。

 

これってアンケート記事などにも活用できそうじゃないですか?

 

それを実現してくれるプラグインが「BF Click Counter」です。

このプラグインは作者、まるやまたいち様のサイトからコードをコピーしてファイルをつくりWordPressにアップロードして設定する方法です。

(正式に公開されていないので、プラグインの検索をしても出てきません)

 

通常のプラグインの設定より、多少やることがあるのでこの記事でも補足しながら設置するところまで説明していきます。

BF Click Counter はシンプルな「いいね!」カウンター

本来『いいねボタン』は評価の共有のために設置することが多いですが、

「BF Click Counter」はSNSなどに連動するわけでもなく

シンプルに何人がいいねを押したかを知るための機能です。

ちなみにこんなかんじですね↓

 いいね! ❤ (4)

指定した文字列 +( )でカッコ内にリアルタイムでカウントされる仕組みでして、

同じIPアドレスから連続でクリックできないよう制御もされています。

BF Click Counter のインストール方法

ではここから実際にプラグインのインストールしていきます。

作者さんのこちらのコメント内容に同意した上で進めて行きましょう。

ご注意

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

あくまで自己責任で使いましょう、ということですね。

まるやま様ありがたく使わさせて頂きます!

 

まず、コチラから作者さんのサイトにアクセスします。

「設置方法」と書かれているところに(1)~(4)までの手順とその下のプログラムのソースが記載されています。

この方法で分かる人はそのまま進めましょう。

分かりづらい人は以下の手順で進めてみてください。

(私はこの方法で設置しました)

 

①PC上に新規フォルダ作成し(デスクトップがわかりやすい)フォルダ名を「bf-click-counter」とする。

②作者さんのサイトからプログラムのソースをコピーして、メモ帳に貼り付けする。「bf-click-counter.php」という名前で①のフォルダに保存する。

③フォルダを右クリック「送る」→「圧縮(zip形式)フォルダー」を選択してZIPファイルをつくる。

④WordPressの「プラグイン」→「新規追加」→「プラグインのアップロード」→「ファイルを選択」をクリックして③でつくったZIPファイルを指定しアップロード。

⑤有効化して完了

 

BF Click Counter の設定方法

次に表示させる文字を設定していきます。

特に編集をしなければ「いいね」と表示されます。

WordPressの「プラグイン」→「プラグインエディター」を選択し右上の「編集するプラグインを選択」の入力欄から

「bf-Click-counter.php」を選択します。

 

コピーしたコードが表示されるので、93行目と97行目の「いいね」の部分を編集します。

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

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

 

記事に「いいねカウンター」を設置

あとは設置したい場所に以下のコードを書けば「いいねカウンター」が表示されます。

 [bfcc id=”test_0001″] ※カッコ[ ]は半角にしてください

idの中身を変えることで別カウンターと認識されます。

以上が設置までです。

 

どうでしたか!とっても簡単にできましたよね!?

コードを公開してくださった、まるやま様に改めて感謝します!ありがとうございました。

それでは良きブログライフを。

NO IMAGE