How to add a popup to Magento 2 and Adobe Commerce

By Mert Özeren, Customer Success Specialist at Popupsmart · Updated September 24, 2026

To add a popup to Magento 2 or Adobe Commerce without an extension, paste Popupsmart's embed code into Content → Design → Configuration → Footer → Miscellaneous HTML once. Popupsmart then loads on every page of that store view, and you build newsletter, exit-intent and discount popups in its dashboard, with nothing to install, compile or deploy in Magento.

Magento's own popup is a modal widget for theme developers, not a popup builder.

Add a popup to Adobe Commerce

Setup at a glance

Runs on: Adobe Commerce
Where the code goes: Content → Design → Configuration → Footer → Miscellaneous HTML
Add-on: No extension needed

Before you start

You need three things, and a developer isn't one of them:

Access to the Magento admin of your Adobe Commerce or Magento Open Source 2 store, with permission to edit Content → Design → Configuration.
A free Popupsmart account. The free plan covers one website and one live popup, so you can finish this guide without paying.
The address your shoppers use for the store, which Popupsmart verifies after the install.

A Magento popup from Popupsmart needs one embed code in your store's design configuration, added once, so it loads on every storefront page. After that you build, change and publish popups in Popupsmart without opening the Magento admin again.

Step 1: Create your Popupsmart account

Create your free Popupsmart account, or sign in if you already have one.

Step 2: Copy your embed code

In the dashboard, click Embed Code.

embed code

Your embed code opens in a window; copy it to your clipboard. The code is one line, <script src="https://cdn.popupsmart.com/bundle.js" data-id="…" async defer></script>, and the data-id belongs to your account.

copy new code

In the Magento admin, go to Content → Design → Configuration. Find the store view your shoppers see and click Edit in the Action column. Under Other Settings, expand Footer and paste the embed code into Miscellaneous HTML, below anything already in the field. Click Save Configuration.

Magento prints Miscellaneous HTML just before the closing </body> tag, on every page of that store view. If the field is greyed out, clear its Use Default Value box first. If you run more than one store view, add the code to each one; when I set this up with a customer, I paste it into every store view before verifying anything, so no storefront is left without it. The Scripts and Style Sheets field under HTML Head works too; the footer is the usual place for a script that doesn't need to load first.

If Magento then reports that a cache is invalidated, flush it under System → Cache Management so shoppers get the updated pages.

Step 4: Add and verify your store

Back in Popupsmart, hover over the profile icon at the bottom left and click Websites.

websites popupsmart

Click + New Website.

new website popupsmart

Type your store's address into the Add a new website box and click Save.

adding new ac site

Once Popupsmart finds the code, the store shows as Verified on the Websites page.

verified adobe commerce

If it shows as Unverified, click Unverified, then Verify website, and go back to the dashboard and click Refresh. The guide to verifying your website covers the other cases.

On the dashboard, click New Campaign, name it, choose your store and pick a template. Change its copy, colours and form fields to match your store, and save.

new campaign

Go to the Publish step and click Publish. Then open your store in a private window and load a storefront page. The popup appears when its trigger fires.

publish adobe commerce

Not one a merchant can build in the Admin. The popup in Adobe's documentation is the modal widget, a JavaScript component for theme developers: according to Adobe's modal widget reference, it "implements a secondary window that opens on top of the main window", and code opens it. For signups, Magento has its own newsletter, set up under Stores → Settings → Configuration → Customers → Newsletter; Adobe's newsletter guide covers double opt-in (Need to Confirm) and Allow Guest Subscription.

	Magento's built-in tools	Popupsmart
What you get	A modal widget for theme code, and a newsletter module	A popup editor with templates
Setup	A developer initializes the widget in JavaScript	One line in Miscellaneous HTML, from the Admin
When it opens	When your code calls it	Exit intent, scroll depth or time on page, with URL and device rules
Where signups go	Magento's newsletter subscribers, with optional double opt-in	The help center lists 19 destinations, including Klaviyo and Mailchimp; Magento isn't one of them
A/B testing	Not documented	From the Advanced plan
Price	Part of Magento Open Source and Adobe Commerce	Free plan: one website, one live popup, 5,000 pageviews a month; paid plans from $39 a month

Magento's own tools are enough when a developer maintains your theme and you send newsletters from Magento itself. Popupsmart earns its install when marketers need to change an offer, its pages and its trigger without a deploy, or when the list lives in an email tool such as Klaviyo or Mailchimp.

A Magento 2 newsletter popup without an extension is a Popupsmart campaign with an email field, connected to the email tool that sends your newsletter. Start from a newsletter template, keep its email input, set the trigger, then connect your email tool in the campaign's Integration section. The embed code in Miscellaneous HTML stays the only change to the store.

Magento isn't one of the 19 destinations Popupsmart's help center lists, so the popup's subscribers don't join Magento's own newsletter list. When I set up a newsletter popup on a Magento store, the first question I ask is which tool sends the newsletter. If Magento sends it, keep Magento's own signup for that list. If Klaviyo, Mailchimp or another tool sends it, connect that tool and set double opt-in there.

