こんにちは、WPホームページ研究所の運営サポートチーム(@WP_LABO)です。
本記事では将来的に開発を目指しているプラグインの案をご紹介させていただきます。まだまだ作成したいプラグインは山ほど頭の中にありますが時間が足りず開発できていないものばかりです。しかし、このままではアイデアのみとして記憶から消えてしまう可能性もあるので、念のために記事として仕様を残しておきます。
目次
【願望】ウィジェットで指定した設定を50%で切り替えるプラグイン
ワードプレスではサイドバー内にバナーを設置する場面が多くなります。ロングテールキーワード(複合キーワードの組み合わせ)を検索してサイトにやってくる来訪者のクリックを期待して設置するからです。
しかし、当然ですが、バナーを設置すると「良い結果が出るバナー」と「空振りだらけのバナー」に別れます。そこそこ成績の良いバナーもありますが僕たち運営者が求めているのは圧倒的な成果を生むバナー。
そこで「ウィジェットを50%比率で自動表示切り替えするプラグイン」があれば良いバナーを導き出せるのではないかと仮定いたしました。ちなみにワードプレスでは、ユーザーごとでページ全体を切り替えるABテストプラグインも存在していますがもう少しお手軽にサクッと実装できるプラグインがあれば人気が出そうです。
プラグインを有効化する前のウィジェット
以下が想定の画面です。プラグインの導入前はウィジェットに変化はありません。
プラグインを有効化した後のウィジェット
プラグインを有効化した後は各ウィジェットの最下部にチェックボックスが表示。設定していない状態ではセレクトボックスがdisabled="disabled"
で無効化されています。チェックマークを有効にしなければ使わない機能なので視覚的にもわかりやすいですよね。CSSのdisplay:none;
で非表示化もありです。
ウィジェットの切り替えを設定する方法
自動表示を設定する手順は3つで考えています。あまりに複雑すぎると利用者も使い方を理解する前に離脱してしまう原因になります。ウィジェット関連の機能であればウィジェット周りで完結するのがベスト。
1. チェックマークを有効にする
チェックマークを有効にするとセレクトボックスが選択可能になります。
2. 表示を切り替えるウィジェットを選ぶ
セレクトボックスには現在同じサイドバー内に表示されているウィジェットの一覧。
3. ウィジェットを保存する
このなかで自動切り替えを行うウィジェットを選びます。ちなみに以下のスクリーンショットでは同じ「カスタムhtml」で異なったバナーが差し込まれているウィジェットを選んだ状態の画面を想定しています。
保存ボタンを押すと設定が反映されます。
ウィジェットの表示状態を確認
上記の通り設定が完了すると紐づけたウィジェット同士が50%比率で表示されます。ユーザーAがアクセスすると1つ目のバナーが表示されて、ユーザーBがアクセスすると2つ目のバナーが表示されるという意味です。ユーザーに応じてウィジェットを切り替えられると「クリック数の多いバナー」などを絞れます。
補足
サイトに訪れたユーザーに50%の割合でバナーを自動切り替えできるとバナーのクリック率を比較できます。クリック率を算出したいときは「アクセス数(PV数など)」を「クリック数」で割ればOK。もちろん、わざわざクリック率まで出さなくても単純にクリック数の多いバナーを優秀なバナーとしても構いません。
プラグインを有効にすると各ウィジェットの最下部に「チェックボックスとセレクトボックス」を追加するロジックを書いて「すでに保存されているウィジェットのデータ」をセレクトボックスに挿入する流れです。紐づけたウィジェット側はCSSで非表示化して、指定側に50%比率で出せば動作としての整合性も取れますよね。
あとはページ側に表示されるウィジェットを50%比率でランダム表示すればOK。ランダムで表示する部分はソースに合わせて最適化も必要ですがおおむね以下のような単純なプログラミングで問題なし。
<?php
// 50%の確率でランダム表示
// 0 か 1 をランダムに代入
$n = rand(0,1);
// $n の値が 0 だったら表示
if ($n == 0) {
echo '元々(ウィジェット)の設定';
// $n の値が 0 ではない場合に非表示
} else {
echo '紐づけた側(ウィジェット)の設定';
}
?>
紐づけたウィジェットのタイトルと表示部分を50%の割合で切り替わるようにロジックを書きましょう。
htmlメモ
念のため使用するhtmlも残しておきます。
<input type="checkbox" class="checkbox" id="" name="">
<label for=""><small>表示を自動切替する</small></label>
<select id="" name="" class="widefat" style="margin-bottom:5px;" disabled="disabled">
<option value="default" selected="selected">対象のウィジェットを選択ください</option>
<option value="widget1">カスタム HTML: 書いているひと</option>
<option value="widget2">WordPress Popular Posts: 人気の記事</option>
<option value="widget3">カテゴリー: カテゴリー別で探す</option>
<option value="widget4">タグクラウド: 関連するキーワード</option>
<option value="widget5">検索: キーワードで検索する</option>
</select>
まとめ
今回は頭のなかで作成を予定していたプラグインの仕様書を作成前に公開いたしました。もし作ってあげるよ!という有志の方がいらっしゃったらぜひこの仕様でプラグインを作成していただければ幸いです。余力があればスタッフの方で作成しますが無料テーマの更新やその他対応で正直なところあまり時間がとれません。
プラグインは仕様さえ決まるとさくっと作れるのでプログラミングの勉強にもぴったりです。またJavaなどコンパイル型の言語が触れる方であればWordPressのプラグインは意外と作れます。必要なのは熱意。
他にも「こんなプラグインがあったら便利だな」というアイデアがあればお気軽にご相談くださいませ。
最新式の無料プラグインを事前公開
WordPressは公式サイトに登録済みのプラグインだけで全機能を補足しきれません。当サイトでは使いやすさを追求した魅惑的なプラグインを無料でダウンロードいただけます。運営ホームページのマーケティング力をさらに高めるチャンスです。まずは無料でDLしてお試しくださいませ。
→ 改良されたプラグインを確認する