|  Pipeline theme
Pipeline v6
Search…
⌃K
Links

Video

Pipeline's powerful block-based video section with flexible options to display video, headings and text. Fully customizable, packed with options.
Display a banner-style looping MP4 video for desktop and mobile. Customize with optional blocks to display text, headings, buttons, and pop-up YouTube or Vimeo videos:

Section settings

Use the section settings to configure from a range of options including section height, optional MP4 video, video positioning, background image, and additional layout settings:

Section height

Select from different height options to build the banner-style section:
Tip: Use the Image height setting to view the entire image without any cropping. Especially helpful for mobile devices. All other height options will automatically crop and position the video or image based on position and height settings selected.

Background video

Used to display a looping MP4 video. Shopify currently only recommends using MP4 videos for theme sections. YouTube and Vimeo videos are only supported in a pop-up modal. The looping video will automatically play on modern browsers including mobile devices.
An optional play-styled button (shown below) can be used to enable the customer to watch a longer version of the video on YouTube or Vimeo in a pop-up modal window.
Optional Play Button for Pop-up Modal
To display a looping video, use a video editor like iMovie on a Mac or the Windows Movie Maker to crop your brand or product video to about 10-15 seconds or less. You can extend the video longer. However, keep in mind more prolonged videos will take longer to load which can cause an adverse effect on your customer's experience.
Export your cropped video to a compressed MP4 format and upload it to your Shopify Files in the main Shopify Admin:
Choose Settings
Upload the video to the Files area
After uploading your video, use the Filter files search area to locate your MP4 files and then click on the Link button to capture the URL to the video file:
Copy link to MP4 video
Paste the URL to your section settings:

Background image

The Background Image option has two purposes, it will display the selected image while your MP4 video is loading or it will be used as a still image banner if you don't use an MP4 video.
When using an MP4 video:
  • The Background image is loaded first and is displayed while the video is loading.
When not using an MP4 video:
  • The Background image is used similarly to a banner image where text, heading, and the Play button are overlayed.
We recommend you always choose a Background image when using the Video section

Blocks

Add blocks to the section to include Pipeline's kicker which is a styled small heading, a larger heading, call-to-action buttons, spacers, and a pop-up video play button option.
Kicker
Styled sub-heading text
Heading
Large headline
Text
Description content
Video popup
YouTube or Vimeo modal player
Buttons
Call-to-action links
Spacer
Adds a line or spacing between blocks

YouTube and Vimeo

Add the Video popup block to play YouTube or Vimeo videos with audio support. Since modern browsers block autoplay videos, we provide the MP4 option for a looping video effect. If you need to play a YouTube or Vimeo video, use this block to provide a longer streaming video to your customers.
Add the URL to YouTube or Vimeo video into the Video popup link field:
Customize the Play button size and color, and add optional supporting text:
The YouTube or Vimeo video will pop up in a modal window and play with full audio support:
Video popup modal

Buttons

Add call-to-action buttons with the Button block:
Choose from different button styles
Each button block can display up to three buttons in a row. These will be stacked on mobile.

Spacer

The spacer block can be used to add separation between blocks. An optional line can be displayed:

Text, Header, Kicker

These text-based blocks help you customize the messaging over the video section. Use block order to position them and add multiple blocks for additional content.