The Klaviyo popup guide and the Mailchimp popup guide walk through a connection; a webhook, Zapier or Make covers a tool that isn't on the list.

A Magento 2 exit-intent popup is a Popupsmart campaign whose trigger is exit intent: it opens when a shopper moves to leave the page. Pick a template, choose exit intent in the campaign's targeting and, if you like, add a URL rule so it only runs on the cart page. The exit-intent popup recipe has a ready setup.

Across 500 Popupsmart campaigns analysed in 2026, 95.4% fire as soon as the page loads and only 2.0% use exit intent, according to the exit-intent study. When a popup fires is the setting most people leave on default, and on a store it decides whether an offer interrupts browsing or reaches a shopper on the way out.

Leave the embed code in the footer configuration and choose the pages in Popupsmart. The code only loads Popupsmart; which pages show a popup is a targeting rule on each campaign, such as "the URL contains /checkout/cart" or "the visitor is about to leave". You can move a popup to other pages, or to other visitors, without going back to the Magento admin. The help center explains each rule in Popupsmart's targeting options.

A Magento 2 popup extension runs inside your store; Popupsmart runs beside it, from one line of code. If one simple modal is all you need, an extension may be enough. The trade-offs:

Installing. Adobe's extension installation guide adds an extension with Composer and the command line (composer require, bin/magento setup:upgrade, setup:di:compile, a static content deploy), with maintenance mode switched on first. Popupsmart is one field in the Admin, with nothing to compile.
Upgrading Magento. An extension is code in your store, so each Magento upgrade has to work with it, on every store you run. Popupsmart's script isn't part of the Magento code base, though a stricter Content Security Policy can still block it on checkout pages, as below.
Cost. Each vendor sets its extension's price. Popupsmart has a free plan and paid plans from $39 a month, priced by pageviews rather than by contacts.
Reach. An extension built for Magento can work next to its newsletter module. Popupsmart doesn't add subscribers to Magento's own list, but one account covers your sites that aren't on Magento: 3 websites on the Basic plan, unlimited on Expert.

Start from the job the page has, from the category page to the cart:

A reminder before a cart is left behind: the cart abandonment popup recipe.
A discount once the cart passes a value: the cart-value discount popup recipe.
Free shipping in exchange for an email: the free shipping popup recipe.
A Magento newsletter popup on product and category pages: the email popup guide.

A Popupsmart popup doesn't hold up your Magento pages: the embed code loads asynchronously (async defer), so the browser finishes building the page before it fetches Popupsmart. Nothing is added to the Magento side: no module runs when a page is rendered, and there is nothing to compile or deploy.

The code is on another store view. Design configuration is set per store view. Check that the store view your shoppers see has the code in Miscellaneous HTML.
A cache is serving old pages. Flush the cache under System → Cache Management, and clear your CDN's cache if you use one.
The website isn't verified. A campaign runs only on a verified website; see Step 4.
The address doesn't match. www.example.com and example.com are different sites to a browser. Add the address your shoppers actually use.
The Content Security Policy blocks it on checkout. Adobe's page setup guide says JavaScript in Miscellaneous HTML runs on checkout pages only when it is whitelisted in the Content Security Policy, and from version 2.4.7 that policy runs in restrict mode on payment pages by default. Ask your developer to add Popupsmart's domains, starting with cdn.popupsmart.com.
The trigger hasn't fired yet. An exit-intent or scroll trigger waits for the visitor to leave or scroll; test in a private window and behave like a shopper.

💬

From the support queue: On a Magento store, what I check first is the store view. Design configuration is saved per store view, so code pasted into one doesn't reach another, and the popup looks broken on the storefront your shoppers use. Then I flush the cache under System → Cache Management and load the page in a private window. Checkout gets its own check, because the Content Security Policy decides whether the script runs there.

Still stuck? Contact Popupsmart support with your store's address and the campaign name.

Yes. Popupsmart's free plan is permanent, not a trial: one website, one live popup and 5,000 pageviews a month, with Popupsmart branding. It is enough to install the code and run your first popup on an Adobe Commerce or Magento Open Source store.

The Popupsmart pricing page compares it with the paid plans.

Extension vendors set their own prices, so check the extension's Adobe Commerce Marketplace listing for its current price and the Magento versions it supports. Popupsmart isn't an extension: it runs from the embed code, and its free plan needs nothing installed in Magento.

Does this work on Magento Open Source 2?

Yes. Magento Open Source 2 has the same Content, Design, Configuration screen with the same Miscellaneous HTML field, so the steps don't change.

Yes, but the setting lives where the list lives. Magento's own newsletter uses Need to Confirm under Stores, Settings, Configuration, Customers, Newsletter. A Popupsmart popup hands the subscriber to your email tool, and that tool's list settings decide whether a confirmation email goes out.

No. You paste one line of code into an admin field once. Everything else, from the design to the targeting, happens in Popupsmart's visual editor.

How to add a popup to Magento 2 and Adobe Commerce

Before you start