Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
WPBカップ
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

WooCommerceギャラリーに商品動画を追加する方法

編集メモ: WPBeginner のパートナーリンクから手数料を得ています。手数料は編集者の意見や評価に影響を与えません。編集プロセスについて詳しく知る。

WooCommerceギャラリーに商品動画を追加したいですか?

動画は商品のより詳細で魅力的なデモンストレーションを提供することができます。さらに、WooCommerceストアをより視覚的に魅力的で魅力的なものにすることができます。

この投稿では、WooCommerceギャラリーに商品動画を簡単に追加する方法をステップバイステップでご紹介します。

Adding product videos to your WooCommerce gallery

なぜWooCommerce商品動画を追加するのか?

WooCommerceストアに商品動画を追加することで、より詳細で有益な方法で効果的に商品を紹介することができます。これにより、カスタマイザーは商品の特徴やメリットをより深く理解することができます。

商品動画を見た訪問者が購入に至る確率は73%高いため、コンバージョン率の向上につながる。

また、動画で商品の動きを見せることで、潜在的な顧客との信頼関係を築き、より安心して購入してもらうことができます。

例えば、ヘッドホンを販売するオンラインストアがある場合、ヘッドホンの音質や機能を紹介する商品動画を追加することで、より多くのコンバージョンを獲得することができます。

Headphone WooCommerce product video preview

さらに、WooCommerceギャラリーに商品動画を追加することで、検索エンジンが動画を含むマルチメディアコンテンツを持つサイトを優先するため、サイトのSEOランキングを上げることもできます。

検索結果で上位に表示されることで、より多くの人が店舗を訪れ、商品を購入することにつながる。

それでは、WooCommerceギャラリーに商品動画を簡単に追加する方法を見ていきましょう。以下のリンクから使いたい方法にジャンプできます:

方法1:YITH WooCommerce Featured Audio & Video Content (Free & Premium)を使用してWooCommerce商品動画を追加する。

この方法では、プレミアムプラグインを使ってWooCommerceギャラリーに商品動画を追加する方法をご紹介します。動画の表示や再生設定をよりコントロールしたい場合は、この方法をお勧めします。

まず、YITH WooCommerce Featured Audio & Video Contentプラグインをインストールして有効化する必要があります。詳しい手順については、WordPressプラグインのインストール方法についての初心者ガイドをご覧ください。

このプラグインを使用すると、YouTubeやVimeoの動画、またはメディアライブラリから独自の動画をWooCommerceギャラリーに追加することができます。

注: 無料のYITH WooCommerce Featured Videoプラグインもあります。ただし、動画、モーダル、ギャラリーの設定のほとんどを設定することはできません。

プラグインの一般設定を行う

有効化したら、WordPress 管理サイドバーからYITH ” Featured Audio & Video Contentページに移動します。

動画設定が開きます。ここから、ドロップダウンメニューから商品動画のアスペクト比を選択します。

無料版を使用している場合、利用できる設定はこれだけです。

Choose the aspect ratio for the product video

次に、ページが読み込まれたらすぐに動画の再生を開始したい場合は、「AutoPlay」スイッチを有効化した状態に切り替えます。

また、「ループ」スイッチを切り替えて、動画が終了したらすぐにやり直すこともできる。

そうしたら、「音量」オプションの隣にあるスライダーを動かして動画の音量を調整する必要がある。次に、’停止可能な動画’スイッチをオンに切り替えるだけで、ユーザーが動画を一時停止できるようになります。

Configure the General settings for the video

次に、’YouTube Settings’セクションまでスクロールダウンし、あなたの動画と同じチャンネルの他のYouTube動画を推薦したい場合は、’Show Related’スイッチをオンに切り替えます。この設定は、YouTubeから商品動画を埋め込む場合にのみ必要です。

その後、YouTube動画プレーヤーのテーマとスタイルを選択することができます。

Configure YouTube video settings

それができたら、「Vimeo設定」セクションまでスクロールダウンし、「動画タイトルを表示」スイッチをオンにして、Vimeoプレーヤーに動画タイトルを表示する必要があります。商品動画がVimeoでホスティングサービスされている場合のみ、この設定を変更する必要があります。

さらに、Vimeoプレーヤーの再生コントロールカラーを選択できます。

Configure Vimeo Settings

その後、’VideoJSプレーヤースタイル’セクションに移動し、’スタイル’オプションとして’カスタム’を選択します。

