How to Use Video Testimonials on Product Pages

The Video testimonials block adds a row of round video thumbnails to your product page. When a shopper taps one, a reels-style player opens in the corner of the screen with a Shop button for the product.

There are two ways to add videos. Pick one:

  • Block settings — the fastest way. Add up to 4 videos directly in the theme editor. No admin setup at all, so you can skip to Step 5.
  • Product metafield — for an unlimited number of videos, reused across products and managed from your admin. Follow every step below.

Screenshot: the finished block on a live product page

Step 1: Create the metaobject definition

Before showcasing product testimonials, create a custom metaobject definition in your Shopify admin. This holds one testimonial — a thumbnail image paired with a video.

Step 1.1 — In your Shopify admin, go to Settings > Metafields and metaobjects. Select the Metaobjects tab, then click Add definition.

Step 1.2 — Name the definition Video testimonial and add exactly two fields:

Field nameField typeRequired
ImageFile — accepts images onlyOptional, but recommended
VideoFile — accepts videos onlyRequired

Important: the field keys must be image and video. Shopify creates the key from the name you type, so naming the fields Image and Video gives you the right keys. Click each field to confirm the key before saving — a different key such as thumbnail or video_file will not be read by the theme.

If you leave the image empty, the theme uses the video’s own preview frame as the thumbnail.

Step 2: Create the product metafield definition

This connects the metaobject to your products so the theme can read the data.

Step 2.1 — In your Shopify admin, go to Settings > Metafields and metaobjects. Select the Metafields tab, then select Products.

Step 2.2 — In Product metafield definitions, click Add definition.

Step 2.3 — Configure the definition:

  • Name: Video testimonials
  • Namespace and key: custom.video_testimonials
  • Type: Metaobject > Video testimonial, with List of entries turned on

Important: it must be a list of entries. A single-entry metafield will not work, because the theme reads a list.

Write the namespace and key down exactly as you typed it — you will need it again in Step 5.

Step 3: Add testimonial entries

Each entry represents one testimonial — a thumbnail image paired with a video file.

Step 3.1 — In your Shopify admin, go to Content > Metaobjects. Select the Video testimonial definition, then click Add entry.

Step 3.2 — Upload the two files:

  • Image — the circular preview shoppers click to open the video.
  • Video — an MP4. Portrait videos (9:16, like a reel) fit the player best. Keep the file small so it starts quickly; the theme does not download any video until a shopper opens the feed.

Save the entry and repeat for each testimonial. The same entry can be reused on as many products as you like.

Step 4: Link testimonials to a product

Once you have entries, connect them to a product through the product metafield.

Step 4.1 — Go to Products and open the product you want to add testimonials to.

Step 4.2 — Scroll down to the Metafields section. Find Video testimonials (custom.video_testimonials) and click to edit it.

Step 4.3 — Select the entries you want and save. The order you set here is the order shoppers see.

Step 5: Add the block in the theme editor

Step 5.1 — Go to Online Store > Themes > Customize and open a product page.

Step 5.2 — In the Product information section, click Add block and choose Video testimonials.

Step 5.3 — Set Videos from:

  • Block settings — upload up to 4 videos right here. Each one takes a Video (or a YouTube / Vimeo Video URL) and a Thumbnail image.
  • Product metafield — type your namespace and key into the Metafield box.

Important: if you used custom.video_testimonials in Step 2, you must type custom.video_testimonials into the Metafield box. The box comes preset to custom.video_testimonials, and leaving it that way means nothing will show on the product page.

Step 5.4 — Click Save.

Step 6: Style the block

All of these are optional — the defaults work out of the box.

SettingWhat it does
HeadingText above the thumbnails. Leave it empty to hide it.
Thumbnail shape/sizeCircle, rounded or square, from 50px to 120px.
Ring thickness/colourThe ring around each thumbnail. Set the thickness to 0 to remove it.
Player positionBottom right or bottom left of the screen.
Player shapePortrait 9:16 (reels), Portrait 4:5, Square, or Custom height. Anything but Custom keeps the video from being cropped, so use Custom only when you need an exact height.
Player widthSet separately for desktop and mobile.
Shop button labelThe text on the button over the video.
Start mutedLeave this on. Browsers block sound until a shopper taps the sound button anyway.

Screenshot: the block settings panel in the theme editor

What shoppers can do

  • Hover a thumbnail on desktop to see the video preview play in place.
  • Tap a thumbnail to open the player.
  • Swipe up and down, scroll, use the arrow buttons, or use the arrow keys to move between videos.
  • Tap the sound button to turn audio on, and the play button to pause.
  • Tap the Shop button to go to the product.

The page stays usable while the player is open — it floats in the corner rather than blocking the screen.

Screenshot: the open player with the product card

Troubleshooting

Nothing shows up on the product page

  1. Does the product actually have entries in its Video testimonials metafield? The block hides itself completely when there is nothing to show.
  2. Does the Metafield box in the theme editor match your namespace and key exactly (custom.video_testimonials)?
  3. Is the metafield a list of entries rather than a single entry?
  4. Are the metaobject field keys exactly image and video?
  5. Is the metaobject definition’s storefront access enabled, so the theme is allowed to read it?

The sound and pause buttons are missing. That video is a YouTube or Vimeo link. Those play inside the provider’s own player, which the theme cannot control. Upload the video file instead if you need those buttons.

There is no sound when the video opens. That is normal. Every browser blocks sound on autoplay, so the shopper taps the sound button.

The video looks cropped or has black bars. Set the player shape to match your footage (9:16 for reels) instead of Custom height.

The player is hidden behind something. An app widget or a sticky bar is sitting on top of it. Move the player to the other corner, or ask the app’s support to lower its layer.

Last updated on September 15, 2026

Was this article helpful?

PREVIOUS

How to Set Up a Product Bundle on the Product Page

Powered by Support Genix