Notifications

Overview

Notifications add a bell to your site header. The bell shows how many unread notifications a reader has and opens a panel where they read them, without leaving the page.

Readers get three kinds of notification:

  • Announcements you write for everyone on the site, or for chosen segments.
  • Messages to one reader, sent from their profile in the dashboard or by a Journey.
  • Automatic notifications from your site, such as a reply to their comment or a change to their subscription.

Signed-in readers see all three, and what they read or dismiss is remembered on every device. Readers who are not signed in see your announcements only.

Set up the bell

  1. Go to Audience Operation > Experience and click New Experience.
  2. Pick Notification and click Next Step.
  3. Enter a Name, choose the Project and turn on Enable.
  4. Set a Title for the panel if you don't want "Notifications".
  5. Choose your Categories, see below.
  6. Click Save Changes.

Then place the bell where it should appear, usually in your site header next to the sign-in button:

<div data-exp="unis-notification"></div>

The bell takes the text colour of your header, so it suits light and dark headers. The panel opens below the bell on larger screens and as a sheet from the bottom on phones.

Categories

Every notification belongs to a category. In the experience you can turn each category on or off, rename it, and mark it as important.

CategorySent for
Account & securityPassword changes. Important by default.
SubscriptionA subscription starting, about to renew, cancelled or resumed.
RepliesReplies to the reader's comments.
MessagesJourneys and messages you send to one reader.
NewsYour announcements.
  • A category that is off sends nothing and shows nothing.
  • When a reader has an unread notification in an important category, the badge on the bell pulses.
  • Readers can turn categories off for themselves with the settings button in the panel. Important categories always stay on.

Readers can also filter the panel by category, and switch between all and unread notifications.

Write an announcement

  1. Go to Features > Notification and choose the project. If you have one project, it opens straight away.
  2. Click New Notification. You can also click Write an announcement in the Notification experience.
  3. Fill in the form. The preview shows how it looks in the bell and when a reader opens it.
SettingWhat it does
TitleThe headline.
MessageThe text under the title.
LinkOptional. Adds an Open button that goes to this address.
ImageOptional. A picture shown with the notification.
CategoryWhich category it belongs to. News by default.
Only send through journeysKeeps it out of everyone's bell, see below.
AudienceLeave it empty for everyone, or tick segments to send it only to readers in one of them.
  1. Click Save.

The list of announcements shows each one's category and audience. Click Edit to change one, or Remove to take it down.

Readers see announcements published since shortly before they joined, so new readers don't start with a long list of old news.

Audiences choose who sees an announcement; they don't keep its content private. Send anything personal as a message to one reader instead.

Send a message to one reader

  1. Go to Data Management > User Data and open the reader's profile.
  2. Click Send message.
  3. Choose the Site if you have more than one, and fill in the Title, Message and optional Link.
  4. Under Send as, tick In-page message, Email or both.
  5. Click Send.

The in-page message goes to the reader's bell under Messages. The email is sent with your organisation's email settings.

The reader's Notifications tab shows what is in their bell, with the category, site, when it was sent and whether they have read or dismissed it.

Send notifications from a journey

  1. Write the notification as above, with Only send through journeys turned on.
  2. In a Journey, add a Send Notification step and choose it.

Each reader who reaches the step gets the notification once. It keeps the category you chose, or goes under Messages if you left it as News. To send an email as well, add a Send Email step.

Customise the look

The bell and panel keep their own styles, so your site's CSS doesn't change them. To match your brand, set these on the bell's container:

VariableWhat it changes
--unis-notification-accentButtons and switches.
--unis-notification-badgeThe unread badge and dots.
--unis-notification-bgThe panel background.
--unis-notification-textThe panel text.
<div
  data-exp="unis-notification"
  style="--unis-notification-accent: #0b3d2e; --unis-notification-badge: #d97706"
></div>

See the Notification experience and Set up experiences on your website.

Stay ahead in first-party data

Identity, consent, audience, and subscription insights for publishers. A few emails a month, no spam.

By subscribing you agree to our privacy policy.