キャンペーンの表示レイアウト
キャンペーンセット内の各キャンペーンの表示レイアウトの管理を行うには、キャンペーンリストの画面の右上の プレゼンテーション ボタンをクリックします:
プレゼンテーション
プレゼンテーション ボタンをクリックして表示される画面では、モジュール内に作られた全てのキャンペーンのプレビュー、およびレンダリングテンプレート、スタイルシート、カスタムスクリプトの編集を行うことができます。モジュール内のキャンペーン一覧が画面左側に表示されますので、それぞれのキャンペーンをクリックしてプレビューし、見た目の調整を行ってください。
編集画面
プレビュー画面の下にあるボタンをクリックして、表示レイアウトを定義する各要素(HTMLテンプレート、CSS、カスタムJS)を確認・編集してください:
また、ヒントでは表示レイアウトを作成するにあたって参考となるいくつかのサンプルを提供しています。必要に応じてコピー&ペーストしてお使いください。
ライブプレビューの利用
ライブプレビューではライブ環境でモジュールを確認することができます。
実際の見た目を確認するために、公開する前に実際の環境でテストを行うことは重要です。
ライブプレビューを使用するために、モジュールをデプロイする必要はありません。
"ライブプレビュー" を選択するとURLが表示されます。モジュールを表示したいURLを入力して、"開く" を選択します。
モジュールのデフォルトのテストURLとしてベースURLを指定することもできます。"プレゼンテーション" ボタンの隣にある "設定" を選択して、ライブプレビューのデフォルトURLを追加します。
モジュールを配置するための専用の <div> 要素がある場合、2つめのフィールドにID(のみ)を追加してください(例えば、要素の場合で <div id="lollipop"></div> なら IDの lollipop を入力します。それ以外の場合、このフィールドを空欄のままにしても、URLページの body 上部に要素が追加されるだけです。