ABテスト設置方法

電熱線入りグローブ

寒い朝にバイク出勤。会社に着く頃にはやる気メーターは0%。そんなときは電熱線が入ったホットなグローブがおすすめ。
寒い朝にバイク通勤が楽チンになる

電熱線グローブを見てみる

ABテストサンプルページ

バイク用グローブの記事を書いた想定で「A:電熱線グローブ」と、「B:羽毛グローブ」どちらが反応がいいかテストする。

【ABテストサンプルページ】冬用グローブ最新情報
オーラン 何度かページ更新してみると電熱グローブと羽毛グローブが切り替わるぞ。 ...

ABテストの例

固定ページでAとBそれぞれのパーツを作る。

Aパターン

電熱線入りグローブ

寒い朝にバイク出勤。会社に着く頃にはやる気メーターは0%。そんなときは電熱線が入ったホットなグローブがおすすめ。
寒い朝にバイク通勤が楽チンになる

電熱線グローブを見てみる

 

Bパターン

羽毛グローブ

寒い朝にバイク出勤。会社に着く頃にはやる気メーターは0%。そんなときは羽毛が入ったフワフワなグローブがおすすめ。
ポーランド産羽毛100%使用

羽毛グローブを見てみる

ABページを作る

固定ページを新規で2つ準備する(下書きでOK)

改善したい箇所を2パターン作る。ページ全体でもCTA部分だけでも、ボタン周りだけでもどんなパーツでもOK。

パターンA

See the Pen
ABテストパターンA
by 中古ドメイン騎士オーラン (@domain_orank)
on CodePen.

パターンB

See the Pen
OJJBbxB
by 中古ドメイン騎士オーラン (@domain_orank)
on CodePen.

ABテスト用ショートコード解説

上記Aパターン、BパターンにはそれぞれABテストの表示回数・クリック数を計測するためのショートコードを挿入している。

ショートコード名使用目的
abtestpvページ表示回数を計測する
abtestlinkクリック数を計測する

 

「パターンA」「パターンB」2種類のIDをメモする

固定ページ編集画面でURLのpost=のあとの数字が固定ページのIDになっているぞ。

 

パーツ挿入部分にショートコードを貼り付ける

サンプルページのHTMLコードは次の通り。記事更新してもらうとABが50%の割合で表示されるのがわかるだろう。

 

キャッシュプラグインを使用している場合は、一度表示したページがキャッシュされるため更新しても同じページが表示される。別々の人に異なるページを表示させるのには支障はないだろう。

コメント