LP(ランディングページ)やキラーページのABテスト方法【無料】

wordpressならプラグインを使えば簡単にリンクやランキングのABテストをすることができます。

アフィンガーならタグ管理プラグインとABテストプラグインを使う感じですね。

しかし、LPのファーストビューのABテストをしたい。記事内の文章や画像のABテスト、各見出し＋文章のセットの順番(問題提起→結論より結論→問題提起の方がよいのかなど)でCV率が変わるのかチェックしたい場合、リンクのABテストプラグインだけでは対応しきれません。

この場合LPやキラーページを複数使ってテストする必要があります。もっと言うと

AというURLにアクセスした際、オリジナルのAのページとテスト用のBのページに均等(50%の割合)でアクセス数を分散する

仕組みが必要になります。ページ単位のABテストツール自体はそこそこあるのですが、

ほとんどが企業向けの有料ツールでクッソ高いです。何で高いかと言うとサポート料金やABテスト以外の機能がついてたりするから。

あと海外産で英語も多いです。

高機能なのは間違いないのですが、ぶっちゃけLPやキラーページのABテストさえできればいい、サクッと導入できて(問い合わせとか契約したくない)チェックしたいという人にはあまり向いてないと思います。

もっと言うとAというページにアクセスがあったら当配分でAとBのページにアクセスを分散してほしい

だけなのです。

自分もABテストツールは結構探したのですが、どれも有料だったりwordpressのプラグインで使えそうなやつ見つけても古すぎて今のバージョンでは動作しなかったり。

で結果行き着いたのが

グーグルアナリティクスのウェブテストを使う

というもの。これはサイトにグーグルアナリティクス導入してれば簡単に使えて、無料で使えます。基本はこれでまず事足ります。

グーグルアナリティクスのウェブテスト設定方法

ざっくりこんな手順になります。

要はABテスト用のページ用意してグーグルアナリティクスから解析に必要なコード発行して対象のページに埋め込む、って感じです。

オリジナルと比較テスト用のページを用意

まずはABテストのオリジナルページとテスト用ページを準備します。

オリジナルページがある場合、ページを複製して検証部分だけ修正すると思いますが、「Duplicate Post」プラグインを使うと楽です。これはwordpressの管理画面上で編集の横に複製というボタンができてクリック1つでページ複製できるスグレモノです。

なおプラグインで「Duplicate Post」を検索すると複数個出てくると思いますが「Enrico Battocchi」バージョンをインストールしましょう。

インストール後はオリジナルを複製する必要がありますが、注意としてテスト用ページはオリジナルとほとんど同じなので重複ページになってしまいます。なのでnoindexにしたほうがいいです。

グーグルアナリティクスの広告テストからABテストの設定

Googleアナリティクスの管理画面上から行動-ウェブテストの設定→テスト作成を選択します。なおアナリティクスを導入してない場合、まずはそちらの設定が必要になります。

次は必要項目を入力します。

◆テストの目標を選択

・テストの名前→わかりやすいもの
・テストの目標→好きなもの
・テスト対象のトラフィック割合→オリジナルページの何％をABテストに使うか。50%なら25%がオリジナルページ、25%がテストページ、テストに使わない50%はオリジナルページに飛ぶものと思われる。基本は100%で。
すべてのパターンにトラフィックを均等に分配→超大事。ここがオフだと均等にABテストできません。必ず【オン】にすること。

◆テストを設定
テストページのURLを設定。ページ名はアナリティクス上で解析するときの表示名になるのでわかりやすいもので。

3ページ以上やるならパターンを追加する。

ABテスト用のコードを対象のheader.phpに埋め込み

次はテストコードをオリジナルページのhead開始タグの直後に埋め込みます。

wordpressの場合、header.phpの特定箇所に埋め込む必要があるのですが

ということで親ページのheader.phpを子ページにコピー→それを修正という手順をとります。

FTPソフト(winscpなど)で親テーマのheader.phpを子テーマにコピー

詳細は以下の記事が参考になると思います。

WordPress子テーマに「header.php」を追加する方法 for beginners

なおheader.phpは対象サーバの

/ドメイン名/public_html/wp-content/themes

の中にあります。

wordpressの管理画面から子テーマのheader.phpを修正

wordpressの管理画面から子テーマのheader.phpを開きます(外観-テーマの編集から)。上手くFTPでコピーできてれば小テーマ側で右側のテーマファイルに「テーマヘッダー(header.php)」が表示されているはずです。

header.phpを開いたら＜/head＞の前に以下のコードを埋め込みます。(自分の場合アフィンガーを使ってるので「＜?php get_template_part( 'analyticstracking' ); //アナリティクスコード ?＞」の前に挿入してる)

◆貼り付けるコード

これの

の部分にアナリティクス上に表示されたテストコードをコピペしてください。

php ifというコードがありますが、これはテストコードをオリジナルページにだけ反映させるため、if=記事番号でオリジナルページを指定しています。記事番号はwordpressの記事一覧画面で編集にカーソルを当てると左下に表示されます。

なお上記＜?php if ( is_page( '記事ID' )): ?＞の箇所は個別記事の場合で

固定記事の場合

トップページの場合(固定ページをトップにしてる場合もコレ)

にそれぞれ置き換えてください。出来上がりイメージはこんな感じです。できたらファイルを更新をクリック。

↑固定ページをトップページにしてるのでこのコードになってる

ABテストのテスト

終わったらアナリティクスの画面からテストコードの検証をクリックして、問題なければテストコードが「見つかりました」と出るはずです。

あとは保存してから実行しましょう。実際にオリジナルページにアクセスするとオリジナルページとテストページに遷移するのが分かると思います。(ブラウザ変えてチェックする必要あり)

グーグルアナリティクスのウェブテストの確認、解析

アナリティクスの行動-ウェブテストから確認すると以下のように表示されます。

きちんと設定ができてればセッション数はページ毎でほぼ同数になっているはずです。

あとはCV数のABテストならASPの成果リストからリファラを見て、リンクのクリック数をチェックするなら確認用のタグをオリジナルページとテストページにそれぞれ入れてあげてください。(自分はアフィンガーのタグ管理プラグインでクリック数見てます)

グーグルアナリティクスのウェブテスト使用時の副産物

グーグルアナリティクスのウェブテストを実行するとABテストページのURLにパラメータが付いてきます。

例えば

集客用ページ→テストページ

と内部リンクを貼ってる時に集客用ページのリンクを踏むとテストページのURLは

テストページURL/utm_referrer="集客用ページ"

と表示されます。どこにも説明無いけど何故か勝手に元ページのリファラがついてきます。

これ以外に使えて例えば

集客用ページ→LP(ランディングページ)やキラーページ

とするとASPの管理画面から見れる成果のリファラは「LP(ランディングページ)やキラーページのURL」だけです。

複数集客用ページあるとどのページ見て来た人がCVしてるのかわからない。ただウェブテストをしてる時はキラーページの参照元が分かります。

思わぬ副産物です。