> For the complete documentation index, see [llms.txt](https://docs.vwo.gaprise.jp/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.vwo.gaprise.jp/testing/troubleshooting/x5fobjc354.md).

# トラブルシューティング：バリエーション変更が表示されない

## **問題** <a href="#issue" id="issue"></a>

ライブプレビューを開いて、キャンペーンの本番時にどのように見えるかを確認しましたが、バリエーションには全く変化が表示されません。

## **解決の手順** <a href="#solution" id="solution"></a>

### **（1）スマートコードが設置されていない場合** <a href="#id-1" id="id-1"></a>

スマートコードが設置されていないウェブサイトでは、プレビューの右下にプレビューデバッガーウィンドウが表示されず、元のウェブページのみが表示されます。

![](/files/i7SavqMtbHzaEld8xTT4)

トラッキングコードスニペットを設置するには、「[http://app.vwo.com/#/settings/code](https://app.vwo.com/#/settings/code)」からコピーし、キャンペーンページの < head> セクションに貼り付けてください。 コードスニペットの追加方法については、[こちら](https://help.vwo.com/hc/en-us/articles/360019422834)をクリックしてください。

### **（2）VWOコードが時間切れになった場合** <a href="#id-2" id="id-2"></a>

ネットワークの速度が遅い場合、プレビューモードのウィンドウに 「VWOテスト設定時間切れ」と表示されることがあります。

![](/files/WbOaNs33P6oy4LFkW0VB)

モバイルがウェブサイトの主な受信トラフィック源である場合、次のVWOコードスニペットに示すように、settings\_tolerance変数とlibrary\_tolerance変数のデフォルトタイムアウト値を、それぞれ2000と2500から5000と5000に増やしてください。

時間切れについて詳しくは、「[VWO SmartCodeが時間切れになる理由と解決方法](https://help.vwo.com/hc/en-us/articles/900001789546)」を参照してください。

![](/files/cesDQSNqZweCr7v9dKyq)

### **（3）要素の読み込みタイミングに矛盾がある場合** <a href="#id-3" id="id-3"></a>

変更が加えられた要素と対応するスクリプトが同時に読み込みされないことがあります。従って、この変更は効力を持ちません。

**確認方法**：エディターからコード全体をコピーし、デベロッパーツールのコンソールタブのプレビューで使用してください。変更が適用された場合、JSスクリプトと一緒に要素が読み込まれなかったことになります。

コンソールを開くには、ページを右クリックして、\[**検査**]をクリックし、\[**コンソール**]を選択します。

![](/files/gI5692H3Ka6hFiCo7yMM)

* VWOは、ページ全体の準備が整うのを待たず、追跡コードが読み込まれるとすぐに要素に変更を適用します。AJAXでページ内に後から要素を追加する場合、コードエディターの\[**JavaScriptの追加**]セクションから、\[**要素のためにコードをポールに追加する**]オプションをクリックし、関数を追加してください。\
  ![a4NL8HhjtBWzOkl19KHoIFUUEi9SkCze121CeuvxMXWK0KaE5mDJeK-dyBRfO90pIKzqgxIUN4o6SLDxv7r36o7URW8mLCNizCTSpZeQdjsxvtkpfpgfqsQG4xlNXEP72A9C39hG.png](/files/ix65RBDPzzkThFvCnYbO)
* エディター操作ですべての変更を行った場合、Webページ上の要素の変更が適用されないシナリオに対処するために、「[SPA/SSRのエディター設定](https://help.vwo.com/hc/en-us/articles/900000678806)」を行います。

### **（4）スタイリングの変更がエディターに保存されない場合** <a href="#id-4" id="id-4"></a>

CSSの変更をエディターで保存・適用しない場合、ページの既存のCSSは上書きされません。そのような場合、CSSセクション&#x306E;*!important*プロパティで手動で変更を加えてください。例：

\#id

{

Color:red !important;

}

### **（5）プレビューモードで 「要素が読み込まれていません」 と表示された場合** <a href="#id-5" id="id-5"></a>

変更した要素がページ上に存在しない場合、「要素が読み込まれていません」というメッセージがプレビューモードウィンドウに表示されます。

![](/files/VaeUwLaFEcPJ4mlV3S8C)

また、コンソールで要素のCSSパスを使用することもできます。空白に戻った場合は、その要素が存在しないことを意味します。

![](/files/4pi4iGmA6eE0H42c0Cdc)

バックエンドから要素のCSSパスが変更された場合、または要素に動的なID/クラスが付加されている場合に発生する可能性があります。「[VWOのWebサイトのエディター設定でセレクタパスオプション](https://help.vwo.com/hc/en-us/articles/900000572086)」を設定することをお勧めします。
