1. ホーム
  2. Fireworkの使い方
  3. ショート動画をFireworkにアップロードして埋め込む

Webページにビデオを埋め込む

Webサイトにビデオウィジェットを埋め込むためのHTMLタグを生成する方法を学びます。

Web サイトにビデオコンテンツを追加する準備ができたら、簡単にコピーして貼り付けることができるHTMLコードタグを生成します。ページ上のコンテンツを配置する場所を特定し、選択したコンテンツブロックにコードを貼り付けます。

Shopify を使用してビデオを埋め込みたいですか?こちらの手順をご覧ください。

Webページにビデオを埋め込むには:

  1. 管理画面で、追加するプレイリストをクリックします
  2. ページの右上隅にある「サイトに追加」ボタンをクリックします。
  3. プレイリストのレイアウトを選択します。 5 つの異なるプレイリストレイアウトから選択できます。

    Embed playlist v2

  4. 「コードをコピー」ボタンをクリックします。
  5. HTMLコードを貼り付けてWebページに埋め込みます。

5 レイアウトの選択

 

ストーリーブロック、グリッド、カルーセルは、Webサイトの本文に組み込むように設計されています。これらはページの静的な部分であり、訪問者がスクロールして通り過ぎることができます。ストーリーブロックのカスタマイズについて詳しくは、こちらをご覧ください。

ユーザーがWebページの閲覧を続けている間、グリッドカルーセルはピクチャイン ピクチャモードで再生し続けることができます。

フローティングプレーヤーは通常、Webサイトのヘッダーまたは本文にプラグインされます。他のコンテンツの上に浮かび上がり、訪問者と一緒に画面の隅でスクロールしながら再生を続けます。

 

ストーリーブロック: これは静的なコンテンツブロックです。Web ページの一部に 1 つのビデオが表示され、スクロールして通り過ぎることができます。 1 つのビデオが完了すると、プレイリスト内の次のビデオが再生されます。コード行を追加して、背景を透明にカスタマイズします。

Screen Shot 2023-01-12 at 5.39.24 PM
フローティングプレーヤー: これはページの右下隅にある小さなビデオ画面で、ユーザーがスクロールするとページとともにフローティングします。 Web ページの他の場所をクリックすると、プレイリストビデオがピクチャインピクチャ ビューに戻ります。

Screen Shot 2023-01-12 at 5.40.04 PM
グリッド: ビデオをクリックしてプレーヤーを拡大し、ユーザーがプレイリスト内のビデオを左右にスクロールできるようにします。最小化すると、ビデオプレーヤーは画面の隅に浮かび上がります。ビデオをどのコーナーにフローティングするかを選択できます。

Screen Shot 2023-01-12 at 5.46.04 PM-1

カルーセル: ビデオを選択すると、ビデオプレーヤーが拡大されます。最小化すると、ビデオプレーヤーは画面の隅に浮き上がります。ビデオをどのコーナーにフローティングするかを選択できます。

Screen Shot 2023-01-12 at 5.45.26 PM
ヒーローユニット: ※ライブ配信を含むプレイリストにのみ適用されます。ヒーロー ユニットは全画面表示で、画面の左側にストーリー ブロックが表示され、右側にテキストが表示されます。このライブ配信固有のレイアウトの詳細については、「ヒーローユニットを有効にする」を参照してください。

Screen Shot 2023-01-12 at 5.45.44 PM