Video Section

Feature video content from YouTube, Vimeo, or Shopify-hosted videos.

Adding the Section

1. Open the theme editor
2. Click Add section
3. Select Video

Video Sources

YouTube or Vimeo

1. Find the Video URL field
2. Paste your video URL

Supported formats:

• YouTube: https://youtube.com/watch?v=VIDEO_ID
• YouTube: https://youtu.be/VIDEO_ID
• Vimeo: https://vimeo.com/VIDEO_ID

Shopify-Hosted Video

1. Click Select video
2. Upload or choose from Files
3. Supports MP4 format

Shopify-hosted videos load faster and don't show third-party branding.

Video Style

| Style | Behavior | |-------|----------| | Ambient | Autoplay, muted, looped (background style) | | Normal | Click to play with controls |

Ambient Videos

Best for:

• Background atmosphere
• Short loops
• No audio needed

Normal Videos

Best for:

• Product demonstrations
• Brand stories
• Content with audio

Aspect Ratio

Control video proportions:

| Ratio | Use Case | |-------|----------| | 16:9 | Standard widescreen (default) | | 4:3 | Classic video format | | 1:1 | Square (Instagram style) | | 9:16 | Vertical/portrait | | 3:2 | Photography ratio |

Layout Options

Full Width

Toggle to extend video edge-to-edge.

Heading

Optional title above the video.

Alignment

Align heading: Left, Center, or Right.

Cover Image

For normal-style videos:

1. Click Select image for cover
2. Choose a thumbnail
3. Displays before video plays

If no cover image is set, YouTube/Vimeo shows their default thumbnail.

Player Controls

For normal videos:

• Play/pause button
• Progress bar
• Volume control
• Fullscreen option

For ambient videos:

• No visible controls
• Video plays automatically

Color Scheme

Apply styling for:

• Background around video
• Heading text color

Best Practices

Video Quality

• Upload high-resolution videos (1080p minimum)
• Optimize file size for web
• Test playback on various connections

Ambient Videos

• Keep under 30 seconds
• Ensure seamless loop
• No jarring cuts or flashes
• Works without sound

Normal Videos

• Include captions/subtitles when possible
• Start with engaging content
• Keep under 2-3 minutes for product videos

Performance

• YouTube/Vimeo are more bandwidth-efficient
• Shopify videos load faster initially
• Large files can slow page load

Use Cases

Product Demo

• Normal style with controls
• Cover image showing product
• 16:9 aspect ratio

Brand Video

• Full width layout
• Cinematic 16:9 ratio
• High production value

Background Ambiance

• Ambient style
• Subtle movement
• Complements page content

Mobile Considerations

• Videos are responsive
• Autoplay may be blocked on some mobile browsers
• Cover images display when autoplay fails
• Consider mobile data usage