夜明けテーマのビデオバナーを追加するためのステップバイステップガイド Shopify -eコマースプラットフォーム

使用したことがある場合 Shopify、Dawnのテーマはご存知でしょう。これは、新しい起業家が利用できる頼りになる無料テーマの XNUMX つであり、ユニークなストアフロントをデザインするための高度にカスタマイズ可能なオプションです。

Dawn テーマには、標準のビデオアップロードブロックや画像バナーなど、多数のモジュールが付属しています。

画像バナーでは、ボタンとテキストを前景として、画像を背景にすることができます。残念ながら、ビデオモジュールではこのタイプの前景は許可されません。ただし、両方の長所を生かして、ビデオを背景にし、テキストを前景に配置するビデオバナーを作成する方法はあります。

このガイドでは、夜明けのテーマホームページで注目を集めるビデオバナー!

ドーンテーマの概要

ドーンテーマは無料です Shopify テーマこれは e コマース小売業者によって広く使用されています。シンプルなデザインと簡単な設定により、視覚的に魅力的でエレガントな外観の店舗をセットアップするための人気の選択肢です。

ビデオの背景/バナーとは何ですか?なぜウェブサイトで使用する必要があるのですか?

ビデオバナーは、ビデオを全幅の背景として表示し、ボタンやテキストなどの他の要素を前景に表示する Web ページの領域です。

Dawn テーマのビデオバナーのようなモジュールは、訪問者の Web サイト全体のエクスペリエンスを向上させる多くの利点を提供します。主な利点をいくつか示します。

充実した視覚要素: 魅力的な動画を組み込むことで、Web サイトの視覚的な魅力がさらに高まり、訪問者の注目を集めます。
ダイナミックで魅力的なコンテンツ: 動画は情報を効果的に伝えます。製品の機能を紹介したり、使い方を実演したり、魅力的なブランドストーリーを伝えたりして、訪問者の関心を引き付けることができます。
ユーザーエンゲージメントの強化: 動画には訪問者に永続的な印象を与える力があります。ビジュアル、オーディオ、モーションの組み合わせにより注意を引き、ユーザーがさらに探索するように促します。
効果的なブランドコミュニケーション: ビデオの背景やバナーは、ブランドのメッセージを顧客に伝えることができます。これにより、企業は独自の価値提案を強調し、製品やサービスを紹介し、強力なブランドアイデンティティを確立することができます。

Web サイトのデザインにビデオの力を活用することで、サイトをよりエキサイティングなものにし、コンバージョンを高めることができます。

Dawn テーマにビデオ背景/バナーを追加するためのステップバイステップガイド

技術的には、Dawn テーマのビデオバナーを追加するには XNUMX つの方法があります (すべてが理想的であるわけではありません)。

ビデオを WebP ビデオ/画像形式に変換します。
調整の Shopify 通常の画像バナーのコードを追加して、ビデオをサポートします。
ビデオを GIF 形式に変換します。
動画をビデオブロックにアップロードするだけです。 Shopify、前景要素を持つという考えをスキップします (したがって、それは真のバナーではなくなります)。

改造するのはそれほど難しいことではありません Shopify 標準的な画像バナーのコードですが、WebP などのファイル形式にアクセスできる場合、プロセスは不必要に長くなります。GIF はビデオの品質を大幅に低下させ、オプション 4 では実際のビデオバナーは作成されません。

そのため、お持ちの動画形式（.mp4、.mov、.wmv）をWebP形式に変換することをお勧めします。WebPは高解像度のJPEG画像、動画、GIFの利点を兼ね備えており、サイズを小さくし、解像度をあまり落とさずに美しい動画を作成できます。また、WebP動画/画像をアップロードすることもできます。 Shopify イメージバナー。

方法は次のとおりです。

ステップ 1: ビデオを取得して WebP ファイルに変換する Format

オンラインではさまざまな無料の「ビデオから WebP」コンバーターが提供されています。オンライン検索を試すか、テスト済みのコンバーターのいずれかを使用してください。

無料のコンバーターツールにビデオをアップロードし、WebP 形式に変換することを選択します。新しいファイルをコンピューターに保存します。

ステップ 2: Dawn テーマを見つける Shopify

「オンラインストア」>「テーマ」に移動します。

まだインストールしていない場合は、Dawnテーマをインストールしてください。そうでない場合は、Dawnテーマが次のように指定されているはずです。 Shopifyの「今のテーマ」。「カスタマイズ」ボタンをクリックして次に進みます。

ステップ 3: 画像バナーブロックを追加して選択します

「画像バナー」ブロックは、Dawn テーマにデフォルトで追加されます。したがって、そのモジュールをクリックして、左側のパネルでその設定を開くことができるはずです。右側のビジュアルプレビューで画像バナー自体をクリックすることもできます。「画像バナー」を最初から挿入する必要がある場合は、「ブロックの追加」リンクを使用します。

広告ⓘ

ステップ 4: WebP ビデオファイルをアップロードする

「最初の画像」セクションの下にある「画像を選択」ボタンをクリックします。

これにより、ストアのメディアライブラリに画像をアップロードするための領域がロードされます。動画の URL を貼り付けることもできますが、ここではアップロード機能を使用します。「画像を追加」ボタンを選択し、前に作成した WebP ファイルを選択します。新しくアップロードしたファイルにチェックマークを付けて、「完了」ボタンをクリックします。