テンプレート一覧
テンプレートを使用する際は雛形フォルダから複製してご使用ください。

表示方法：サイドバー　＞　バナー 一覧　＞　雛形フォルダを表示

設定中のフォルダの下に雛形フォルダが表示されます。雛形を選んで「複製」を押してください。
複製後、「複製バナー」フォルダが作成されます。複製バナーの中に複製された雛形が入っていますので、そちらを編集してご使用ください。
ガイドモーダル
テンプレートNo.plugA-1導入目安：60〜90分
テンプレート名
ガイドモーダルバナー（単一ボタン）
デザイン
雛形の名前
差し込み配信用　＞　モーダルバナー　＞　【雛形】ガイドモーダル（1連）
更新方法
【更新箇所】
① クリック前ボタンの文言
<button class="tp_guide-btn">の文言を変更してください。

② モーダル内ヘッダータイトルの変更
<h2 class="tp_modal__title">の文言を変更してください。

③ モーダル内本文の変更
<div class="tp_modal__body">の文言を変更してください。HTML内に変更箇所を記載していますので説明に沿って変更してください。

色や文字サイズを変更したい場合は、HTML下部の <style> 内にある :root の設定を編集してください。ここを書き換えるだけで、全体のデザインに反映されます。


【AIエージェントを使って変更も可能です】
◼︎AIエージェントの使用例
・ボタンの枠線と文字の色を赤色に変更
・モーダル内のテーマカラーを赤色に変更

※上記のようにAIに指示してください。
テンプレートNo.plugA-2導入目安：90〜120分
テンプレート名
ガイドモーダルバナー（２種ボタン）
デザイン
雛形の名前
差し込み配信用　＞　モーダルバナー　＞　【雛形】ガイドモーダル（2連）
更新方法
【更新箇所】
① クリック前ボタンの文言
<button class="tp_guide-btn">の文言を変更してください。

② モーダル内ヘッダータイトルの変更
<h2 class="tp_modal__title">の文言を変更してください。

③ モーダル内本文の変更
<div class="tp_modal__body">の文言を変更してください。HTML内に変更箇所を記載していますので説明に沿って変更してください。

色や文字サイズを変更したい場合は、HTML下部の <style> 内にある :root の設定を編集してください。ここを書き換えるだけで、全体のデザインに反映されます。


【AIエージェントを使って変更も可能です】
◼︎AIエージェントの使用例
・ボタンの枠線と文字の色を赤色に変更
・モーダル内のテーマカラーを赤色に変更

・配送日と料金変更
　北海道：2,000円、出荷後3日程度
　・・・

※上記のようにAIに指示してください。
テンプレートNo.plugA-3導入目安：120〜150分
テンプレート名
ガイドモーダルバナー（３種ボタン）
デザイン
雛形の名前
差し込み配信用　＞　モーダルバナー　＞　【雛形】ガイドモーダル（3連）
更新方法
【更新箇所】
① クリック前ボタンの文言
<button class="tp_guide-btn">の文言を変更してください。

② モーダル内ヘッダータイトルの変更
<h2 class="tp_modal__title">の文言を変更してください。

③ モーダル内本文の変更
<div class="tp_modal__body">の文言を変更してください。HTML内に変更箇所を記載していますので説明に沿って変更してください。

色や文字サイズを変更したい場合は、HTML下部の <style> 内にある :root の設定を編集してください。ここを書き換えるだけで、全体のデザインに反映されます。


【AIエージェントを使って変更も可能です】
◼︎AIエージェントの使用例
・ボタンの枠線と文字の色を赤色に変更
・モーダル内のテーマカラーを赤色に変更

・配送日と料金変更
　北海道：2,000円、出荷後3日程度
　・・・

※上記のようにAIに指示してください。