Widget Studioの構造

Kameleoon Widget Studioは、ヘッダー、5つのタブを持つサイドバー、およびウィジェットのカスタマイズをプレビューできる中央エリアで構成されています。

​

画面ドロップダウン

​

画面を追加する

必要な数だけ画面を追加できます。 たとえば:

• Screen 1: ニュースレターポップイン
• Screen 2: お礼ポップイン

​

デフォルトで画面を設定する

複数の画面を作成した場合、最初に作成された画面（ドロップダウンリストの上部）が自動的に デフォルト画面 として指定されます。デフォルト画面は、訪問者がウィジェットに最初にさらされたときに表示される画面です。 三点リーダーメニューをクリックして Define as default screen にチェックを入れると、デフォルト画面を変更できます。

​

画面を削除する

画面を削除するには、三点リーダーメニュー > Delete a screen をクリックします。

​

画面を複製する

画面を複製するには、複製アイコンをクリックします。 デザイン、アニメーション、関連付けられたイベントも複製されます。

​

ズーム

ウィジェットコンテンツをズームインまたはズームアウトします。

​

デバイス選択

ウィジェットを表示するデバイスを選択します。

​

取り消し/やり直し

ウィジェットで実行した最後のアクションを取り消し（左矢印）またはやり直し（右矢印）します。

​

シミュレート

実際の条件でウィジェットをシミュレートします（イベントが追加されている場合に便利です）。

​

保存

ウィジェットを有効化せずに保存します。ウィジェットは Widgets ダッシュボードに Disabled ステータスで表示され、キャンペーンで使用できません。

​

有効化

ウィジェットを有効化してキャンペーンで使用します。ウィジェットは Widgets ダッシュボードに Activated ステータスで表示されます。

​

サイドバー

左バーには5つの異なるセクションがあります。

• Add element
• Content（デフォルトで表示）
• Translations
• Animations
• Events and actions
• Custom code

​

Add element

ここでは、ウィジェットに要素を追加できます。 ウィジェットに要素を追加する方法については、こちらの記事をご覧ください。

​

Content

ここでは、ウィジェットのコンテンツを編集できます。 ウィジェットのコンテンツを編集する方法については、こちらの記事をご覧ください。

​

Translations

ここでは、ウィジェットを複数の言語で設定できます。

​

Animations

ここでは、ウィジェットに入場アニメーションや退場アニメーションを追加できます。 ウィジェットにアニメーションを追加する方法については、こちらの記事をご覧ください。

​

Events and actions

ここでは、ウィジェットにイベントとアクションを関連付けることができます。 ウィジェットにイベントとアクションを関連付ける方法については、こちらの記事をご覧ください。

​

Custom code

ここでは、Widget StudioでカスタムCSSまたはJSコードを作成し、任意のウィジェット要素にカスタムスタイルを適用し、カスタムスクリプトをオンデマンドで実行できます。