サムネイル

Shopify で商品ページに動画を挿入する方法を徹底解説!

目次

はじめに

Shopify では商品ページに動画を表示することで、商品をアピールできます。今回の記事では、商品ページに商品の動画を設置して、ユーザーが再生できるようにする設定を行っていきます。

商品動画を埋め込むことのメリット

商品ページに動画があると様々なメリットがあります。

販売促進

商品動画があると動きによって情報が補われます。商品を購入するかどうか迷っている顧客も、商品動画があると商品についてよく知ったうえで購入できます。

実際に使用しているシーンを動画で伝えることで、顧客自身がその商品を使用している自分をイメージすることで購入を促進させる効果もあります。

動画制作サービスの調査によると、動画の活用により 60%以上の企業で売上が 1.3 倍以上になったと回答しています。

SEO 対策

動画を埋め込むと、その分だけ顧客がサイトを見ている時間が長くなりサイトの平均滞在時間が長くなるため、SEO 対策に繋がります。

商品動画を埋め込むことのデメリット

商品動画を埋め込むことにはデメリットもあります。

ページローディングが遅くなる

ページに動画が埋め込まれていると、顧客がそのページを訪れてからコンテンツが表示されるまでに時間がかかってしまいます。ローディングパフォーマンスで Google が設定している基準を満たさない場合、SEO 順位が下がる可能性があります。

ページの表示パフォーマンスを計測するツールである Lighthouse スコアなどを確認しながら、動画を掲載ていくことが望ましいです。

動画作成にコストがかかる

動画制作は長さにもよりますが、プロに依頼しようとすれば数十~数百万円ほどになります。単価が高い商品や売れ行き商品で無い限り、プロに依頼した商品動画を準備するのは困難です。

商品ページに直接動画を埋め込む方法

Shopify で商品ページに動画を埋め込む手順をご紹介します。

Shopify で埋め込める動画の制約

  • 動画の長さ:10 分以内
  • ファイルサイズ:10GB 以内
  • 解像度:最大 4K
  • ファイル形式:「mp4」 もしくは 「mov」

商品ページに直接動画を埋め込む手順

実際に商品ページに動画を挿入する手順をご紹介します。

まずは商品ページを表示して、「セクションを追加」から「動画」を選択します。

動画を選択

「ビデオを選択」からビデオ埋め込みモーダル開きます。

埋め込みモーダルを開く

「ビデオを追加する」ボタンをクリックして追加したい動画を選択するか、追加したい動画をドラッグ&ドロップします。

追加する動画をドラック&ドロップ

これで直接、商品動画をページに埋め込むことができました。

商品動画をページに埋め込む

YouTube 上の動画を埋め込む

Youtube 上にアップされている動画を埋め込むこともできます。

Youtube 経由で動画を埋め込む場合は、動画の長さや容量を気にする必要はありません。

自社で用意した動画を Youtube から埋め込む場合、あらかじめ Youtube 上に動画をアップしておく必要があります。

Youtube に動画をアップロードする方法

Youtube にアクセスします。
(ログインしていない場合はログインします)

動画作成アイコンをクリックします

動画作成アイコンをクリック

「動画をアップロード」をクリックします。

動画をアップロードをクリック

以下の画面に遷移するので、用意した動画ファイルをドラック&ドロップするか、「ファイルを選択」から動画ファイルを選択してアップロードします。

ファイル選択から動画ファイルを選択してアップロード

「いいえ、子ども向けではありません」を選択し、動画リンクをコピーして「次へ」をクリックします。

「次へ」をクリックします。

次へをクリック

もう一度「次へ」をクリックします。

もう一度次へをクリック

最後に動画の公開設定を行います。

「限定公開」もしくは「公開」を選択します。
「限定公開」を選択した場合、リンク経由でしか動画が閲覧されなくなります(検索しても表示されなくなります)。

限定公開を選択

コピーした動画のリンクを Shopify サイトに貼り付けます。

Shopify サイトに貼り付ける

リンクを貼り付けたら、アップした動画が実際に再生されるか確認しましょう。
(動画のアップロードが完了していれば、カスタマイズ画面から動画を再生できます)

まとめ

Shopify サイトに商品動画を埋め込む方法を解説しました。

「どこでも YouTube 動画埋め込み|リテリア Video」はコードを編集せずにストアに動画を表示できます。
インストールはこちらから

解説記事はこちらから

サイト構築の参考になれば幸いです。

おすすめ Shopify アプリ

シンプルカスタムマウスカーソル|お手軽ポインターカスタマイズのアイコン

シンプルカスタムマウスカーソル|お手軽ポインターカスタマイズ

ストアのマウスカーソルを変更。形・絵文字・自分の画像から選べます。

シンプル低在庫アラート|在庫管理・在庫切れ通知・欠品防止のアイコン

シンプル低在庫アラート|在庫管理・在庫切れ通知・欠品防止

在庫が減ったらすぐ通知。商品・バリエーション・ロケーション別に設定できます。

シンプル商品見積もり依頼|価格非表示・B2B対応・法人向けのアイコン

シンプル商品見積もり依頼|価格非表示・B2B対応・法人向け

価格を隠して「見積を依頼」ボタンに。BtoB・卸売のストアに。

シンプル一括注文帳票印刷|PDF・インボイス・請求書対応のアイコン

シンプル一括注文帳票印刷|PDF・インボイス・請求書対応

注文から領収書・請求書・納品書・見積書を一括で印刷。PDF保存もできます。

シンプル領収書セルフ発行|PDF・請求書・インボイス対応のアイコン

シンプル領収書セルフ発行|PDF・請求書・インボイス対応

購入者が注文状況ページから領収書・請求書を自分で発行できます。「領収書ください」への対応をゼロに。

シンプル検索0件対策|おすすめ商品レコメンド・関連商品表示のアイコン

シンプル検索0件対策|おすすめ商品レコメンド・関連商品表示

検索が0件のときにおすすめ商品を表示。お客様の買い物を止めません。

シンプルカート同期|お手軽デバイス間カート自動同期のアイコン

シンプルカート同期|お手軽デバイス間カート自動同期

ログイン顧客のカートを、スマホとパソコンの間で自動的に同じ状態に保ちます。お客様の操作は一切不要です。

シンプル商品絞り込みカスタマイズ|コレクション検索・並び替えのアイコン

シンプル商品絞り込みカスタマイズ|コレクション検索・並び替え

コレクションページに絞り込み・検索・並び替え機能を追加。お客様が欲しい商品をすぐに見つけられます。

関連記事