メインコンテンツまでスキップ

Pop Up 03

活用例​

image_1

Pop Up 03テンプレートの活用例です。
画像のご用意と設定項目の変更だけで再現できます。

設定方法​

  1. 事前にPop Up 03テンプレートのセットアップを行ってください。

  2. 使用する画像を用意します。
    *用意する画像はポップアップの内側の余白、コンテンツ要素間の余白を考慮してトリミングしてください。今回の設定では、下記の画像の点滅でトリミングします。
    image_1

  3. セットアップ方法の手順に従いキャンペーン作成画面を開き、画面左の設定項目を変更します。 image_1

  4. 設定項目を変更します。（テンプレートからの変更箇所のみ記載）

    外観/挙動​

    • ポップアップの幅: 347px
    • ポップアップの角丸: 0px
    • ポップアップの背景色: #FFB200
    • ポップアップの影: 影なし
    • ポップアップ内側の余白 0px
    • コンテンツ要素間の余白: 3px

    コンテンツ：テキスト​

    • 見出しのテキスト: 空白
    • 本文のテキスト: 空白

    コンテンツ：画像1​

    • 画像1URL: 画像のURLを記入してください

    コンテンツ：ボタン1​

    • リンク先URL: 遷移先のURLを記入してください
    • ボタンのテキスト: 『新規会員登録』と記入してください
    • ボタンのフォントサイズ: 17px
    • ボタンの角丸: 15px
    • ボタンの背景色: #F19401

    コンテンツ：ボタン2​

    • リンク先URL: 遷移先のURLを記入してください
    • ボタンのテキスト: 『ログイン』と記入してください
    • ボタンのフォントサイズ: 17px
    • ボタンの角丸: 15px
    • ボタンの背景色: #999999

細かい調整を行いたい場合は、テンプレート作成画面下のソースコードで調整する必要があります。