for WooCommerce

Guides · 7 min read

WooCommerce product video without YouTube

Pasting a YouTube link is the quickest way to put a video on a product page. It is not always the best one for a store. Here is what an embed costs, what self-hosting costs, and how to do self-hosting well.

What a YouTube embed brings onto your product page

An embed is someone else's player inside an iframe on your page. That has consequences a product page feels more than a blog post:

  • Their brand, their suggestions. The shopper sees the YouTube player and logo, and when the clip ends, more videos. One click on the logo takes them to youtube.com, away from the Add to cart button.
  • Their scripts. The iframe loads the service's player code on every product page that shows it. Lazy-loading the iframe helps, but the weight is still there when it loads.
  • Their cookies. A standard YouTube embed can set the service's cookies. Under the GDPR that usually means asking for consent before it loads, so many stores end up showing a consent placeholder where the video should be. The privacy-enhanced youtube-nocookie.com mode reduces this but does not make the player yours.
  • Their availability. If the video is removed, made private, blocked in a country or the service is down, the gallery slide is empty.
  • It does not look like a gallery slide. A 16:9 player with its own controls sits awkwardly next to square or portrait product photos.

What self-hosting costs instead

A self-hosted video is a file in your own uploads folder, played by a player served from your site. You get your own look, no third-party cookies and no outside dependency. In exchange you take on three jobs:

  • Encoding. A phone recording is often 50–200 MB in a format not every browser plays. It has to be converted to web formats and a sensible size.
  • Storage and bandwidth. The files live on your hosting and are served from it, or from your CDN.
  • A poster image, so the slide looks right before the video plays.

For short product clips all three are small. The 8-second clip in the demo store started as a 5.2 MB file and became a 2.9 MB MP4 and a 4.6 MB WebM. The shopper's browser downloads one of the two, and only when the slide is shown.

Settings that work for product video

FormatsMP4 (H.264) plays everywhere; add WebM (VP9 or VP8) as an alternative and let the browser choose. Which file is smaller depends on the clip.
Resolution720p, or 1080p for large galleries. 4K is wasted in a gallery under 1000 pixels wide.
Length10–30 seconds. Long tutorials belong on a separate page, or on YouTube.
QualityWith FFmpeg, a CRF of about 23–28 for H.264 keeps short clips at a few megabytes. Higher CRF means a smaller file.
AudioOften none. Phones autoplay only muted video, and removing the track saves weight.
PosterA frame from the clip, saved as an image, shown until the video plays.
AutoplayMuted, looped and playsinline, so it starts on phones without going full screen.

Doing this by hand means running FFmpeg for every clip and pasting the file URLs into your theme. Magic Product Video does it for you: upload a clip once and it creates the MP4, the WebM and the poster, then shows them as a slide in the WooCommerce gallery.

When YouTube is still the right choice

  • Long videos, reviews and tutorials that would be heavy to host yourself.
  • Videos you want people to find on YouTube itself, as a marketing channel.
  • Hosting with very little storage or bandwidth.

Many stores do both: a short self-hosted clip in the gallery, where the decision is made, and the long version on YouTube, linked from the description.

Side by side

Self-hostedYouTube or Vimeo embed
Where the file livesYour uploads folderThe service's servers
What the shopper seesYour clip, your player, no logoThe service's player, logo and suggestions
Scripts on the pageA small player from your siteThe service's iframe and scripts
CookiesNone from the videoThe service's cookies, usually behind consent
If the service is downNot affectedThe slide is empty
Your workEncoding and storage (a plugin can do it)Upload to the service, paste a link