Welcart Panetteria では、ヘッダー画像(メインビジュアル)エリアに自前のMP4ビデオやYouTubeビデオを表示することができます。
設定画面 | [ 外観 ] > [ カスタマイズ ] > [ ヘッダー画像のビデオ設定 ] |
---|

※ デフォルトでは「表示しない」が選ばれており、その場合、通常のヘッダー画像が適用されています。
MP4動画を適用
ヘッダー画像エリアに動画を表示から「MP4動画を適用」をクリックしますと、「MP4動画のアップロード」のパネルが現れます。

MP4動画のアップロード
「ファイルを選択」からお持ちの動画をアップロードもしくは、選択してください。最大約10MBのMP4動画をお勧めします。
カスタマイザーでの設定 | 表示 |
![]() | ![]() |
コントローラの表示
動画に、再生、ストップ、音量、拡大、ダウンロード、ピクチャーインピクチャーなどのボタンとタイムラインが表示されます。プルダウンより「表示する」「隠す」が選択できます。表示条件は、自動再生を停止にする必要があります。
カスタマイザーでの設定 | 表示 |
![]() | ![]() |
自動再生の有効化

動画を自動再生させることができます。プルダウンより「自動再生」「停止」が選択できます。自動再生の条件としては、ミュートをONにする必要があります。
ミュートのON/OFF

プルダウンより「ミュートする(ON)」「ミュートしない(OFF)」が選択できます。
ループ再生の有効化

動画を自動で繰り返し再生させることができます。プルダウンより「ループする」「停止」が選択できます。
スタート画面の画像設定
動画に静止画を表示することができます。設定した画像は動画が再生された時点で消え、一時停止しても再度表示されることはありません。「画像を選択」から画像をアップロードもしくは、メディアから画像を選択してください。
カスタマイザーでの設定 | 表示 |
![]() | ![]() |
インライン再生の有効化
スマートフォンで Webサイトページに埋め込まれている動画を再生しようとすると、強制的に全画面表示になってしまう動作をその場で再生可能にするのがインライン再生です。プルダウンより「有効にする」「停止」が選択できます。有効化するには、自動再生とミュートをONにする必要があります。
カスタマイザーでの設定 | 表示 |
![]() | ![]() |
ビデオ読み込み設定選択

サイトを読み込む際に、事前に動画ファイルを読み込ませるかを指定します。プルダウンより「なし」「メタデータ」「自動」が選択できます。
なし | 事前のファイルの読み込みを禁止 |
メタデータ | 長さやファイルサイズなどのメタ情報(動画の情報)だけを読み込む |
自動 | 初期値:動画ファイルを事前にダウンロードする |
ブラックスクリーン配置
拡大表示の際、動画の劣化をアミ掛け処理を行い目立たないようにする効果を持たせます。プルダウンより「しない」「する」が選択できます。なお、ブラックスクリーンを配置することによりコントローラの操作ができなくなります。
カスタマイザーでの設定 | 表示 |
![]() | ![]() |
YouTube 動画を適用
ヘッダー画像エリアに動画を表示から「YouTube 動画を適用」をクリックしますと、「YouTube 動画を適用」のパネルが現れます。

※ 動画は自動再生、自動ループとなります。
※ コントロールバーを非表示に設定しております。
※ 再生直後、動画の上部と右下にロゴマーク等の情報が表示されます。
YouTube ID
テキストボックスに、YouTube の ID名を挿入します。
ID名は動画URL「https://www.youtube.com/watch?v=○○○○○」末尾、○○○○○の部分にあたります。
管理画面 | フロント |
![]() | ![]() |
ループ再生の有効化

動画を自動で繰り返し再生させることができます。プルダウンより「ループする」「停止」が選択できます。
音量の選択

プルダウンより「無音」「最大音」が選択できます。
ブラックスクリーン配置
拡大表示の際、動画の劣化をアミ掛け処理を行い目立たないようにする効果を持たせます。プルダウンより「しない」「する」が選択できます。なお、ブラックスクリーンを配置することにより再再生の操作ができなくなります。
管理画面 | フロント |
![]() | ![]() |