> ## Documentation Index
> Fetch the complete documentation index at: https://docs.kameleoon.com/llms.txt
> Use this file to discover all available pages before exploring further.

# ウィジェットをA/Bテストする

> アクティブなウィジェットをグラフィックエディタでバリエーションに追加して、A/B実験に含めます。

グラフィックエディタで実験を作成して、ウィジェットをテストできます。実験にウィジェットを追加する前に、Widget Studioで作成して有効化する必要があります。グラフィックエディタを使用してウィジェットを編集することはできません。ウィジェットの編集はWidget Studioでのみ可能です。

## グラフィックエディタを使用してバリエーションにウィジェットを追加する

グラフィックエディタでバリエーションにウィジェットを追加するには:

1. グラフィックエディタで **Variation** メニューを開きます。
2. **New element** をクリックして **Widgets** を選択します。Widgetsダッシュボードが開きます。
3. 実験に追加したいウィジェットを選択します。右側にカラムが開きます。
4. ウィジェットを表示するデバイスを選択します。
5. ページ上のウィジェットの位置を設定します。
6. ウィジェットのコードの出力（JS with shadow DOM またはJS and CSS）を選択します。
7. **Add** をクリックします。

<Frame>
  ![](https://storage.googleapis.com/kameleoon-storage-documentation/user-manual/images/assets/widgets/use-widgets-in-your-campaigns/ab-test-your-widgets/exp-1-1920x930.png)
</Frame>

A/Bグラフィックエディタの実験にリダイレクトされます。

## バリエーションからウィジェットを削除する

以前にバリエーションに関連付けられたウィジェットを削除したい場合は、CSSコードから削除する必要があります。

手順は以下の通りです。

1. **Variation** メニューを開きます。
2. **CSS** をクリックします。
3. 開いたポップインで、ウィジェットにリンクされたコードを削除します。
4. 変更を保存します。

<Frame>
  ![](https://storage.googleapis.com/kameleoon-storage-documentation/user-manual/images/assets/widgets/use-widgets-in-your-campaigns/ab-test-your-widgets/Capture-decran-2022-05-17-a-16.54.52.png)
</Frame>
