How to Add a Video Popup to Shopify (Step-by-Step Guide)

A visitor lands on your Shopify product page, skims the description, and leaves without ever scrolling down to your demo video. A video popup puts that video right in front of them instead of hoping they find it.

Shopify doesn’t have a native video popup feature, but connecting a tool like WiserNotify adds one in a few minutes. If you’re comparing platforms or want the general approach first, see our full guide on how to add a video popup to any website.

This guide covers connecting WiserNotify to your Shopify store, building the popup, and the best practices that keep it useful instead of annoying.

How to Add a Video Popup to Shopify

Watch the full walkthrough below, or follow the written steps underneath.

Step 1: Get Your WiserNotify Pixel Code

1. Sign up for WiserNotify. Create a free account at wisernotify.com, or log in if you already have one, then go to the Install Pixel page and click Copy Code.

Step 2: Add the Pixel Code to Shopify

1. In your Shopify admin, go to Online Store > Themes, click Actions on your live theme, and select Edit code.

2. Open Layout > theme.liquid, paste the pixel code right before the closing </body> tag, and click Save.

Step 3: Verify the Install

1. Visit your Shopify store once, then go back to the WiserNotify pixel page and click Verify pixel installation. You should see a “pixel code has been detected successfully” message.

Step 4: Connect Your Store for Sales Data

1. In WiserNotify, go to Shopify Integration and click Integrate, then enter your Shopify URL and click Create.

2. Log in with your Shopify email and password, click Install App, and accept the permissions.

This installs the pixel, pulls in your last 30 orders, and adds a webhook so new orders show up automatically. If you’d rather start with something simpler, adding a sold counter to Shopify uses this same connection. See the full Shopify integration guide for more detail on this step.

Step 5: Create the Video Popup Widget

1. In WiserNotify, go to the Widgets section, select Video popup from the widget options, and click Add. WiserNotify’s video popup widget guide covers every option in this editor in more depth.

2. Customize the design. Add your video, edit the popup text (dynamic placeholders like {Name} or {Product} are supported), set up a clickable CTA button with its own link and styling, and choose the position, animation, and color style for both mobile and desktop.

3. Set the timing and configure display settings. Under Timing Control, set an initial delay before the popup appears and how long it stays visible. Choose which pages it should appear on, add any advanced targeting you need, then click Save and Publish.

4. Test it on your live store. Visit your Shopify store in a private or incognito window to confirm the popup appears the way you configured it.

Troubleshooting: Popup Not Showing Up?

A few Shopify-specific gotchas cause most setup issues:

• You switched or updated your theme: the pixel code lives inside theme.liquid, so switching themes or updating your current one can remove it. Re-paste the code into the new theme’s theme.liquid file.
• You’re viewing a cached page: browsers hold onto old versions of a page. Reload with a hard refresh, or open the store in a fresh private window to see the actual current version.
• Wrong data source selected: if orders aren’t showing in notifications, go to Customize notification > Data-source in WiserNotify and make sure the Shopify integration is selected.

Still stuck? The full Shopify integration guide has more troubleshooting steps, or reach WiserNotify’s live chat support from your dashboard.

Best Practices for Creating an Engaging Video Popup

To make the most of video popups on your Shopify store, follow these best practices:

1. Keep Videos Short and Impactful

Why: Shoppers have limited attention spans, especially online.

• Create videos that are 20-50 seconds long, focusing on a single message.
• Use high-quality resolution but optimize file size to ensure fast loading.

2. Use Smart Triggers

Why: Popups that appear at the wrong time can frustrate users.

• Trigger popups when a customer scrolls halfway down a page or spends 5-10 seconds on the site.
• Use exit-intent popups to re-engage customers who are about to leave.

3. Provide Easy Dismissal Options

Why: Customers appreciate control over their browsing experience.

• Include a prominent close button on the popup.
• Allow users to close the popup by clicking outside of it.

4. Limit Popup Frequency

Why: Frequent popups can annoy visitors and increase bounce rates.

• Limit video popups to one per session or use them only on key pages, like product or checkout pages.

5. Design for Mobile Users

Why: Many Shopify customers shop on mobile devices, so popups must look great on smaller screens.

• Use responsive designs that adapt to mobile layouts.
• Test your video popup on various devices to check performance before publishing.

6. Align Popups with Your Branding

Why: Consistent branding strengthens trust and credibility.

• Match the popup design (colors, fonts, and CTAs) to your store’s overall look and feel.

7. Deliver Value Through Video Content

Why: Customers are more likely to engage with content that addresses their needs.

• Use popups for educational content, like tutorials or FAQs. Embedding testimonials on Shopify reinforces the same trust signal alongside a video.
• Share compelling testimonials or behind-the-scenes insights about your products.

8. Test and Refine Your Strategy

Why: Continuous optimization improves popup effectiveness over time.

• Use Shopify’s built-in analytics or third-party tools to track popup engagement.
• Run A/B tests on triggers, designs, and CTAs to identify what works best.

Common Mistakes to Avoid

• Autoplaying with sound on load: a video that blasts audio the moment someone lands on the page is one of the fastest ways to make them leave. Keep it muted by default.
• Firing the popup instantly: showing it before a shopper has seen any content feels like an ambush. Give them a few seconds first.
• No mobile testing: a popup that looks fine on desktop can easily cover the whole screen or break on a phone. Always check both.
• Skipping the close button: a popup a visitor can’t easily dismiss creates frustration that outweighs whatever the video was trying to sell.
• Using a huge, uncompressed video file: this slows the whole page down, not just the popup. Host it externally on YouTube or Vimeo instead of uploading it directly.

How to Measure Video Popup Performance

Shopify’s own Analytics dashboard already tracks sales and sessions by page, so pair it with your WiserNotify numbers instead of guessing.

Compare conversion rate on product pages with the popup against pages without it over a week or two.

• Popup views and CTA clicks: both in your WiserNotify dashboard, together they show whether the offer is landing.
• Close-without-interaction rate: a high number here points to timing, not the video.
• Sales by landing page in Shopify Analytics: filter to product pages running the popup to see if they’re converting better.
• Page speed: a quick before-and-after test rules out the video slowing down your store.

Change one variable at a time, timing, video, or targeting, so you know what moved the number.

Conclusion

A well-designed video popup can help your Shopify store engage customers, communicate key messages, and drive meaningful action.

Connecting WiserNotify takes a few minutes, and once it’s set up, you can build and manage the popup entirely from the dashboard without touching code.

Follow the best practices above, keep it short, well-timed, and easy to dismiss, and your video popup will add to the shopping experience instead of getting in the way.

Related Posts:

• Add Sold Counter to Shopify
• Add Announcement Bar to Shopify
• Add Testimonial to Shopify