Shopifyで動画を活用した集客。動画の埋め込み方法を解説

ECサイトを運営していると、「ユーザーにもっとわかりやすく商品を紹介したい」と悩むことがありませんか。
例えば、顧客から「思っていたのと違った」と返品希望の連絡があった際に、商品ページを隅々まで見直している方もいるでしょう。

一般的にECサイトではテキストや写真で商品の詳細を伝えますが、ユーザーの理解度を深めるのには限界があります。そこで、動画を駆使して商品の詳細を伝える方法がおすすめです。また、動画であれば集客につながるだけではなく、競合サイトとの差別化にも役立ちます。動画を利用して使用感・サイズ感を伝えることで「思っていたのと違う」を減らせるでしょう。

本記事ではShopifyで動画を活用するメリットや、動画を埋め込む方法について紹介します。

Contents

1 ECサイトで動画を活用するメリット
- 1.1 テキストや写真で表現できないことを伝えられる
- 1.2 ECサイトの滞在時間が長くなる
2 ECサイトに動画を埋め込んだ際のデメリット
3 Shopifyで動画を埋め込む方法
4 3Dモデルのデータファイルを表示することも
5 まとめ

ECサイトで動画を活用するメリット

ECサイトで動画を活用するメリットが2つあります。
「テキストや写真で表現できないことを伝えられる」「ECサイトの滞在時間が長くなる」の2つです。それぞれのメリットについて解説します。

テキストや写真で表現できないことを伝えられる

テキストや写真で商品の詳細まで伝えるには限界があります。例えば、商品の詳細を伝えようと細かな部分までテキストで描写しても、ユーザーが読んでくれるとは限りません。また、写真はパッと見て商品の特徴を掴みやすいですが、サイズ感を誤認してしまうことがあります。写真に写っている小物や人物は、ユーザーによって感じる大きさが異なるためです。

このようなデメリットをカバーしてくれるのが動画です。動画は商品の詳細・サイズ感・使用感を伝えられるため、テキスト・写真と併用することで誤認を減らすのに役立ちます。

ECサイトの滞在時間が長くなる

ECサイトで動画を活用することで、滞在時間が長くなります。サイト訪問者は、動画があることで注意を惹きつけられるためです。ECサイトの滞在時間が長くなるほど、購入してもらえるチャンスが増えるためコンバージョン率の改善にも役立つでしょう。

ECサイトに動画を埋め込んだ際のデメリット

ECサイトへの動画の掲載にはデメリットもあります。
それは、「ECサイトの表示速度が遅くなること」の1点です。

動画は、情報量の多さから読み込むために時間を要してしまいます。そのため、動画を掲載することでページが表示されるまでに時間がかかりやすくなります。

少しくらい遅くなっても問題ないと思うかもしれませんが、その判断をするのはサイト訪問者です。少しでも表示速度が遅いと感じると、すぐに離脱する方もいるでしょう。つまり、ECサイトの表示速度が遅くなるほど、ユーザーに見られなくなる可能性が高まります。

動画を掲載する場合は、表示速度が遅くならないように動画ファイルの容量に気をつけなければなりません。表示が遅くなる場合には、時間を短くすることや解像度を下げるなどの対応が必要です。

Shopifyで動画を埋め込む方法

Shopifyでは、商品ページかブログ記事かによって動画を埋め込む方法が異なります。また、手持ちの動画ファイルを利用するか、YouTubeの動画を利用するかによっても違います。
Shopifyにとって動画は集客に有効なツールの1つです。うまく活用するためにも4通りの埋め込む方法について理解を深めましょう。

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

商品ページにYouTube動画を埋め込む方法から解説します。
まずは、挿入したいYouTube動画のURLを開き、動画の右下に表示されている「共有」ボタンをクリックしてください。すると動画のURLが表示されるはずです。右横のコピーを選択して動画URLをコピーします。

次に商品ページを開き、商品画像を追加するスペースの「URLから追加」をクリックします。コピーした動画URLを貼り付けて「ファイルを追加」をクリックすると、動画の埋め込みが完了です。
同様の方法で、Vimeoの動画をアップロードすることも可能です。

商品ページに動画ファイルのアップロード手順

商品ページに動画ファイルをアップロードする手順は、写真と同じ方法なのでわかりやすいでしょう。商品写真を追加するのと同様に、動画ファイルを指定することで挿入が完了します。また、ドラッグ＆ドロップでもアップロードできます。直感的な操作方法ができるのもShopifyの魅力です。
注意が必要な点は、アップロードできる動画ファイルは以下の条件を満たす必要があることです。

項目	条件
ビデオ時間	最長10分まで
ビデオ容量	最大1GBまで
ビデオ解像度	最大4K（4096×2160ピクセル）
ビデオ形式	.mp4 .mov

ブログページにYouTube動画を埋め込む手順

ブログページにYouTube動画を埋め込む手順は、商品ページに比べると若干手間がかかります。
挿入したいYouTube動画のURLを開き、動画画面の右下にある「共有」ボタンをクリックします。ここからが商品ページと異なる部分で、表示された「埋め込む」を選択してください。動画の埋め込み用の「

ブログページに動画ファイルのアップロード手順

ブログページに手持ちの動画ファイルを挿入する手順は、複雑でわかりにくいため詳しく解説します。

まずは、Shopifyの設定画面を開き、「ファイル」を選択します。挿入したい動画ファイルをアップロードしてください。アップロードが完了したら、動画の右横の「リンク」ボタンから動画のURLをコピーします。
次に、動画を埋め込みたいブログ記事の編集ページを開きます。エディターモードでは動画を埋め込めませんので、「＜＞」と表示されているボタンをクリックしてHTML編集モードに変更してください。
動画を埋め込みたい場所に以下のコードを入力します。

＜video controls=”controls” style=”max-width: 100%; height: auto;”＞
＜source src=”コピーした動画URLをここに貼り付ける” type=”video/mp4″/＞

先の手順でコピーした動画URLを指定の場所に貼り付けることで完成です。この方法は少し手順が複雑なので、慣れるまではプレビューなどで狙い通りに表示されるか確認するようにしましょう。

3Dモデルのデータファイルを表示することも

Shopifyは、写真・動画以外にも3Dモデルをアップロードできるのが魅力です。
3Dモデルがあることにより、ユーザーは商品を上下左右の様々な角度から確認できます。さらに、ShopifyではARと組み合わせることで、まるで商品が実際にそこにあるかのように表示することも可能です。実際の映像と組み合わせることで、サイズ感や使用感をイメージしやすくなります。

Shopifyで対応している3DモデルはGLB形式・USDZ形式の2つで、ファイルサイズを500MB以下にする必要があります。
ファイルを用意できましたら、動画をアップロードするのと同じ要領で、「商品ページ」の「ファイルを追加」から3Dモデルをアップロードしましょう。

まとめ

Shopifyに動画を埋め込む方法は、「商品ページ・ブログ記事」「手持ちの動画ファイル・YouTube動画」の違いにより4通りあります。動画をうまく利用するためには、4通りの方法をすべて把握しておくと良いでしょう。

ECサイトにおいて動画は、写真やテキストで伝えきれない情報を伝えられるため、ユーザーに商品を訴求する方法として優れています。しかし、動画のサイズが大きすぎると表示速度も遅くなるため、ユーザーが離脱する原因になりかねません。
動画を活用する際には、表示速度が遅くならないように解像度や動画時間に気を配りましょう。