3-2.クリエイティブ登録
メニュー内のクリエイティブ管理にある、「クリエイティブ登録」を押下し、カスタムHTMLを選択します。
3-2.表示設定
バナーの表示をiframeで表示を行う設定です。HTMLや、変数、JavaScriptが使用できるので、動的なバナーの表示が可能になります。
①HTML入力フィールド【必須】
・表示するクリエイティブをHTMLで記述することができます。プレビューでリアルタイムに変更を確認できます。
②CSS入力フィールド【必須】
・表示するクリエイティブをCSSで記述することができます。
ここで記述したCSSは、①のHTMLに適応されます。
プレビューでリアルタイムに変更を確認できます。
③拡張機能についての説明
・オプションについての説明がございます。合わせてご確認ください。
④変数の作成
・カスタムHTML内でのみ動作する変数を定義します。
電話番号や店舗名など、ページ毎にバナーのクリエイティブを動的に変更したい場合に使用します。変数として使用したい文字列が含まれるclassもしくはidを指定します。
変数は最大で3つ指定することができ、{v1}～{v3}の形式で参照することができます。
⑤プレビューの背景
・バナー掲載予定のウェブサイトのスクリーンショットを設定すると、プレビューエリアの背景に設定されるので、サイトでの表示イメージをつかみやすくなります。
⑥適用ボタン
・変数の作成や、プレビュー用背景を適用するボタン。
■ポップアップをクリックした時に別タブでリンクが開く設定
カスタムHTMLでの設定となります。
①レフトナビ内の「各種登録処理」→「画像倉庫」に表示させたいバナーの画像をアップロードし、画像URLを取得
②新規クリエイティブ作成の場合：
「クリエイティブ登録」→「カスタムHTML」→「表示設定」→「HTMLラベルを追加」
既存クリエイティブの場合：
「クリエイティブ登録」→「表示設定」→「HTMLラベルを追加」
③HTML欄・CSS欄にデフォルトで設定してあるコードを下記のように書き換える
【HTML】
<div class=”sample-wrap”>
<a href=”遷移先URL” target=”_blank” rel=”noopener noreferrer”>
<img src=”画像URL”>
</a>
</div>
【CSS】
img{
width: 100%;
}
⑤その他は通常通り設定
■注意！
・aタグを使用しない場合
⇒aタグを使用していない場合はクリックがカウントされません（クリックがカウントできなければCVも計測されません）inputタグなどへ「onclick=”clickCount(‘任意の文字列’);”」を追加いただく必要がございます。
※「任意の文字列」の箇所は特に指定はございません。レポートをエクスポートにてダウンロードした際、カスタムクリックの箇所へ記載した文字列が反映されます。
（例えばポップアップの中に複数のリンクを設定した場合に、何がクリックされたかを確認するために利用します。）