✴️

エディターの基本

ここでは、エディター内でよく操作するツールとその役割についてご紹介します!

1. 画面の構成

1-1. ツリーパネル

画面の下部に表示されるパネルです。 ツリーやゴール、ポップアップの遷移を図式的に表現しています。 新しいステップの追加、遷移順の変更、施策を表示する条件の設定などのある施策全体に対しての編集・設定を行います。

image

1-2. ツリーパネルで選択中のステップ

ツリーパネルの後ろに表示されるステップは、ツリーパネルで選択したステップと対応しています。実際の画面上にステップを表示しつつ、中のテキストや画像を編集することができます。

image

1-3. インラインエディター

ステップの中の要素(ステップ、テキスト、画像)を選択すると、選択した要素の上に表示されます。インラインエディターでは、それぞれの選択した要素に細かく編集・設定を行うことができます。

image

2. ステップ内の要素

image

ステップは画像の 1 のステップキャンバスと 2 のブロックで構成されています。 詳細を以下で解説します。

2-1. ステップキャンバス

ステップでは、選択中のステップの表示の仕方や操作を制御できます。 1 のステップが 2 を内包しているようなイメージです。 編集をする際は、以下の画像の斜線部をクリックすると選択できます。

image

2-2. ブロック

ブロックはステップの内部を構成しています。 ブロックには複数の種類があり、それらを組み合わせることで自由にステップのデザインを作ることができます。 それぞれのブロックの使い方については、以下のページをご確認ください。

テキストブロック

image

画像ブロック

image

HTMLブロック

image