E Example.com
← Gallery に戻る

Show Form action(Composer x id)

Cxense is proud to welcome publishers and media companies in Japan, to a seminar at the Royal Norwegian Embassy in Tokyo on May 28th.

As the first Cxense Japan event in 2013 was a great success and attended by over 80 publishers and media contacts, we have decided to host another event this year.

The seminar will provide Cxense customers and contacts in the Japanese publishing world with valuable industry updates, and serve as a networking forum for media companies.

The seminar will feature two Cxense case studies with esteemed guest speakers from DMM.com Lab and MediaGene, as well as an industry update from Cxense's founder Dr. John M. Lervik, and an update and demo of the newly launched Cxense DMP solution by its Product Manager, Mr. Jan Helge Sageflaat coming in from Oslo, Norway, for the event.

As the first Cxense Japan event in 2013 was a great success and attended by over 80 publishers and media contacts, we have decided to host another event this year.

The seminar will provide Cxense customers and contacts in the Japanese publishing world with valuable industry updates, and serve as a networking forum for media companies.

Overview - Show Form action

  1. Show Formアクションはログイン中ユーザの属性を取得する目的でご利用いただけます。
  2. 未ログイン中ユーザにはログインモーダルが表示されるため、ターゲットオーディエンスで除外することを推奨します。
  3. UXの観点から、何度も表示するのではなく、ページビューメータ等を併せてご利用ください。

Procedure - Custom Fields

  1. Piano Composerにログインする
  2. [管理]=>[カスタムフィールド]メニューから「フィールドを追加」をクリックします。
  3. フィールドの入力要件を満たせる型を選択し、その他必要な項目を埋めます。ここで設定する「フィールドID」がカスタムフィールドのキーになります。
  4. 表示する項目を「フォーム」単位でグループ化できますので、必要に応じて画面右にある「フォームを追加」をクリックし追加します。
  5. 新規追加したフィールドを表示したい「フォーム」にドラッグ&ドロップします。
  6. Experience編集画面で、「フォームを表示」カードをアクションの位置にドラッグ&ドロップします。
  7. 表示するフォーム、表示方法を指定し、セーブ&Experienceをライブ化します。

Procedure - Experience

  1. Piano Composerにログインする
  2. 新規サイトエクスペリエンス、もしくは既存のエクスペリエンスの編集画面に入る
  3. 任意の対象ページ、ターゲットオーディエンス、イベント／トリガーを定義する
  4. アクションの「フォームを表示」をドラッグし、キャンバス上のアクションの位置にドロップする
  5. 表示するフォームと表示方法を指定し、Experienceのセーブとライブ化をする

Appendix

Q:「フォームを表示」カードに表示される会社・サイトロゴを消したい

A:Piano ID Layout テンプレートを編集することで消すことが可能です

  1. Piano Composerにログインする
  2. [管理]=>[テンプレート]メニューからPiano IDテンプレートに分類されている、「Piano ID layout」を選択する
  3. 「コードを編集」ボタンを押し、HTMLを開く
  4. <img class="logo" appLogo>を囲っているdivタグにhideIfFormModeを追加する

Q:条件付きの設問を用意したい

A:別のカスタムフィールドの入力状況等を条件にすることが可能です

  1. Piano Composerにログインする
  2. [管理]=>[カスタムフィールド]メニューを開きます
  3. 条件付きにしたい設問(カスタムフィールド)が設置されているフォーム単位での設定が可能です
  4. 該当フォームにあるカスタムフィールドの右側に表示されている歯車マークを押下します
  5. 「条件」タブで表示されている「+ Add condition 」を押下して「表示」を選択すると表示条件設定の項目が追加されます
  6. 表示条件とする対象カスタムフィールドの項目、比較条件、値を選択し「保存」を押下することでユーザが指定の条件のカスタムフィールドを持っている場合にのみ表示されます

Q:インラインで表示したいが表示対象となるセレクタの設置が難しい

A:RunJS/JSを実行カードを使ってJavaScriptによる差込が可能です

  1. 以下のJavaScriptサンプルのパラメータを適宜変更し、「JSを実行」カードとして追加します
  2. JS実行カードを作成したら、「フォームを表示」カードを追加する(参照:Procedure - Experience)
  3. 「フォームを表示」カードを編集中に、インラインコンテナという項目があるため、1で追加したJS内の例の通りであれば"#piano-show-form"と入力する
※Composer側に冗長な設定(カード)を増やさないためにも施策表示位置用のタグは貴社側で設置いただくことを推奨しております