無料でA/Bテストできる！WordPress×Optimizelyの使い方

Optimizelyとは

A/Bテストのプラットフォーム。
全世界でトップシェアを誇る。

小規模ならば無料でトライアル出来るので、ぜひ一度利用してみて下さい。

A/Bテストを何故するのか？

OptimizelyはA/Bテストの定番ツールです。
サイトのある部分を変えたら、成果が上がったか、下がったかを判別することが出来ます。

仮に下記のような設定で考えていただければ、A/Bテストの効果がわかっていただけるかと思います。

現在のコンバージョン率は1.0%
年末に広告に100万円投資をし、訪問者を1万人増加させる

投資までにA/Bテストでコンバージョン率を1.5%まで改善したパターンと、そのままのパターンを比べてみましょう。

パターン名	広告費	訪問者数	コンバージョン率	コンバージョン数	獲得単価
オリジナル	1,000,000	10,000	1.0%	100	\10,000
改善パターン	1,000,000	10,000	1.5%	150	\6,667

コンバージョン率をA/Bテストで上げていることで

コンバージョン数が50増加。
獲得単価が30%減少。

という2つの効果が得られます。

また、獲得単価に関してはそのまま粗利に直結しますし、その先もずっと続く改善施策になります。
そう考えれば、A/Bテストをやらない理由は無いでしょう。

OptimizelyでA/Bテストを回す方法

１．アカウントの作成

まずはアカウントを作成しましょう。
https://www.optimizely.com

画面右上「Sign Up」のリンクをクリックして情報を入力しましょう。

続いて、何のプロジェクトなのかを聞かれます。

Optimizelyでテストできるのは

Webサイト
iOSアプリ
Androidアプリ

の３種類です。
今回はWebサイトのテストなので、いちばん左の「Web Project」を選択します。

Web Projectを選択すると、どのURLをテストするのかを聞かれるので、当ブログのドメイン「webmake.info」と入力します。

これでアカウントの作成は完了です。

２．テストパターンの作成

アカウントの作成が完了したら早速A/Bテストのパターンを作成していきましょう。
当ブログ「うぇぶまけ」を参考にして解説していきます。

マウスカーソルを変更したい要素に合わせると、枠線が現れます。
枠線が出ている状態でクリックをすると、どのような変更をするかのメニューが現れます。

今回は、サイト名「うぇぶまけ/webmake」をシンプルに「うぇぶまけ」に変更するテストを作成したいと思います。

今回行ないたいのはテキストの変更なので、変更したいサイト名にマウスを重ね、「クリック→要素の編集→テキストの編集」を選択します。
そうすると、テキストが変更出来るようになるので「/webmake」を消します。

これでテストパターンの完成です。

その後、テストを行ないたい目的に合わせて、目標の設定や訪問者グループの設定を行ない、実験の開始を行ないます。

３．Optimizelyコードの取得

テストケースの作成は無事完了しました。
続いて、サイトでテストが実施されるようにOptimizelyのコードを取得しましょう。

OptimizelyはサイトのJavascriptのコードを埋め込むことで動作します。
ですので、テストの対象となるページすべてにコードを埋め込む必要があります。

また、タグはプロジェクトごとで異なります。

「プロジェクト→設定タブ内→実装」の中にあるコードをコピーします。

４．WordPressのプラグイン「Optimizely」をインストール

WordPressにはOptimizely公式が製作したプラグインが存在します。
そのプラグインを使ってコードの埋め込みなどを実行しましょう。

「プラグイン→新規追加」画面の右上、検索窓で「Optimizely」と入力し、検索実行。
そうすると、恐らく一番左上に公式のプラグインが出てきますので、選択してインストール実行。

これだけでインストールは完了です。

５．WordPressプラグインの設定

さて、Optimizelyプラグインをインストール成功した後は設定です。
正常にインストールが出来て、有効化されれば管理画面メニューの一番下辺りに「Optimizely」というメニューが新たに追加されていると思います。

Optimizelyメニュー→Configurationタブをクリック。

この画面内の「API Token」ボックスに、Optimizelyより取得したAPI Tokenを入力し、接続をすることで、すべてのページにOptimizelyのテストコードがロードされます。

６．API Tokenの取得

Optimizelyのマイページより、「アカウント設定」をクリックします。
その後、「アプリタブ→【Optimizely REST API を使用して認証する API トークンを管理します。】のテキストリンクをクリック」もしくはログインしている状態で「https://app.optimizely.com/tokens」にアクセスすることで、トークンの生成画面に移動出来ます。