1. What is Video looping?
The Video looping section is the feature that showcases videos along with products featured in those videos, allowing customers to shop directly while watching intuitive videos. Besides, a looping effect is added to videos, making them catchy, dynamic, and hard to ignore.
Video shopping vs video looping: What's the difference?
Basically, these two sections serve the same purpose, but the video looping provides a more dynamic sliding effect for the videos, making the center video more eye-catching.
The video shopping section’s look:
2. Section Components
| Section | Video looping | Showcase videos with a looping effect. |
|---|---|---|
| Available block | Shoppable video | Used to add a separate video and with products for users to shop directly. |
3. Location & Setup
To add and set up the Video looping section:
- Open the Shopify Theme Editor (Online store > Themes > Customize)
- Decide where you want to place the new section.
- Click "Add Section".
- Select "Video looping".
4. Highlight Features
- Auto-looping videos: Capture attention with videos that play on repeat.
- Shop the look: Integrate products and sell directly from the videos.
- Add social proof: Attach social media info like username, post link, caption and more.
5. Common Use Cases
🤔 How to set up Video looping section?
Want to set up Video looping section? Here's how:
STEP 1: Add the section
Add the Video looping section.
STEP 2: Set up a Shoppable video block
Click on a Shoppable video block to open its settings panel, and:
- Click "Select" to add your Video (or embed a video from YouTube or Vimeo).
- Assign your Product under the First product setting group.
- You can add up to 5 products for a video under the Second product, Third product, Fourth product, and Fifth product setting groups.
Repeat this step for other blocks.
STEP 3: Customize the section's overall look.
Click on the Video looping section to open its settings panel, and:
- Edit the Heading if you want to.
- Under the Shoppable video setting group, choose where to place your product card in the Product card position.
- Change the Colors of the section elements you want.
- Choose to show the section divider, adjust the padding, block spacing, and make the section full width for desktop 🖥️ and mobile 📱 layout.
STEP 4: Click "Save" when done.
🤔 How to adjust the carousel effect of Video looping?
Click on the Video looping section and find the Carousel setting group in the setting panel:
To enable carousel on mobile:
The Video looping section automatically showcases in a carousel layout on desktop.
However, to enable carousel on mobile devices, in the Video looping settings panel, you need to Enable swipe on mobile.
| Video looping on mobile | Video looping when enabling swipe on mobile |
|---|---|
 |
 |
- To make the videos slide automatically: Turn on Enable auto-play.
- To show the arrows so customers can click to see the next videos: toggle "Next/Previous arrows".
- To show pagination at the bottom of the video: toggle "Show pagination".
Click "Save" when done.
🤔 How to use Shop the look feature inside Video looping section?
In the Shoppable video block, if you have more than 1 product, the list of products will be shown in a pop-up instead of covering the video card.
Therefore, the customers can experience the products more easily with a Shop the look feature inside this pop-up.
STEP 1:
Click on the Video looping, under Shoppable video, and turn on Enable hotspots in the look.
STEP 2:
Click on a Shoppable video block, then find the Shop the look in video, and upload an Image you want to use as the main image.
STEP 3:
Adjust the hotspot position for each product on both 🖥️ Desktop and 📱 Mobile by changing these four settings under the right group:
- Hotspot desktop horizontal position
- Hotspot desktop vertical position
- Hotspot mobile horizontal position
- Hotspot mobile vertical position
STEP 4: (Optional) Choose colors for hotspot
Still in the Video looping section > go to Colors setting group > choose your Hotspot color (light/dark).
STEP 5:
Click "Save" when done.
🤔 How to add social media information to the Video looping pop-up?
Want to showcase social media information in the pop-up when customers click on the video? Here's how:
STEP 1: Click on the Shoppable video block, and find the Social accounts setting group.
STEP 2: Choose the Integrated social media from the list to show its platform icon.
STEP 3: Type in your Account username.
STEP 4: Add a link to your Social account URL.
STEP 5: Add the content to the Social post field.
STEP 6: Click "Save" when done.
6. Support Information
Need help? Contact our support team at Omni Themes Support.
