Product Media
Stamina renders every media type Shopify supports on a product, from one shared gallery. The product gallery and the Featured product section use the same renderer, so a media item behaves the same wherever it appears.
Supported Media Types
Section titled “Supported Media Types”| Type | Where it comes from | How Stamina renders it |
|---|---|---|
| Image | Product media | The gallery image. The first image is loaded eagerly; the rest load lazily. |
| Video | Product media (Shopify-hosted file) | A native player with controls. Nothing is preloaded. |
| External video | Product media (YouTube or Vimeo URL) | A poster image with a play button. The provider’s player is only built when the shopper presses play. |
| 3D model | Product media (model file) | An interactive viewer the shopper can drag to rotate. |
Uploading Media
Section titled “Uploading Media”Media is attached to the product itself, not to the theme:
- In the Shopify admin, go to Products and open the product.
- In the Media area, add images, video files, external video URLs, or 3D model files.
- Drag the items into the order you want. The first item is the one the gallery opens on, unless a variant has its own featured media.
Assign featured media per variant if you want the gallery to follow the variant picker.
External Video Loads on Click
Section titled “External Video Loads on Click”External video is poster-first. The slide ships a poster image and a play button, and the provider’s player is held in an inert template until the shopper actually presses play — no player is requested before that. Leaving the slide tears the player back down and restores the poster.
In the product gallery the poster is taken automatically from the preview image Shopify stores for the external video. In the Video block, the poster is a setting you fill in yourself, and it is strongly recommended: it paints immediately, keeps the layout stable, and is what the shopper presses.
Give external videos an accessible title as well, so screen reader users know what the embed is.
3D Models
Section titled “3D Models”A 3D model renders as an interactive viewer that the shopper drags to rotate. Upload models as .glb files.
The viewer libraries are not loaded with the page. They are requested once, the first time a 3D slide is actually on screen. If those libraries cannot load, the gallery keeps working as an image gallery rather than breaking.
Reduced Motion
Section titled “Reduced Motion”Stamina respects the visitor’s reduced-motion preference:
- Hosted video with autoplay enabled never starts autoplaying under reduced motion. Controls stay available so the shopper can play it themselves.
- Gallery slide changes jump directly instead of animating.
- The play button on a video poster drops its hover animation.