テンプレートを編集する-動画ポップアップ

編集画面ではポップアップに使用する動画の「動画選択」と「動画ポップアップを編集」パネルが表示されます。

「動画ポップアップを編集」パネルでは以下の編集ができます。

①表示条件

②デザイン

③終了画面

④ボタン

 

1. 動画を設定する

💡以下のファイルに対応しています。 MP4・MOV形式 データ容量が最大15MB 最大表示サイズは横幅1280px ※最大幅より画面サイズの方が小さい場合は、お使いの画面に合わせて自動的に調整されます。

 

動画選択画面

ポップアップに表示させたい動画を設定します。

 

①［動画を設定する］	動画ファイルを直接ドラッグ＆ドロップします。
②［ファイルを選択］	動画ファイルをフォルダから選択します。
③［メディア一覧から選択］	動画ファイルをメディア一覧から選択します。

 

2. 表示させる条件を設定する

［表示条件］タブにある［条件を設定］をクリックしポップアップを表示させる条件を設定します。

 

「条件を設定」のダイアログが表示されるので、ポップアップを表示させる条件を設定します。

💡初期設定は、以下の設定になっています。 すべてのアクセスに対して、回数の制限なくポップアップを表示させます。 サイト訪問者の閲覧の開始と同時に動画ポップアップを表示させます。

 

設定の詳しい内容は、以下のページをご確認ください。

「動画ポップアップを表示させる「アクセスの対象」と「回数の上限」を設定する」

「動画ポップアップを表示させる条件となるイベントを設定する」

 

3. デザインを編集する

［デザイン］タブをクリックし、表示したいデザインを選択します。

 

「動画ポップアップを編集」パネル：［デザイン］タブを選択

ポップアップ種別	①［オーバーレイ］	画面の中央にポップアップを表示させます。
	②［追従バナー］	画面の右下もしくは左下にポップアップを固定表示させます。 初期設定では右下に表示します。
追従バナー	③［表示位置］	※ポップアップ種別で［追従バナー］を選択した場合のみ表示します。 ポップアップの表示位置を「右下」「左下」の2種類の中から選択できます。
動画設定	④［自動再生］	チェックボックスを［オン］にすると、自動で動画を再生します。
	⑤［ループ再生］	チェックボックスを［オン］にすると、動画が終了した後に繰り返し動画を再生します。
	⑥［コントロールバーを表示］	チェックボックスを［オン］にすると、動画が終了した後に繰り返し動画を再生します。
⑦閉じるボタン		ポップアップを閉じるためのボタンの表示イメージです。 ポップアップに設定した画像のデザインや、ポップアップの背景の不透明度や表示されるページの色彩に合わせて、デザインを5種類の中から選択できます。
⑧［ポップアップのサイズ］		ポップアップのサイズを、30%（小さい）から100%（大きい）の間で、スライダーを操作して1%きざみで調整できます。
背景	⑨［余白］	ポップアップの背景の余白を「なし」、「小」、「中」、「大」の4種類の中から選択できます。
	⑩［角の丸み］	ポップアップの背景の角の丸みを3種類の中から選択できます。

 

4. 終了画面を編集する

［終了画面］タブをクリックし、終了画面を設定します。

❗️ループ再生を設定している場合には表示されません。

 

「動画ポップアップを編集」パネル：［終了画面］タブを選択

①［終了画面テキスト］			終了画面テキスト表示の［オン／オフ］を設定します。 ［オン］：終了画面のテキストが表示された状態 ［オフ］：終了画面のテキストが非表示の状態
②［終了画面テキスト］			終了画面に表示したいテキストを入力します。
③［ボタンを表示］			終了画面に表示するボタンの［オン／オフ］を設定します。 ［オン］：終了画面のボタンが表示された状態 ［オフ］：終了画面のボタンが非表示の状態
④［ボタンテキスト］			ボタンに表示するテキストを入力します。
⑤ ボタン設定			ボタン設定を「リンクを設定／スクリプトを設定」から選択します。
リンクを設定		⑥［クリックして移動する先のURL］	ボタンをクリックして移動する先のURLを入力します。
		⑦［新しいタブで開く］	チェックボックスを［オン］にすると、新しいタブで移動先のページを開きます。
		⑧［URLパラメータをリンク先へ引き継ぐ］	チェックボックスを［オン］にすると、移動先のページのURLにパラメータを引き継ぎます。
		⑨［クリック後、ポップアップを閉じる］	チェックボックスを［オン］にすると、ボタンがクリック／タップされた後にポップアップを閉じるようになります。
