Set up web push notifications
Enable browser push, grow a subscriber list, and send targeted notifications — without an app.
Email reaches people when they open it.
Push notifications reach people when they are in front of their browser — or when they pick up their phone.
For sites with time-sensitive content (flash sales, breaking posts, limited stock), the difference matters.
SGEN's push notification module handles the full stack: the service worker that powers the opt-in, the subscriber list that grows as visitors consent, and the send interface that dispatches the message.
No third-party push service to wire up separately.
No code to deploy.
The module activates in the admin and starts collecting subscribers within minutes.
This page covers the full setup: enabling the module, configuring the opt-in prompt, managing the subscriber list, and sending a notification.
It also covers the PWA (Progressive Web App) settings that make the push subscription persistent on mobile browsers.
What is this for?
Use this page when you want to send browser push notifications to visitors who have opted in on your SGEN site.
It covers Push Notifications in the admin under Modules.
This page is a how-to.
It does not cover in-app notifications (notifications inside the SGEN admin interface to your team).
It does not cover email notifications — those are configured in Email Templates.
It does not cover the technical architecture of service workers — that lives in the platform engineering reference.
Good use cases
- You publish time-sensitive content — news, product drops, event announcements — and want subscribers to receive a push the moment something publishes.
- You run an ecommerce site and want to notify opted-in customers when an out-of-stock item is back.
- You run a membership or community site and want to bring members back with engagement nudges — new content in their category, a reply to their comment.
- You want a low-cost re-engagement channel that does not depend on email open rates.
- You are setting up a PWA and want persistent push subscriptions that survive the browser being closed.
What NOT to use this for
- Broadcast campaigns to a purchased subscriber list.
- Transactional messages that require delivery guarantee.
- Replacing your email marketing.
How this connects to other features
- Email templates — email and push are the two automated outbound channels.
- Analytics — push notification open rates and click rates feed into the site analytics surface.
- Ecommerce — back-in-stock push and cart-abandonment push are triggered by ecommerce events.
Before you start
- You are signed in as a Site Admin.
- The site is served over HTTPS.
- You have considered your opt-in prompt timing.
Where to find it
Push Notifications lives in the admin → Modules → Push Notifications.
The module panel has three sections: Setup, Subscribers, and Send.
Setup is where the module is activated and the opt-in prompt is configured.
Subscribers shows the subscriber list and opt-in metrics.
Send is where notifications are composed and dispatched.
Steps
The full setup has four parts: activate the module, configure the opt-in prompt, review the subscriber list, and send a notification.
1. Activate the module and configure PWA settings
Open the admin → Modules → Push Notifications.
If the module is not yet active, click Activate module.
Activation registers the service worker for the site.
This happens silently in the background — visitors do not see anything at this stage.
After activation, the Setup panel shows the PWA settings.
Site name for PWA — enter the name your site presents in the browser's Add to Home Screen prompt and in the notification bar on mobile.
Use the site's published name, not an internal label.
PWA icon — upload a square icon (minimum 512 × 512 px, PNG).
This icon appears in the browser's notification chrome and in the Add to Home Screen tile.
The icon should work on both light and dark backgrounds — it appears in both contexts depending on the device.
Notification icon — optionally upload a separate 192 × 192 px icon for notifications specifically.
If left blank, the PWA icon is used.
Badge icon — the small monochrome icon that appears in the Android notification bar.
Recommended at 96 × 96 px, monochrome PNG.
If left blank, the browser's default badge is used.
Click Save PWA settings.
2. Configure the opt-in prompt
Still in the Setup panel, scroll to the Opt-in prompt section.
The soft prompt is the in-page banner that visitors see before the browser's native permission dialog.
You control the timing, the copy, and the appearance.
Show prompt after — choose when the banner appears.
Options: after N seconds on page, after N pageviews, or after a specific user action (for example, clicking a follow button).
For content sites, 10-15 seconds on page or after the second pageview produces the best opt-in rates without alienating first-time visitors.
Banner headline — enter the main prompt line.
Keep it under 60 characters.
A good prompt names the benefit: Get notified when new posts go live performs better than Enable notifications.
Banner description — a short supporting sentence.
Optional but useful for explaining what the visitor is subscribing to.
Under 100 characters.
Allow button label — defaults to Allow.
Can be customised: Yes, notify me or Stay in the loop.
Decline button label — defaults to Not now.
Avoid negative labels like No thanks — they increase opt-out sentiment.Maybe later is a more neutral alternative.
Banner position — Bottom bar, Top bar, or Modal center.
Bottom bar is the least disruptive.
Modal center gets higher opt-in rates but interrupts more.
Click Save prompt settings.
Preview the prompt by clicking Preview prompt — this renders the banner in the current browser tab for visual confirmation.
3. Review the subscriber list
Click Subscribers in the module panel.
The subscriber list shows every opted-in browser session.
Each row shows the subscription date, the browser and OS, the last active date, and the subscription status (Active, Expired, or Opted out).
Subscriptions expire when a visitor clears browser data, reinstalls a browser, or the service worker is unregistered.
Expired subscriptions are shown in the list but do not receive notifications.
The Active subscribers counter at the top shows only the reachable count — use this figure when planning send volume estimates.
The list cannot be exported or shared outside the SGEN admin surface.
Push subscriptions are browser-bound identifiers; they have no personally identifiable information attached.
Use the Date filter to see how many subscribers joined this week or this month.
The growth trend over time is the most useful signal for measuring opt-in prompt performance — a flat line suggests the prompt is not being seen, a steep dropoff suggests too many visitors are declining.
4. Compose and send a notification
Click Send in the module panel.
Click New notification.
The compose panel opens.
Title — the bold headline in the notification.
Under 50 characters.
The title is the first and sometimes only thing the recipient reads.
Body — the secondary line under the title.
Under 120 characters.
Most operating systems truncate beyond this.
URL — the destination page when the recipient clicks the notification.
Use a full URL including https://.
For blog announcements, link directly to the post.
For product drops, link to the product page or collection.
Icon — optionally override the notification icon for this send.
Useful for seasonal sends or product-specific sends where a contextual icon improves click rate.
Image — optionally include a large banner image.
Not all browsers display this (Chrome on desktop does; mobile browsers vary).
If you use an image, ensure the core message is in the title and body — not only in the image.
Send time — choose Send now or schedule for a specific date and time.
Scheduled sends respect the subscriber's browser timezone where possible.
Click Review to see a preview of the notification as it will appear in Chrome on desktop.
Click Send to dispatch.
The send confirmation shows the count of active subscribers the notification was dispatched to.
Delivery is asynchronous — not all subscribers will receive it in the same second; the platform distributes the sends over a short window to avoid batching delays.
What success looks like
The module is correctly active when the service worker is registered (visible in the browser's DevTools Application panel as a registered service worker for the site's origin) and the opt-in prompt appears to new visitors at the configured trigger.
A subscriber is correctly counted when a visitor clicks Allow in both the soft prompt and the browser's native permission dialog.
The subscriber list shows a new Active row.
A notification is successfully sent when the Send confirmation shows a non-zero dispatch count and at least one test subscriber (a browser session you control) receives the notification within a few minutes.
What to do if it does not work
- Module will not activate — "HTTPS required" error.
- Opt-in prompt is not appearing for visitors.
- Subscriber count is not growing.
Enable notifications headline underperforms.Try adjusting the trigger timing to a later point in the session, or add a description that explains the specific value of subscribing.- Sent notification not arriving on a test device.
- Notification arriving without the custom icon.
- Scheduled send did not dispatch.
Examples
Example A — new post notification for a news blog.
A local news site enables push notifications, configures the soft prompt to appear after 15 seconds, and sets the headline to Be first to read breaking news from [City Name].
Within two weeks the subscriber list has 340 active sessions.
When a major story breaks, the editor clicks New notification, writes a 48-character headline, links to the story, and hits Send.
The notification dispatches to 304 active subscribers in under 90 seconds.
The post receives 180 clicks from push within the first five minutes — a channel that did not exist before the module was activated.
Example B — back-in-stock push for an ecommerce site.
A homeware shop uses the ecommerce back-in-stock trigger type.
A limited-run candle is out of stock.
Visitors on the product page see an opt-in banner: Notify me when this is back in stock.
44 visitors subscribe to that product.
When the item is restocked, SGEN dispatches a push to those 44 subscribers automatically.
36 click through; 8 convert.
The inventory sells out the same day.
Example C — re-engagement for a membership community.
A professional learning community has 1,200 push subscribers.
Monthly engagement has dropped.
The community manager schedules a push for Tuesday at 9 AM: New discussion: [Topic]. 14 members have already replied.
The click rate is 22%, above the site's baseline.
The discussion thread receives 30 new replies by noon.
The push message cost: 10 minutes of compose and schedule time.
Reference — notification size limits by browser
| Field | Chrome desktop | Chrome mobile | Firefox desktop | Safari (macOS) |
|---|---|---|---|---|
| Title | ~50 chars visible | ~50 chars visible | ~50 chars | ~50 chars |
| Body | ~120 chars visible | ~60 chars visible | ~120 chars | ~120 chars |
| Image | Shown (wide banner) | Shown (varies) | Not shown | Not shown |
| Icon | Shown (small) | Shown (small) | Shown (small) | Shown (small) |
| Badge | Shown (Android only) | Shown (Android) | N/A | N/A |