Webテンプレート設定

WebTemplate01_v5.16.4.png

「アクション・効果測定」>「Web設定」>「Webテンプレート設定」

Webテンプレート設定 とは

自動レコメンド、ルール用リストレコメンドで表示する
HTMLコンテンツのWebテンプレートを登録します。

Rtoaster action+にインポートしたアイテムマスタから、Webテンプレートで設定したフィールドに、
アイテム画像や価格などの情報が代入されます。

Webテンプレート選択

  • 通常
    バナーなどのWebテンプレートを登録する場合に選択します。
  • ポップアップ
    ポップアップテンプレートを登録する場合に選択します。

Webテンプレート編集

WebTemplate02.png

項目名 詳細
テンプレート名 任意のテンプレート名を入力してください。
備考 Webテンプレート内容の説明などを記入します。
テンプレート レコメンドする商品を表示する際のWebテンプレートをHTML形式で設定します。
記述例はこちらをご参照ください。
プレビュー 詳細はこちらをご参照ください。

《アイテムフィールド名について》

プレビュー

WebTemplatePreview01.png

検索ボックスに登録済みのアイテムコードを入力し「検索」をクリックすると、
設定したテンプレートのプレビュー結果が表示されます。

Webテンプレートの書式

通常のフィールド名を記載する以外にもアイテムマスタのフィールド値の置換や、
値の加工を行うことができます。詳細はこちらをご参照ください。

ポップアップテンプレート選択

バージョン5.12以前に登録済みのポップアップテンプレートでは「設定の反映」が発生する場合があります。詳細はこちらをご参照ください。

PopupTemplate01.png

任意の項目ボタンをクリックして、対象のテンプレートを絞り込むことができます。

  • 以下の項目はどちらかのみ選択できます。
    • PC向け/SP向け
    • 画像を表示/テキストのみ
  • 以下の項目は複数選択が可能です。複数選択した場合にはAND条件で検索結果が表示されます。
    同じ項目をもう一度クリックすると選択が解除されます。
    • アイテム名
    • アイテム本文
    • 価格
  • 条件クリア
    選択中の項目をクリアします。

ポップアップテンプレート編集

項目名/アイコン 詳細
ポップアップテンプレート名 任意のポップアップテンプレート名を入力してください。
選択したテンプレート ポップアップテンプレート選択画面で選択したテンプレートイメージが表示されます。
テンプレートを変更する場合は「テンプレートを選択」をクリックしてください。
備考 テンプレートの説明などを記入します。1000文字以内で入力してください。
内容設定 テンプレート内で表示する内容を設定します。
詳細はこちらをご参照ください。
全体の見た目 「全体の見た目」を展開すると、ポップアップコンテンツ全体のスタイルを設定できます。
詳細はこちらをご参照ください。
折りたたみ表示・閉じるボタン 「折りたたみ表示を有効にする」にチェックを入れると、ポップアップを折りたたみ、クリックで展開するように設定できます。
詳細はこちらをご参照ください。
出し方 「出し方」を展開すると、ポップアップコンテンツの表示方法を設定できます。
詳細はこちらをご参照ください。
表示回数  ユーザーセッション毎の表示回数を設定できます。
詳細はこちらをご参照ください。
icon03.png 入力項目に不足等がある場合に各設定タブに表示されます。

内容設定

PopupTemplate02.png

表示される設定項目は選択したテンプレートによって異なります。

項目名 詳細
表示アイテム数とレイアウト 表示するアイテム数とレイアウトを選択できます。
ランキングアイコン アイテムの左上にランキングアイコンを表示することができます。
共通見出し 見出し部分に表示する画像またはテキストを設定します。
共通文章 見出しの下に表示するテキストを設定します。
リンクURL コンテンツをクリックした際のリンク先URLとなるフィールド名を入力します。
「リンク先を別タブで開く」を有効にすると、リンク先が別タブで開きます。
アイテム画像URL 各アイテムに表示する画像URLとなるフィールド名を入力します。
アイテム名 アイテム名となるフィールド名を入力します。
アイテム本文 コンテンツに相当する本文などのフィールド名を入力します。
価格 価格表示する際に該当のフィールド名を入力します。
ボタン テンプレート内にボタンを設置することができます。
  • ボタンなし
    デフォルトではボタンなしの状態です。
  • ボタンあり
    アイテムごとにボタンを設定できます。
  • 共通ボタンあり
    アイテムに共通するボタンを1つ設定できます。
    共通ボタンにはリンク先として特定のページを設定することができます。

《アイテムフィールド名について》

全体の見た目

PopupTemplate03.png

項目名 詳細
横幅

「横幅を中のコンテンツに合わせる」の有効/無効によって動作が異なります。

  • 有効
    ポップアップの横幅を自動で調整します。
    ※デフォルトでは有効となっています。
  • 無効
    横幅の値を直接指定します。
