Shopify guide
Shopify gives you several ways to display a popup. The right choice depends on your goal, how much customization you need and how you want to manage the message over time.
CONTEXT: PRODUCT CHOICE
A clearer way to choose.
The message supports the store without hiding the product.
See the comparisonComparing two products?
Here are the differences that can help you choose.
Understand the format
A Shopify popup is an element layered over a storefront to draw attention to information or an action: a buying guide, shipping answer, cart reminder or offer. It stays inside the page; it is not a new browser window.
Shopify Forms can create popup forms, while an app or external script can handle more contextual messages. Before choosing, separate the need to collect information from the need to help someone continue their shopping journey.
Three methods
Each method has trade-offs. Start with the level of control you actually need, not with the number of options in an app dashboard.
For a popup form, Shopify Forms lets you create the content and add it to your theme through its app embed. You stay in the Shopify ecosystem and manage the edit from the store tools.
A good fit for a simple form that should follow your theme structure.
A specialized app may offer more targeting, triggers, templates and reporting. It usually needs to be enabled in the theme with an app embed and may add its own script.
A good fit when you need several scenarios and accept another dependency to manage.
A developer can add a component or external script to the theme structure, for example through a custom-code area. This gives more control but requires more testing and maintenance.
A good fit for a specific behavior or a team that wants the logic in its own code.
Shopify use cases
The same message does not have the same value on a product page, collection or cart. Here are a few scenarios where a popup can help without interrupting the whole store.
Product page
01Offer a size guide, comparison or answer about material and compatibility when the information can remove hesitation.
Comparing two models?
See the differencesCollection
02On a page with many products, a use-case-based selection can help someone find the right starting point.
Looking for the right product for your use case?
Start the guideShipping and returns
03Cost, delivery time and return rules matter to the decision. Make the answer visible where the question comes up.
Questions about shipping or returns?
See the policyCart
04When a cart already exists, remind someone of their selection or offer a way back to the cart as they appear ready to leave.
Your selection is still here.
Return to cartExit intent
05Instead of automatically showing a discount, offer an answer, guide or alternative that matches the page being viewed.
One last question before you go?
Find the answerStep by step
Installation is easier when the scenario is defined before opening the theme editor.
Help someone choose, answer a question, return to the cart or view an offer: start with one goal.
Shopify Forms, a dedicated app or custom code: choose according to your targeting, editing and maintenance needs.
For an app embed, enable the extension in the theme editor. For code, use the location intended by your theme and back up before editing.
Limit the popup to the relevant pages and moments: arrival, scroll, delay, click, cart or exit intent.
Check mobile, closing, links, cart, checkout, frequency and speed before leaving it active across the store.
The settings that matter
A popup can be technically integrated and still get in the way of a store. These settings determine its real usefulness.
Decide whether it belongs across the store, on a collection, product, cart or specific page. Narrow targeting often creates a more relevant message.
Choose the signal that says help is useful: interaction, scroll, delay, click or exit intent.
Remember a close or response when possible and avoid repeating the same message on every page.
The button should lead to a page, comparison, cart or other clear next step. Avoid vague promises.
Official documentation
Screens can vary by theme and app. These official resources help you verify the options before changing your store.
Review the settings available for Shopify popup forms, including presentation and behavior.
Read Shopify’s help articleShopify explains how apps can add floating elements or code to a store through theme extensions.
Read the theme documentationReview the form creation flow before choosing an email-capture popup or a different contextual message.
Read the forms documentationBefore you publish
The popup should not take over the product, cart or checkout. Check the real mobile experience before adding more triggers.
Keep SEO in mind
On mobile, avoid hiding the main content behind a hard-to-close interstitial. Visitors should be able to browse the store even when the popup is not relevant to them.
Read Google’s guidanceAn app embed or script can behave differently depending on the theme, styles and other installed extensions.
The message should complement the product page and leave the price, variants and primary action accessible.
Closing should work with keyboard and touch without asking someone to understand the theme or code.
Each app can add code and maintenance. Keep only the extensions that serve a clear scenario.
A view or click does not prove usefulness. Compare behavior with the page goal and the quality of the journey.
Keep exploring
Help shoppers choose, compare and move forward.
Read the guideMethods, steps and settings for adding a useful popup.
Read the guideOffer one relevant next step before someone leaves.
Read the guideUnderstand contextual popups and choose the right moment.
Read the guideFrequently asked questions
It depends on the need. Shopify Forms can work for a popup form, a dedicated app often provides more targeting, and a script or theme code offers more control. Compare maintenance, targeting and mobile experience first.
Yes, with theme code or an external script when your setup and permissions allow it. This avoids another app, but you manage rendering, triggers, closing and updates yourself.
An app embed lets an app provide an element that appears in the theme, sometimes as an overlay or an invisible script. It usually needs to be enabled in the theme editor before it appears in the store.
Not necessarily in the same way. App embeds depend on app and theme compatibility, while custom code depends on the theme structure and styles. Test on the published theme and a duplicate before rolling it out.
It depends on script weight, the number of apps and how code loads. Limit targeting, avoid unnecessary dependencies and check the mobile journey after installation.
Not automatically. The risk mainly comes from an interstitial that hides the main content, especially on mobile, or a script that seriously harms the experience. Products and essential information should remain accessible.
Start with the right scenario
Don't Leave is designed to add contextual messages without rebuilding your store. Join early access to test the right moment with your visitors.
Request access