カスタマイザー設定を開き、動画プレーヤーの背景色、スライダー色、ボタン色などを設定することができます。

設定が完了したら、「オプションを保存」ボタンをクリックして設定を保存します。

Configure color settings for the video

モーダル設定 (プレミアムプラグインのみ)

ここで、ページ上部の「モーダル設定」タブに切り替える必要があります。無料プラグインを使用している場合、このタブは利用できないことを覚えておいてください。

モーダルウィンドウに動画を表示したい場合は、’Video in modal’スイッチを切り替えてください。これにより、ページ上の他のコンテンツの前に動画がライトボックス内に表示されます。

そうしたら、ドロップダウンから「モーダル表示効果」を選ぶこともできます。

Configure Modal Settings

次に、「オプションを保存」ボタンをクリックして設定を保存します。

ギャラリーの設定(プレミアムプラグインのみ)

ここで、上部から「ギャラリー設定」タブに切り替える必要があります。このタブはプレミアム版でのみ利用可能です。

ここから、WooCommerceギャラリーに商品動画を表示するには、’動画と音声ギャラリーモード’として’WooCommerceギャラリー’オプションを設定する必要があります。

Choose the WooCommerce Gallery option

また、「プラグインギャラリー」オプションを設定すると、特集動画が関連ギャラリーに表示されます。

一方、WooCommerceや関連ギャラリーの代わりにサイドバーに商品動画を表示したい場合は、「サイドバーに動画と音声を表示」スイッチを切り替えることもできます。

設定が完了したら、忘れずに「オプションを保存」ボタンをクリックして設定を保存してください。

Show the video in the sidebar

WooCommerceギャラリーに商品動画を追加する

WooCommerceギャラリーにWooCommerce商品動画を追加する時が来ました。

まず、WordPressの管理画面サイドバーから、商品 ” すべての商品のページにアクセスします。商品名の下にある「編集」リンクをクリックすると、「商品の編集」ページが開きます。

Click the Edit link under the products page

次に、「製品データ」セクションまでスクロールダウンし、左カラムから「動画」タブをクリックする。

次に、’Add Video’ドロップダウンメニューから動画を追加する方法を選択する必要があります。このチュートリアルでは、YouTube動画のURLを追加するので、’By URL’オプションを選択します。

Switch to the Video tab and choose By URL option from the dropdown menu

また、WordPressのメディアライブラリを使って動画をアップロードすることもできます。ただし、動画のアップロードには多くの帯域幅を使用するため、この方法はお勧めしません。

詳しくは、WordPressに動画をアップロードしてはいけない理由についての初心者向けガイドをご覧ください。

次に、「動画名」ボックスに商品動画の名前を入力するよう求められます。

YouTube動画のURLを「動画URL」ボックスに貼り付け、「動画を追加」ボタンをクリックします。

Paste YouTube video URL

最後に、上部にある「更新」または「公開」ボタンをクリックして変更を保存します。

これで、オンラインストアにアクセスして、商品のWooCommerceギャラリーに動画が追加されているかどうかを確認することができます。

これがデモサイトでの製品動画の様子です。

Preview for WooCommerce product video

方法2:Really Simple Featured Video(無料)を使ってWooCommerce商品動画を追加する

WooCommerceの商品動画を無料で簡単に追加する方法をお探しなら、この方法がお勧めです。

まず、Really Simple Featured Videoプラグインをインストールして有効化する必要があります。詳しくはWordPressプラグインのインストール方法のチュートリアルをご覧ください。

プラグインの設定を行う

有効化したら、WordPressダッシュボードから設定 ” Really Simple Featured Videoのページにアクセスしてください。

ここから、WooCommerceの動画サポートを有効化するために’Products’スイッチを切り替えます。その後、「変更を保存」ボタンをクリックして設定を保存します。

Toggle the Products switch

次に、上部から「コントロール」タブに切り替える必要があります。ここでは、インストール型の動画と埋め込み動画の設定を行うことができます。

次に、「インストール型の動画」セクションに移動し、「コントロール」スイッチを切り替えて動画プレーヤーにコントロールを追加します。

その後、’Loop’スイッチを切り替えると、動画をループ再生し続けることができる。さらに、’Mute sound’の横にあるスイッチを切り替えることで、初期設定で動画をミュートすることもできます。