高さ

「高さを中のコンテンツに合わせる」の有効/無効によって動作が異なります。

  • 有効
    ポップアップの高さを自動で調整します。
    ※デフォルトで有効となっています。
  • 無効
    高さの値を直接指定します。
背景 ポップアップの背景色を指定します。
「背景を透明にする」を有効にすると、ポップアップの背景を透明にします。
ポップアップの背景を透明とした場合は、背景色の指定は出来ません。
枠線 ポップアップの枠線の太さとスタイルを指定します。
内側の余白 ポップアップ内側の余白を指定します。
「上下左右を個別に指定する」を有効にすると、上下左右の余白指定をそれぞれ指定できます。
角丸の半径 ポップアップの丸みを指定します。
「影をつける」を有効にすると、ポップアップに影を付けることができます。

折りたたみ表示・閉じるボタン

PopupTemplate04_v5.13.png

項目名 詳細
折りたたみ表示

「折りたたみ表示を有効にする」にチェックを入れると、ポップアップを折りたたみ、クリックで展開するように設定できます。
折りたたみ表示を有効にした場合の設定項目は以下のとおりです。

  • 初期表示
    • 折りたたんで表示
    • 開いて表示
  • 折りたたみ表示時のデザイン
    • テキスト
    • 画像
  • 折りたたみ表示時のテキスト
  • 折りたたみ表示時の影
    「影をつける」を有効にすると、折りたたみ表示時のコンテンツに影をつけることができます
  • 開いたときの右上のボタン
    • 閉じるボタンと最小化ボタン
    • 閉じるボタンのみ
閉じる/最小化ボタン

「ボタンの画像を変更する」にチェックを入れると、閉じるボタン、最小化ボタンのサイズ変更と画像を設定できます。
ボタンの画像の変更を有効にした場合の設定項目は以下のとおりです。

  • 閉じるボタンの画像URL
    閉じるボタンとして使用する任意の画像URLを入力します。
    画像アップロードから画像を新規でアップロードするか、既にアップロード済みの画像を選択することも可能です。
  • 最小化ボタンの画像URL
    最小化ボタンとして使用する任意の画像URLを入力します。
    画像アップロードから画像を新規でアップロードするか、既にアップロード済みの画像を選択することも可能です。
  • 閉じる/最小化ボタンのサイズ
    ボタンサイズを18px(デフォルト) ~ 54pxで設定します。

《折りたたみ表示のプレビューについて》

  • 折りたたみは画面右側に表示されるプレビューでは確認できません。
    動作確認を行う場合には preview_tab.jpg アイコンをクリックして別タブでプレビューを行ってください。

出し方

PopupTemplate05.png

項目名 詳細
表示位置 ポップアップを表示する位置を指定します。
アニメーション

ポップアップを表示する位置を指定します。

  • フェードイン
  • スライドイン
    表示位置が「中央」の場合、スライドインは指定できません。
表示トリガー
ポップアップ表示のトリガーを設定できます。
  • 表示までの時間
    ページ表示からポップアップされるまでの遅延時間(単位:秒)を指定します。
    遅延時間は1800まで設定可能です。
  • スクロール
    ページ表示からポップアップされるまでのスクロール量(単位:%)と遅延時間(単位:秒)を指定します。
    指定したスクロール量に達成するとポップアップが表示されます。
    スクロール量は99まで設定可能です。
    遅延時間は1800まで設定可能です。
  • セレクタ
    ポップアップのトリガーとなるCSSセレクタと、セレクタが画面に入ってからポップアップされるまでの遅延時間(単位:秒)を指定します。
    指定したセレクタがブラウザの表示範囲内に入るとポップアップが表示されます。
    指定方法はdocument.queryselectorに準じます。
    セレクタは50文字まで設定可能です。
    遅延時間は1800まで設定可能です。
    ページ内に同じセレクタが存在した場合は、最初に見つかったセレクタが対象になります。
非表示トリガー
ポップアップ非表示のトリガーを設定できます。
  • 非表示までの時間
    ポップアップ表示からポップアップを閉じるまでの遅延時間(単位:秒)を指定します。
    遅延時間は1800まで設定可能です。
  • スクロール
    ページトップからポップアップを閉じるまでのスクロール量(単位:%)と遅延時間(単位:秒)を指定します。指定したスクロール量に達成するとポップアップが閉じます。
    スクロール量は99まで設定可能です。
    遅延時間は1800まで設定可能です。
  • セレクタ
    ポップアップのトリガーとなるCSSセレクタと、セレクタが画面に入ってからポップアップが閉じるまでの遅延時間(単位:秒)を指定します。指定したセレクタがブラウザの表示範囲内に入るとポップアップが閉じます。
    指定方法はdocument.queryselectorに準じます。セレクタは50文字まで設定可能です。
    遅延時間は1800まで設定可能です。
