What are Push Notifications?
Push Notifications are automated, user opt-in, pop-up messages that are sent directly to a user's desktop browser or mobile device as an effective method of alerting users that latest news or information is available.
When a user engages with the message, the user is redirected to the full content for consumption. Push Notifications are an excellent method of contact for increasing user-engagement, as users can sign up and receive push notifications for the content that they care about. Push Notifications are currently supported on desktop and mobile browsers, as well as the BLOX Now app.
How do Push Notifications work?
BLOX CMS is built with Firebase, Google's mobile platform that provides the push technology. Google Firebase is free and only requires that users have an established Google account. The Push Notification setup is a two-part process that involves establishing a Firebase Project and then making a connection between BLOX CMS and Firebase. Once this connection has been made, Topics and Channels can then be created within BLOX Notifier.
Upon completion, desktop and mobile setups require that a notification sign up block be added to the BLOX site using the Utility: Notification controls block template.
BLOX Now app notification setups do not require a sign up block, as this functionality is natively available within the Now app Settings panel.
BLOX Notifier supports a single Firebase account (or Firebase project), so any Topics that are created will be available for sign up across desktop, mobile and BLOX Now app. BLOX admins who manage multiple BLOX sites may create multiple Firebase projects within the same Firebase account.
NOTE: Notifications will only appear in the notification panel if the user is on the site when the notification comes in.
There are off-site push notifications and on-site notifications. Off-site notifications are the notifications that you will receive when you're on a mobile device or when you're on a web browser but don't have the site open. These notifications don't interact with the notification panel in any way.
On-site notifications are the notifications that happen when you are currently on the website. These are the ones that do interact with the notification panel (ignoring them causes them to end up in the notification panel where they can be clicked or dismissed, etc). There is javascript that exists on their site to listen for notification events and then handles adding them to the panel, which is why if the site isn't open, it can't respond to the notification events, and they don't get added to the panel.
How to Set Up a Firebase Project
Scope: These instructions describe the Firebase setup used by the legacy BLOX Notifier integration. Do not assume that the same Firebase configuration screens are available in BLOX NXT. Confirm NXT support and the available configuration interface with BLOX Support before proceeding.
Open the Firebase console and sign in with the Google account that will own and manage the publication's Firebase project.
Select Create a project and enter a recognizable project name. We recommend a name that identifies the publication or organization, such as domain.com Push Notifications. Google Analytics is optional for push notifications and can be enabled now or added later. Complete the project creation steps.
Generate the Firebase service account JSON file
BLOX needs a Firebase Admin SDK service-account key file to authenticate with Firebase. Firebase automatically creates a Firebase Admin SDK service account for a project; you do not normally need to create a separate service account manually.
In the Firebase console, open Project settings from the gear menu.
Select the Service accounts tab.
In the Firebase Admin SDK section, select Generate new private key.
Confirm by selecting Generate key. Firebase downloads a JSON file to your computer.
Store the file securely until it is uploaded to BLOX. It contains a private key and must be treated as a secret. Do not email it, publish it, or place it in a publicly accessible location.
If your organization prevents private-key creation, ask the Google Cloud or Firebase project administrator to review the project's service-account key policies. Do not work around an organization security restriction.
Register a Firebase web app and copy its configuration
The web app configuration identifies the Firebase project to the website. If a web app is already registered for this project, you can use its existing configuration; otherwise, register one:
In Project settings, select the General tab and find Your apps.
If no web app is listed, select the web app icon (</>) to register one. If apps are already listed, select Add app and choose the web platform.
Enter an app nickname, such as the publication's name.
Do not enable Firebase Hosting unless your organization separately intends to host a website with Firebase. It is not required for BLOX push notifications.
Complete registration. In the SDK setup and configuration area, select Config and copy the Firebase configuration object.
The configuration object contains values such as apiKey, authDomain, projectId, messagingSenderId, and appId. Use the values generated for the customer's own Firebase project; do not copy values from an example or another publication.
Generate the Web Push certificate (VAPID key)
Firebase Cloud Messaging for web push uses a VAPID key pair. Generate the key pair in the Firebase console:
Open Project settings and select the Cloud Messaging tab.
Find the Web configuration section and open Web Push certificates.
Select Generate key pair.
Copy and retain the public key displayed by Firebase for the BLOX configuration step. Do not attempt to expose or share the private portion of the key pair.
Locate the Firebase Sender ID
The Sender ID is the Firebase project's numeric project number. In Project settings, open the Cloud Messaging tab and locate the Sender ID in the Firebase Cloud Messaging API (V1) section. You can also find the project number at the top of the General tab. Use the Sender ID/project number, not the project ID or app ID.
Connect BLOX CMS with Firebase
In the legacy BLOX administration interface, open Community > Notifier > Application Settings > Push Notifications.
Upload the downloaded service-account JSON file using Google Service Role Access File.
Copy the Firebase Sender ID (project number) into Messaging Sender ID.
Copy the Firebase web app configuration object into Firebase Configuration. Remove the JavaScript wrapper (for example,
const firebaseConfig =) and the trailing semicolon so that the field contains only valid JSON. Ensure property names and string values use double quotes.Copy the public VAPID key generated in Firebase into Web Push certificate.
Leave Google Desktop Notification API Key blank. The legacy FCM Server Key is deprecated and should not be used for a new setup.
Example of the JSON structure for the Firebase Configuration field (the values below are placeholders; use the values from the customer's Firebase web app):
{
"apiKey": "YOUR_API_KEY",
"authDomain": "YOUR_PROJECT_ID.firebaseapp.com",
"projectId": "YOUR_PROJECT_ID",
"storageBucket": "YOUR_STORAGE_BUCKET",
"messagingSenderId": "YOUR_SENDER_ID",
"appId": "YOUR_APP_ID"
}Before saving, create at least one Topic ID and Label. The Topic ID is the short identifier; the Label is the name presented to users in notification signup controls and the BLOX Now app settings. For example, a Topic ID of breaking could have the Label Breaking News.
Use the Default checkbox to preselect a topic in signup controls. After creating the required topics and labels, save the Push Notifications settings. Additional topics and labels can be added later using the same Firebase project configuration.
Assign each push-notification target to a Channel after it is created. A target that is not assigned to a Channel may be available for users to select, but it will not receive notifications from a Channel.
Security reminder: The service-account JSON file contains a private credential. Upload it only through the authorized BLOX administration interface and restrict access to the file. If the key is exposed, revoke it and generate a replacement in Google Cloud/Firebase, then update the BLOX configuration.
Utility: Notification controls Sign up block
Notification Topics can be presented to both desktop and mobile users by introducing a notification sign up block to the page layout using the Utility: Notification controls block template.
This block offers two Presentation styles:
Stuck to bottom: This style displays the block just above the page footer.
In the Nav: This style displays the block within the site navigation.
The Utility: Notification controls block should be placed within a header region, such as main-nav-right-region. When getting started with push notifications, we recommend that this block be placed within a test section before making it available to your audience. This will grant the opportunity to sign up and witness the user experience firsthand and make any necessary refinements.
How to manually send a push notification
If the need arises to bypass the automatic notification rules, push notifications can manually be sent from either BLOX Notifier or within the actual asset itself.
To manually send a push notification within BLOX Notifier, select +New within the Search Results panel. Next, within the Create new message window, use the search tool within the Notification message target panel to find the asset that you'd like to push. Once selected, the Message field will populate with the asset title. This can be overridden, as well as the Title of the push. The publication date/time are included. If the asset features a future publication date/time, the push will go out shortly thereafter that date/time. If the publication date has already passed, the push will be pushed out within a few short minutes.
Within the Channels panel, select the Channels that should receive the push notification and then select Save and send to complete the push notification. Push notifications may also be saved a draft for future delivery.
To manually send a push notification within an asset, navigate to the Other tab and then to the Notifier panel. Select +New to populate the Create new message window and then follow the same steps that were used for manual pushes within BLOX Notifier.
How are push notifications tracked in the BLOX Now app?
We originate our push notification from the “Notifier” in the BLOX CMS. This is connected to Firebase and Firebase pushes notifications on Apple and Google platforms. Due to the origination of the message being in BLOX, Firebase does not pick up individual messages and track performance see below for how GA tracks this information. Firebase gives you overall numbers but keep in mind due to Firebase working out bugs in the reporting, there are discrepancies for IOS. Apple and Google continue to work on better reporting for Firebase for IOS.
Due to Google's EOL of the Google Analytics 3 platform, Now app analytics have changed to GA4.
How are push notifications tracked in the BLOX Mobile NX native app?
Our help article for Mobile NX app analytics includes a section on available app analytics, please scroll down to "Push notifications and messaging".