対象
この記事は、optimize.js(同期)を使用してオプティマイズをインストールするお客様を対象としています。
下記の手順に沿って、ウェブサイトにオプティマイズをインストールします。
要件
スニペットをウェブサイトにインストールするには、以下が必要です。
- Google アナリティクスのアカウントとプロパティ
- ウェブサイトに Google アナリティクス プロパティがインストールされていること
- Google アナリティクス プロパティとリンクされている Google オプティマイズのアカウントとコンテナ
- ウェブサイトのソースコードを編集する権限
手順について詳しくは、オプティマイズを設定するをご確認ください。
optimize.js(同期)を使用したオプティマイズのインストール
オプティマイズの同期バージョンは、パフォーマンスが最も良く、ウェブサイトのレンダリング速度への影響を最小限に抑えるため、ほとんどのユーザーに推奨されています。
下記のオプティマイズ スニペットを、ウェブページ内の <HEAD>
の先頭に配置します。
OPT_CONTAINER_ID
は、オプティマイズ コンテナ ID に置き換えてください。同期スニペットを使用すると、ほとんどの場合アンチフリッカー スニペットは必要ありません。
スニペットの配置に関するおすすめの方法
最適な掲載結果を得るには、最適化したいすべてのページの <HEAD>
タグの先頭にオプティマイズ スニペットを配置します。
オプティマイズ スニペットの上には、以下の項目のみを配置してください。
- dataLayer 初期化コード。注: dataLayer 変数は、アンチフリッカー スニペット(使用する場合)の後に再割り当てしないでください。
- オプティマイズに使用する、JavaScript 変数、関数、または設定された Cookie を宣言するスクリプト。たとえば、実装またはターゲティングに使用する jQuery や JavaScript ライブラリなどです。注: jQuery は、デフォルトではオプティマイズにインストールされません。
- ページ フリッカーの軽減に使用できるオプションのアンチフリッカー スニペット。
コンテンツ セキュリティ ポリシーを使用している場合は、オプティマイズのセキュリティ要件を参照し、サイトのスニペットのドメイン(google-analytics.com や googleoptimize.com など)がコンテンツ セキュリティ ポリシーで許可されていることを確認してください。
オプティマイズの実装状態を確認する
ページ フリッカーを軽減する
ページ フリッカーは JavaScript フリッカー、DOM フリッカー、FOUC(Flash Of Unstyled Content)、FOUT(Flash of Unstyled Text)とも呼ばれます。この現象は、すべての情報が取得される前に、ブラウザ エンジンによってウェブページが表示される際に(つまり、新しいスタイルルールが読み込まれて適用された後で再度読み込みが行われる前に、ページがブラウザのデフォルト スタイルで一瞬表示されることで)発生します。
ウェブサイトでフリッカーが確認される場合は、オプティマイズ スニペットを HTML の <HEAD>
の先頭に移動してください。それでもフリッカーが確認される場合は、アンチフリッカー スニペットをインストールし、ニーズに合わせてカスタマイズしてください。
従来版のオプティマイズ スニペットを削除する
従来版のオプティマイズ スニペットがウェブサイトに設定されている場合は、そのスニペットを削除してからサイトのタグを設定し直す必要があります。
オプティマイズ スニペットを削除する方法
オプティマイズの削除は、a)ウェブサイトでのオプティマイズのインストール方法と、b)Google アナリティクスの実装方法によって異なります。ご利用の実装方法に基づいて、下記の手順に沿ってオプティマイズ スニペットを削除します。
オプティマイズの インストール方法 |
Google アナリティクスの 測定方法 |
手順 |
---|---|---|
GTM | – | タグ マネージャーでオプティマイズのタグを削除します。詳細 |
analytics.js | GTM | analytics.js スニペットをページから削除します。 |
gtag.js | GTM | gtag.js スニペットをページから削除します。詳細 |
gtag.js | gtag.js | 「optimize_id 」設定パラメータを gtag.js スニペットから削除します(下記の例 A を参照)。 |
analytics.js | analytics.js | 「ga(‘require’, ‘OPT_CONTAINER_ID’) 」行を削除します(下記の例 B を参照)。 |
例 A
オプティマイズが gtag.js 経由でインストールされており、かつ Google アナリティクス測定が gtag.js によって実行される場合、「optimize_id
」設定パラメータを gtag.js スニペットから削除します。
変更前:
gtag('config', 'GA_MEASUREMENT_ID'
, { 'optimize_id': 'OPT_CONTAINER_ID'}
);
変更後:
gtag('config', 'GA_MEASUREMENT_ID');
例 B
オプティマイズが analytics.js 経由でインストールされており、かつそのページが analytics.js によって(のみ)トラッキングされている場合は、analytics.js スニペットから「ga('require
」の行を削除します。
変更前:
ga('create', 'GA_MEASUREMENT_ID', 'auto');
ga('require', 'OPT_CONTAINER_ID');
ga('send', 'pageview');
変更後:
ga('create', 'GA_MEASUREMENT_ID', 'auto');
ga('send', 'pageview');
アンチフリッカー スニペットをインストールしている場合は、同時に削除します。