動画が自動的に再生されるようにしたい場合は、’Autoplay’スイッチをオンにしてください。

Toggle the controls switch

次に、「動画を埋め込む」セクションまでスクロールダウンすると、動画を埋め込むためのオプションがすべて繰り返し表示されます。

これらの設定をお好みに合わせて設定し、「変更を保存」ボタンをクリックするだけで設定が保存されます。

WooCommerceギャラリーに商品動画を追加する

WooCommerceギャラリーに商品動画を追加するには、管理サイドバーから商品 ” すべての商品ページに移動します。

ここから、製品名の下にある「編集」リンクをクリックして開きます。

Edit the products page

右カラムの “Featured Video “セクションまでスクロールダウンし、動画ソースを選択する。

コンピューターやメディアライブラリから動画をアップロードしたい場合は、「セルフ」オプションを選択する必要があります。しかし、YouTubeや他のプラットフォームから動画を埋め込むには、「Embed」オプションを選択する必要があります。

注:動画は帯域幅を多く使用するため、サイトにアップロードすることはお勧めしません。詳しくは、WordPressで動画をアップロードしてはいけない理由をご覧ください。

このチュートリアルでは、YouTube動画を追加したいので、「Embed」オプションを選択します。

Choose the Embed option and paste the video URL

このオプションを設定すると、「動画のURLはこちら」フィールドが表示されます。YouTube、Vimeo、Dailymotionの動画リンクをこのフィールドに追加してください。

最後に、上部にある「更新」または「公開」ボタンをクリックして変更を保存します。

これで、サイトにアクセスしてWooCommerceの商品動画をチェックすることができます。

headphones preview

ボーナス:あなたのストアにWooCommerce商品ギャラリーを追加する

動画以外にも、サイトに商品の画像ギャラリーを追加するのも良いアイデアです。

複数の画像を使用することで、商品のさまざまな特徴をアピールすることができ、WooCommerceストアのカスタマーエンゲージメントを高めることができます。

さらに、このようなギャラリーは、色、サイズ、スタイルなど、さまざまな製品のバリエーションを紹介する優れた方法でもあり、潜在的な購入者が十分な情報を得た上で決断を下すのに役立ちます。

さらに、イメージギャラリーを検索エンジンに最適化することで、サイトを上位表示させることもできます。

Envira Galleryを使えば、WooCommerceストアの商品に画像ギャラリーを簡単に追加することができます。Envira Galleryは、WordPressで完全にレスポンシブで美しいギャラリーを作成できる、市場で最高のWordPressギャラリープラグインです。

Envira Gallery website

超高速で、ライトボックスポップアップ、簡単な画像ナビゲーション、ドラッグアンドドロップビルダー、ウォーターマーク、プロフェッショナルなギャラリーテンプレートなど、多くの機能を備えています。詳細については、Envira Galleryのレビューをご覧ください。

このプラグインは商品ギャラリーをとても簡単に作成でき、商品ページを上位表示させるためのタグやタクソノミーのキーワードを追加することもできます。

詳しい説明はWooCommerce商品画像ギャラリーの作成方法のチュートリアルをご覧ください。

この投稿がWooCommerceギャラリーに商品動画を追加する方法を学ぶのにお役に立てば幸いです。また、WooCommerceでクーポンを予約する方法についてのチュートリアルや、サイトを成長させる最高のWooCommerceプラグインのトップピックもご覧ください。

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

情報開示 私たちのコンテンツは読者支援型です。これは、あなたが私たちのリンクの一部をクリックした場合、私たちはコミッションを得ることができることを意味します。 WPBeginnerの資金源 をご覧ください。3$編集プロセスをご覧ください。

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

究極のWordPressツールキット

ツールキットへの無料アクセス - すべてのプロフェッショナルが持つべきWordPress関連製品とリソースのコレクション!

Reader Interactions

1件のコメント返信を残す

  1. Syed Balkhi says

    Hey WPBeginner readers,
    Did you know you can win exciting prizes by commenting on WPBeginner?
    Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
    You can get more details about the contest from here.
    Start sharing your thoughts below to stand a chance to win!

返信を残す

コメントありがとうございます。すべてのコメントは私たちのコメントポリシーに従ってモデレートされ、あなたのメールアドレスが公開されることはありませんのでご留意ください。名前欄にキーワードを使用しないでください。個人的で有意義な会話をしましょう。