背景オプション 「背景をグレーアウトし、背景クリックでポップアップを閉じる」を有効にすると、ポップアップを表示する際に背景をグレーアウトします。
背景をクリックすることで、ポップアップを閉じることができます。

表示回数

PopupTemplate06.png

  • ユーザーセッション毎の表示回数
    ユーザーの1セッション内に、本項を設定したテンプレートでレコメンドされるコンテンツの表示回数です。
    2つのレコメンド場所で、同じテンプレートを使用していた場合は両方のレコメンド場所で表示された回数になります。

プレビューについて

WebTemplatePreview02.png

項目名/アイコン 詳細
検索 検索ボックスに登録済みのアイテムコードを入力し「検索」をクリックすると、設定したテンプレートのプレビュー結果が表示されます。
r073_icon-monitor.png PC PCで見た際のイメージでポップアップを表示します。
r059_icon-smartphone_-____.png スマートフォン スマートフォンで見た際のイメージでポップアップを表示します。
preview_tab.jpg 別タブで開く アイコンをクリックすると別タブでプレビュー画面が開かれます。
表示位置や動作を含む確認を行う場合にご利用ください。

■プレビュー画面(別タブ)

WebTemplatePreview03.png

項目名/アイコン 詳細
検索 検索ボックスに登録済みのアイテムコードを入力し「検索」をクリックすると、設定したテンプレートのプレビュー結果が表示されます。
r073_icon-monitor.png PC PCで見た際のイメージでポップアップを表示します。
r059_icon-smartphone_-____.png スマートフォン スマートフォンで見た際のイメージでポップアップを表示します。
r054_icon-refresh.png リロード ポップアッププレビューをもう一度表示します。

《プレビューについて》

ご利用環境の違いにより、管理画面のプレビューと実際にデバイスで表示されるレコメンドで見え方が異なる場合があります。

Webテンプレート設定画面について

WebTemplate08_v5.16.5.png

アイコン 詳細
r022_icon-export.png エクスポート 設定されている全てのWebコンテンツグループの情報をCSVファイルでエクスポートします。 エクスポートしたCSVをExcelで編集する際はこちらをご参照ください。
r029_icon-import.png インポート CSVファイルをインポートする場合に使用します。
「差分更新」または「置換更新」を選択できます。
CSVの詳細はこちらをご参照ください。
r048_icon-pencil.png 編集 選択しているWebテンプレートの編集を行うことができます。
r064_icon-undo.png 取り消し 選択しているWebテンプレートの編集内容を取り消すことができます。
設定を反映した後は取り消せませんのでご注意ください。
r063_icon-trashCan.png 削除 ステータスが「使用中」のものは削除できません。

《タイプ/Webテンプレートのステータスについて》

 ステータスには以下の項目が存在します。

   更新中
   削除中
   作成中
   使用中

  • 他のオペレーターが更新中/削除中/作成中のものは操作できません。
  • ステータスが表示されているWebテンプレートは設定の反映でデータを確定する必要があります。
  • 管理者の場合はステータスが更新中/削除中の取消のみ可能です。
  • ステータスが使用中の場合、選択したWebテンプレートがWebレコメンド設定で使用中のため、削除できません。
  • Webコンテンツグループを削除するには、Webレコメンド設定で該当のWebテンプレートの登録を解除してください。

バージョンアップによる登録済みポップアップテンプレートへの影響

Ver. 5.15 Ver. 5.16

以下の操作を行った場合、バージョンアップ以前に登録済みのポップアップテンプレートが「設定の反映」の候補として表示されます。

【1:管理画面上での操作】

  1. Webテンプレート設定でタイプ「ポップアップ」で登録済みのWebテンプレートの「編集」をクリック
  2. ポップアップテンプレート編集画面で「OK」をクリック
  • 上記操作を行った場合、テンプレートを編集していなかった場合でもステータスが「更新中」と表示され、「設定の反映」の候補として表示されます。
  • 上記に該当する操作を行った場合は、「設定の反映」を行ってください。

【2:設定ファイル(CSV)インポート】

  • Webテンプレート設定の設定ファイル(CSV)をインポートした場合、CSVインポート画面でWebテンプレートのタイプ「ポップアップ」の設定に「更新」のステータスが表示されます。
    また、対象のポップアップテンプレートの設定が「設定の反映」の候補として表示されます。
  • 上記に該当する操作を行った場合は、Webテンプレート設定のCSVインポート画面で「OK」をクリック後、「設定の反映」を行ってください。
  • 上記のとおりに一度「設定の反映」を行うと、以降は上記に該当する操作をしても「設定の反映」の候補としては表示されなくなります。
  • 「設定の反映」前後でWebページ上のレコメンド表示が変更されることはございません。
  • 該当の操作によって発生した「設定の反映」をしなかった場合でも、実際のレコメンド表示に変更はございません。