Skip to content
Platforms · 7 min read

Magento 2 push notifications

Magento 2 gives you full control of your web root, so web push works without an extension. The only twist is finding the real root when your server points at pub/.

Updated By the Pusharoo team
In short
  • Put sw.js wherever https://yourstore.com/sw.js is served from — often the pub/ folder.
  • Add the snippet in Content → Design → Configuration → HTML Head → Scripts and Style Sheets.
  • Make sure Varnish, Fastly or your CDN doesn’t cache sw.js for long.
  • No extension is required; the integration is two files.

Find your real web root

Magento’s recommended setup points the web server at <magento>/pub, so files there are served from your domain root. If your server points at the Magento root instead, use that folder. Either way, the goal is the same: https://yourstore.com/sw.js must open and show JavaScript.

# from your Magento install, if the docroot is pub/ curl -o pub/sw.js https://pusharoo.com/sw.js # check curl -I https://yourstore.com/sw.js # expect 200 and a JavaScript content type

Add the snippet in the admin

  1. Go to Content → Design → Configuration.
  2. Edit the store view (or website) your customers use.
  3. Open HTML Head → Scripts and Style Sheets and paste the snippet.
  4. Save and flush the cache (System → Cache Management).
<script src="https://pusharoo.com/sdk/pusharoo.js" data-site="pk_your_site_key" async></script>

Varnish, Fastly and CDNs

  • Bypass full-page/edge caching for /sw.js and your manifest, or set a very short TTL.
  • Serve sw.js with a JavaScript MIME type; some static rules rewrite unknown files.
  • If you use a JS bundler/merge setting, keep pusharoo.js external and async.

More caching notes in the docs.

iPhone shoppers

For iPhone and iPad customers to subscribe, your store needs a web app manifest and they must add it to the Home Screen (iOS 16.4+). Add the manifest link and Apple meta tags in the same HTML Head field and set data-ios-hint="true" on the snippet (manifest guide).

Multiple store views and domains

Each store domain needs its own sw.js at its root and its own website entry in Pusharoo, because push permission is per origin. Store views that share a domain can share one site key; set the snippet at website scope. For multi-language stores, use the language segment to send each audience its own copy (segmentation).

Testing before launch

  1. Open https://yourstore.com/sw.js in a private window — it must be JavaScript, not a 404 page.
  2. Deploy to staging first; Magento caches aggressively.
  3. Subscribe on desktop Chrome and Android, send a test, and check links land on the right store view.
  4. Purge Varnish/Fastly after changes to the head configuration.

Cart and order events

Magento’s storefront fires a customer-data reload when the mini-cart changes; a small RequireJS module can call Pusharoo.track('added_to_cart') when the cart section’s item count increases, and the checkout success page can call Pusharoo.track('purchase'). An automation then sends a reminder and stops on purchase (details). For shipment notices, an observer on order status changes can call Pusharoo’s REST API with the stored subscriber ID.

Content Security Policy

Magento 2.4 ships a Content Security Policy module. If your store enforces CSP (rather than report-only), allow https://pusharoo.com for script-src and connect-src in a module’s csp_whitelist.xml, otherwise the snippet is blocked silently. Check the browser console for CSP violations during testing.

What to send

  • New arrivals and seasonal collections to recent visitors.
  • Time-limited promotions with a real end time.
  • Back-in-stock announcements for popular items.
  • Win-back offers to inactive subscribers.

Playbook in ecommerce push notifications. Pusharoo doesn’t read Magento carts by itself; send added_to_cart and purchase events from your theme or the REST API and an automation can handle reminders (how).

Questions

Do I need a Magento extension for web push?

No. Uploading sw.js and adding a script tag in the HTML Head configuration is enough for Pusharoo.

Where is the Magento 2 web root?

Usually the pub/ directory in production setups. Check which folder serves https://yourstore.com/robots.txt.

Does this work with Adobe Commerce Cloud?

The same principle applies, but file placement goes through your deployment process. Make sure sw.js ends up served from the root and isn’t cached by Fastly.

Does it work with Hyvä themes?

Yes. Add the snippet in the head through the admin’s HTML Head field or a layout XML block; Hyvä’s lighter JavaScript doesn’t change how the async script loads.

Where do I find the subscriber ID for transactional sends?

Your webhook receives subscription_id on subscribe; store it against the customer when they’re logged in.

More in Platforms: Web push for WordPress and WooCommerce · Web push on Wix, Squarespace and Webflow · Web push notifications on BigCommerce · Web push notifications for PrestaShop · Web push notifications for Joomla · Web push notifications for Drupal · Web push notifications for Ghost blogs · All guides

Free for life. No limits.

Unlimited subscribers, campaigns and automations. No badges. About five minutes to install.