しかし、後の時点まで待ってから実験をアクティブ化したい場合も少なくありません。たとえば、動的にロードされたコンテンツをページに表示する場合には、ページのロードが完了した後で実験をアクティブ化することもできます。これは実験のアクティブ化モードを手動または条件によるアクティブ化に設定することで対応可能です。
注:
手動アクティブ化はすべてのプランタイプで使用できます。条件によるアクティブ化はエンタープライズプランをご利用のお客様専用です。条件によって実験をアクティブ化する場合は、エンタープライズプランへのアップグレードを検討するか、または次に示す回避策を利用してください。
手動モードでの実験は、Optimizely JavaScript Activation API によりアクティブ化されます。条件付きモードの実験は、Optimizely が実験をアクティブ化する時点を判断するために評価するコード条件を受け入れます。
手動アクティブ化モードを使用する理由
条件によるアクティブ化モードを使用する理由(エンタープライズプランの機能)
手動/条件によるアクティブ化が必要であるかどうか
手動アクティブ化または条件によるアクティブ化によって問題が解決するかどうかがわからない場合は、次の兆候が該当するかどうかを確認してください。
実験に必要なのが手動のアクティブ化または条件によるアクティブ化なのかを示す極めて一般的な兆候となるのは、要素に変更を加えたときに、変更がエディターには正しく表示されるのに、実験をライブで実行すると、その変更が表示されない場合です。
以下のような状況です。
目次
1.実験のアクティブ化モードを変更する実験のアクティブ化モードを変更するには、エディターで [オプション] > [アクティ ブ化モード] をクリックします。以下の画像のようなダイアログが表示されます。[手動] か [条件付き] を選択してください。
アクティブ化モードを [手動] に変更すると、実験の実行を開始させたいときにページ上で実行する必要があるコードが少し表示されます。
コードのこの行は、Optimizely に実験を手動で実行するよう指示します。
特定のページですべての手動の実験をアクティブ化するには、実験 ID を持つパラメーターを削除し、呼び出しを以下のようにします。
この API 呼び出しは、このページの現在の訪問者によりターゲット条件が満たされている、すべての実行中の手動の実験をアクティブ化します。以下のようにすれば、実行中の特定の手動の実験をアクティブ化できます。
この EXPERIMENT_ID は、この実験の [アクティブ化モード] ダイアログに表示されます。
例:
window.optimizely.push(["activate",12345]);
により実験 12345 がアクティブになりますが、手動でアクティブにされるように設定された他の実験はアクティブになりません。ページに Optimizely スニペットがありアクティブ化 API 呼び出しが実施されると、実験を実行する通常のプロセスが開始します。アクティブ化の呼び出しは必要な回数だけ実施することができるので、AJAX を使ってレンダリングされる複数のページがある場合、新しいコンテンツがロードされるたびに実験を実行することができます。
アクティブ化モードを条件付きに変更するとコード入力ボックスが表示されるので、いつ実験をアクティブ化するかを判断するために評価されるコード条件をここに入力します。
このコードボックスは 2 通りの仕方で機能します。それはボックスに入力したコードのタイプにより決定されます。
関数タイプの使用法:
条件によるアクティブ化の関数タイプを使用する場合、Optimizely は以下のタイプ定義と共に関数が入力されるものと予期し、アクティブ化関数とオプションオブジェクトを引数として渡します。
以下は、AJAX 呼び出しが実施された後に関数タイプを使用して実験をアクティブ化する簡単な例です。デベロッパーサイトには、他の使用例があります。
注:
上記のコードは、Optimizely スニペットに完全な jQuery ライブラリーを含めている場合に動作します(このオプションはプロジェクトの JavaScript の設定にあります)。スニペットに調整済みバージョンの jQuery を含めたいが、ウェブサイトにユーザー独自の jQuery が含まれている場合は、window.$(document).ajaxComplete のように接頭辞 window.を追加して、この機能がウィンドウレベルに及ぶようにしてください。
これは、調整済みバージョンの jQuery(Optimizely スニペットにデフォルトで含まれている)には ajaxComplete メソッドが含まれていないためです。このメソッドは完全なjQuery ライブラリーでのみ動作します。
ポーリングまたは関数のどちらのメソッドを使用する必要がありますか。下記を参照してください。
ポーリングタイプの使用例:
関数タイプの使用例:
注:
複数ページ実験を条件によりアクティブ化する場合、条件によるアクティブ化が確実に各ページで実行されるようにしてください。そうしないと、実験の 1ページでのみアクティブ化されることになります。
手動のアクティブ化を設定したいのに、サイトのコードへのアクセス権を持っていないかもしれません。または、エンタープライズ以外のプランで条件によるアクティブ化を設定したい場合、実験をアクティブ化するには回避策が必要です。
手動のアクティブ化呼び出しをサイト上で直接行えない場合、ページを読み込むときに実行され、アクティブ化呼び出しを望みのイベントに結びつけるブートストラップ式の実験を用意する必要があります。言い換えれば、実験を利用して手動のアクティブ化呼び出しを設定し、次いで 2 つ目の実験を利用してテストしたい変更を加えます。
この「ブートストラップ実験」は、以下のように設定します。
1. 手動でアクティブ化される実験を通常通り作成します。
2. トラフィックの 100% が 1 つのバリエーションに割り当てられた新しい実験を作成します。
3. 新しい実験のURL ターゲット設定と訪問者グループ条件が、必ず元の手動でアクティブ化される実験の条件と一致するようにします。
4. トラフィックの宛先となるバリエーションで、[コードの編集] ボックス を開き、元の実験を ajaxComplete でアクティブ化したいのか、クリックイベントでアクティブ化したいのかに応じて、以下のスニペットコードの 1 つをペーストします。
5. クリックイベントにバインドしたい場合、以下のコードを使用します。
XXXXXXX は手動でアクティブ化される実験(新しいブートストラップ実験ではなく)の実験 ID で置き換え、SELECTOR はバインドしたい実際のセレクターで置きかえます。
6. ajaxComplete にバインドしたい場合、以下のコードを使用します。
こうすることで、AJAX リクエストが完了するたびに実験がアクティブ化されることに注意してください。サイトに多くの AJAX リクエストがある場合、どの AJAXリクエストをリッスンするべきかを特定する引数を渡すとよいかもしれません。
7. 両方の実験を開始します。