Getting Started

Welcome to Product Videos for WooCommerce! This guide will walk you through the essential steps to get up and running, so you can start captivating your customers with engaging product videos.

Installation

  1. Download the plugin: After your purchase, you’ll receive a .zip file.
  2. Log in to your WordPress dashboard.
  3. Navigate to Plugins > Add New.
  4. Click “Upload Plugin” and select the .zip file you downloaded.
  5. Activate the plugin.

Once activated, you’ll find a new “Product Videos” section under WooCommerce > Settings > Products.

Adding Your First Product Video

There are two primary ways to add videos to your products:

This is the main video for your product and will be displayed prominently on the product page.

  1. Go to the product edit screen for any of your WooCommerce products.
  2. On the right-hand side, you’ll see a “Product Video” metabox.
  3. Click “Select a Product Video” to open the WordPress Media Library.
  4. Upload your video (we recommend MP4, WebM, or OGG formats).
  5. Click “Use this video” to assign it to your product.
  6. Update your product.

You can also add videos to your product gallery, allowing customers to view multiple videos and images.

  1. On the product edit screen, find the “Product gallery” metabox.
  2. Click “Add product gallery media”.
  3. Upload your video to the Media Library.
  4. Add it to the gallery just like you would with an image.
  5. Update your product.

Configuration

Now that you’ve added some videos, let’s explore the key settings to customize the video experience for your customers.

Navigate to WooCommerce > Settings > Products > Product Videos.

{INSERT SCREENSHOT HERE OF THE PRODUCT VIDEOS SETTINGS PANEL IN WOOCOMMERCE}

Single Product Page Settings

  • Auto-play Main Product Video: Automatically play the featured video when a customer visits the product page. (Note: Videos will be muted due to browser policies).
  • Show Video Player Controls: Display controls like play, pause, and volume on your gallery videos.

Shop & Archive Page Settings

  • Replace Product Images with Videos: On your main shop page and category pages, show a product’s featured video instead of the static product image.
    • Performance Note: We automatically lazy-load these videos! This means they won’t slow down your initial page load. The video file is only loaded when the customer interacts with it.
  • Auto-play on Hover: When a customer hovers their mouse over a product, the video will automatically start playing.
  • Keep Videos Muted: Ensure videos on the shop page start without sound.
  • Show Video Player Controls: Display video controls on the shop page.
  • Video Display Style:
    • Show complete video: The entire video will be visible, which may result in black bars.
    • Fill image space: The video will fill the entire product image area, which may crop the edges of the video.

Next Steps

Now that you’ve got the basics down, here are a few other things you might want to check out:

Was this page helpful?
Yes No