How to Add Video to WooCommerce Product Gallery (Step-by-Step Guide)
Product videos have become one of the most effective ways to increase customer engagement and boost conversions in WooCommerce stores. While high-quality images are essential, videos allow customers to see products in action, understand their features, and make more informed purchasing decisions.
Unfortunately, WooCommerce does not include built-in support for product gallery videos. By default, you can only add images to the product gallery. To display videos alongside product images, you’ll need to use a plugin, theme feature, or custom development.
In this guide, you’ll learn several methods to add videos to your WooCommerce product gallery and achieve a professional product presentation.
Why Add Videos to Your Product Gallery?
Before diving into the setup process, let’s look at the benefits:
Increase Customer Confidence
Videos demonstrate how products work in real-world situations.
Improve Conversion Rates
Many studies show that product videos can significantly increase purchase decisions.
Reduce Returns
Customers gain a better understanding of the product before purchasing.
Enhance User Experience
Interactive galleries keep visitors engaged longer.
Goal: Display Videos Alongside Product Images
By the end of this tutorial, you’ll be able to:
- Add YouTube videos to product galleries
- Add Vimeo videos to product galleries
- Upload self-hosted MP4 videos
- Display video thumbnails with product images
- Create a more engaging shopping experience
Method 1: Using a WooCommerce Product Video Plugin (Recommended)
This is the easiest and most reliable method.
Step 1: Install a Product Video Plugin
Navigate to:
WordPress Dashboard → Plugins → Add New
Search for a WooCommerce video plugin such as:
Install and activate the plugin.
Step 2: Edit Your Product
Navigate to:
Products → All Products
Open the product where you’d like to add a video.
Step 3: Locate the Video Settings
After activation, most plugins add a new section such as:
- Product Video
- Video Gallery
- Featured Video
within the Product Data panel.
Step 4: Add Your Video
For YouTube
Paste the YouTube URL:
https://www.youtube.com/watch?v=XXXXXXXX
For Vimeo
Paste the Vimeo URL:
https://vimeo.com/XXXXXXXX
For Self-Hosted Videos
Upload an MP4 file through the Media Library and select it.
Step 5: Configure Display Options
Most plugins allow you to:
- Show video as the first gallery item
- Show video after product images
- Enable autoplay
- Enable lightbox viewing
- Display custom thumbnails
Choose your preferred settings.
Step 6: Update the Product
Click Update.
Visit the product page and verify the video appears alongside gallery images.
Method 2: Add Video Using Themify Builder Pro
If your website uses Themify Ultra or Shoppe with custom product templates, you can display videos using the Builder Pro.
Step 1: Edit the Product Template created via Themify Builder Pro
Open the Product Template.
Step 2: Add a Video Module
Click:
+ Add Module → Video
Step 3: Insert the Video Source
Choose one of the following:
YouTube
Paste the YouTube URL.
Vimeo
Paste the Vimeo URL.
Self-Hosted Video
Upload an MP4 file.
Step 4: Customize the Layout
Configure:
- Video width
- Thumbnail image
- Autoplay settings
- Responsive behavior
Step 5: Save the Template
Save and publish the template.
The video will now appear on product pages.
Important: This method displays videos on the product page but typically does not place them inside the WooCommerce gallery thumbnails.
Method 3: Use WooThumbs for a Professional Gallery Experience
For stores that require a premium gallery experience, WooThumbs is a popular option.
Benefits
- Video thumbnails within gallery sliders
- Zoom support
- Lightbox support
- Mobile-friendly galleries
- YouTube integration
- Vimeo integration
- Self-hosted video support
Setup Process
Install WooThumbs
Activate the plugin.
Open Product Editor
Edit your desired product.
Add Video
Locate the WooThumbs settings panel.
Configure Gallery Position
Choose:
- First gallery item
- Last gallery item
- Custom position
Save Changes
Update the product.
Your gallery now contains both images and videos.
Method 4: Add Videos Through Custom Development
Advanced users can customize WooCommerce galleries using hooks.
Common hooks include:
woocommerce_product_thumbnails
woocommerce_before_single_product_summary
woocommerce_single_product_image_thumbnail_html
Developers can inject custom video thumbnails and lightbox functionality.
This approach is recommended only if:
- You are comfortable with PHP.
- You maintain a child theme.
- You need complete control over the gallery.
Best Practices for Product Videos
Keep Videos Short
Aim for:
- 30–90 seconds for product showcases
- 2–3 minutes for demonstrations
Use High-Quality Thumbnails
Custom thumbnails improve click-through rates.
Optimize Video Size
Large video files can slow down page loading.
Recommended:
- MP4 format
- H.264 encoding
- Compressed files
Host Videos Externally
YouTube or Vimeo often provides better performance than self-hosting.
Mobile Optimization
Ensure videos:
- Scale correctly on mobile devices
- Do not autoplay with sound
- Load efficiently on slower connections
Troubleshooting Common Issues
Video Not Appearing
Check:
- Plugin activation
- Correct video URL
- Product update completed
Video Thumbnail Missing
Verify:
- Thumbnail settings in plugin
- Featured image configuration
Slow Product Page
Optimize:
- Video size
- Hosting method
- Caching plugin settings
Theme Compatibility Issues
Test:
- Default WooCommerce template
- Theme overrides
- Plugin conflicts
Adding videos to your WooCommerce product gallery can significantly improve product presentation, customer engagement, and sales conversions.
For most store owners, using a dedicated WooCommerce product video plugin is the fastest and easiest solution. If you’re using Themify Ultra or Shoppe, you can also add videos through the Builder, although they may not appear directly inside the gallery thumbnails without additional plugins.
By following the steps outlined in this guide, you can successfully integrate videos into your WooCommerce product pages and create a more compelling shopping experience for your customers.
