Shoppable VideosBrandingPopupAppearance

Appearance

The popup widget is a powerful way to showcase shoppable videos while keeping your store experience seamless. To match your brand and improve usability, you can customize its design, behavior, and integrations. Below are all the available customization options, from colors and product settings to advanced CSS.

Layout

We support 2 designs:

  • Compact
  • Panel

Color

Button background color & button text color

This setting changes the color of the cart badge and add to cart button in the video player.

Button background color & button text color

Add to cart background color & text color

Activate dark mode

This setting switches the widget's background and elements to a dark theme.

Dark mode helps videos stand out more, reduces eye strain, and matches stores with darker branding styles.

Use dark mode if your website design has a dark background or if you want videos to pop. If your store design is light/bright, keep dark mode off for consistency.

Normal mode

Dark mode

Product

View the product in an external window

This option opens the product page in a new browser tab or window when a customer clicks on the linked product.

Useful if you want customers to keep watching your videos without losing their place, while still being able to check product details in a separate tab.

Enable this if your store relies on video engagement (so viewers stay on the video gallery), but avoid overusing it since too many new tabs can overwhelm users.

Player

Scroll to the next video automatically

When a video finishes, the player will automatically scroll to and play the next video in the list. Helps keep viewers engaged without needing manual clicks.

Mute the video on the first play

On the first playback, the video will start with the sound muted. This prevents sudden loud audio and improves user experience, especially on mobile or in public spaces.

Discounts

Display the discount banner

Display a banner that encourages viewers to make a purchase by offering a discount.

Display the discount banner

This discount banner shows only when you have this translation.

Change translations

Review app

We integrate with some Product reviews apps available on Shopify, discover them in this article. Find it out.

Advanced

Display video caption

Shows the caption associated with the video in the Popup player. Disable this setting when you want the player to display only the video content.

Enable picture-in-picture (PiP) control

Adds a picture-in-picture control when it is supported by the browser. Customers can keep the video in a floating window while browsing other content.

Enable M3U8 video source

Allows the Popup player to use an M3U8 video source when one is available. M3U8 files commonly contain the playlist information used for adaptive video delivery.

Enable HLS video streaming

Enables HTTP Live Streaming (HLS) playback for compatible video sources and browsers. Use this when your videos are delivered through an HLS stream.

Controls where the product page opens when a customer clicks a linked product:

  • _blank opens the product page in a new browser tab or window.
  • _self opens the product page in the current tab.

PiP and HLS playback depend on browser support and the video source configuration. Test the selected options on the devices and browsers used by your customers.

Custom CSS

An advanced option that allows you to fully customize the look and feel using CSS code.

This settings requires you to understand CSS knowledge, if you aren't, please contact us. We will support you to customize it.