⑩［スクリプトを設定］			ボタンをクリック／タップして起動するスクリプトを設定します。 詳しくは「ウィジェットをクリックして起動するスクリプトを設定する」をご確認ください。

 

5. ボタンを追加する

💡ボタンは最大4個まで追加できます。

［ボタン］タブをクリックします。

 

［ボタンを追加］ボタンをクリックします。

 

ボタンを設定します。

 

ボタン共通デザインを設定します。

 

設定の詳しい内容は、以下のページをご確認ください。

「動画ポップアップにボタンを追加する」

 

「動画ポップアップを編集」パネル：［ボタン］タブを選択（共有）

①［ボタンを追加］				クリックするとボタン設定メニューが表示されます。
ボタン共通デザイン	②［角の丸み］			ボタンの角の丸みを3種類の中から選択します。
	③［ボタンサイズ］			ボタンのサイズを、20%（小さい）から100%（大きい）の間で、スライダーを操作して1%きざみで調整できます。
	［テキスト設定］	④［フォントサイズ］		［ボタンテキスト］のフォントサイズをスライダーを操作し13段階で調整できます。
		［フォント設定］	⑤［ボールド］	選択すると［ボタンテキスト］のフォントのウェイトをボールドにします。
			⑥［斜体］	選択すると［ボタンテキスト］のフォントのスタイルを斜体にします。
			⑦［打ち消し線］	選択すると［ボタンテキスト］のフォントに打ち消し線を表示します。
			⑧［アンダーライン］	選択すると［ボタンテキスト］のフォントにアンダーラインを表示します。

 

「動画ポップアップを編集」パネル：［ボタン］タブを選択（［ボタンを追加］をクリック）

①［ボタンテキスト］			［ボタンテキスト］ に表示したいテキストを入力します。
② ボタン設定			ボタン設定を「リンクを設定／スクリプトを設定」から選択します。
［リンクを設定］	③［クリックして移動する先のURL］		ボタンをクリックして移動する先のURLを入力します。
	④［新しいタブで開く］		チェックボックスを［オン］にすると、新しいタブで移動先のページを開きます。
	⑤［URLパラメータをリンク先へ引き継ぐ］		チェックボックスを［オン］にすると、移動先のページのURLにパラメータを引き継ぎます。
	⑥［クリック後、ポップアップを閉じる］		チェックボックスを［オン］にすると、ボタンがクリック／タップされた後にポップアップを閉じるようになります。
⑦［スクリプトを設定］			ボタンをクリック／タップして起動するスクリプトを設定します。 詳しくは「ウィジェットをクリックして起動するスクリプトを設定する」をご確認ください。
⑧［フォントカラー］			［ボタンテキスト］のフォントカラーを自由に選択できます。
⑨［背景カラー］			ボタンの背景カラーを自由に選択できます。
⑩［ボタンを追加］			クリックするとボタンを設定する画面が開きます。

 

6. 編集内容を保存する

💡［テンプレートから作成］で作成したウィジェットはマイウィジェットとして保存されます。

すべての編集が完了したら［編集内容を保存］をクリックします。

 

「テンプレートをマイウィジェットとして保存」のダイアログが表示されるので、ウィジェット名を入力し［マイウィジェットに保存］をクリックします。

 

「マイウィジェット一覧」に移動し作成したウィジェットが追加されていることを確認できます。