Skip to main content

Sending Push Notifications Through Firebase

Everything you need to get started with Firebase Messaging

R
Written by Reactiv App
Updated over a month ago

Setting up a Push Notification Campaign

Note: Steps 1-3 should be complete if you have already integrated Firebase with Reactiv. See Setting Up Firebase & GA4 With Reactiv

Step 1: Set Up Firebase Project

  1. Go to the Firebase Console.

  2. Click Add Project and follow the setup steps.

  3. Once created, go to Project Settings > Cloud Messaging to access your Firebase server key and sender ID.

Step 2: Integrate Firebase SDK into Your App

  1. iOS: Add Firebase SDK via CocoaPods or Swift Package Manager.

  2. Android: Add Firebase to your Android project by adding the google-services.json file to your app directory and updating your build.gradle files.

Step 3: Set Up FCM in Your App Code

Add the necessary code to handle FCM tokens and receive notifications.

  1. iOS:

    • Request user permission to show notifications.

    • Implement UNUserNotificationCenterDelegate to handle notifications.

  2. Android:

    • Initialize Firebase and set up FCM in your Application class.

    • Handle notifications in FirebaseMessagingService.

Step 4: Enable Cloud Messaging API

  1. In the Firebase Console, go to Project Settings > Cloud Messaging.

  2. Enable the Cloud Messaging API for your project.

Step 5: Send a Notification from Firebase Console

  1. Go to Run > Messaging in Firebase Console.

  2. Click on New Campaign > Notifications. (Note that In-App Messaging is not currently supported)

  3. Enter your Notification title and Notification text.

  4. Optionally, you can add in a Notification Image aswell. Keep in mind that this will appear quite small on a users device

    1. Optimal Size: Image should be at least 720px (width) by 240px (height) with an aspect ratio of 3:1. Max Size of 500KB

  5. Once you are happy with the Notification content, click Next

  6. Under Target, select either a specific user segment or app instance.

    • Segment: Target specific user properties or audiences.

    • App instance: Target individual device tokens (e.g., for testing).

⭐️ Reactiv Tip: To simply target all app users, match the below criteria.

Step 6: Configure Notification Options

  • Set the Delivery Time (e.g., immediate, or scheduled).

  • Define Conversion Events if you want to track specific actions after users open the notification.

Deep Link Configuration:

To make your notification navigate to a specific product or collection when opened, add one of the following configurations under Custom Data:

Option 1: URL-Based Deep Link

  • Key: url

  • Value: The full URL of the product or collection you want to link to

  • Example: https://yourstore.com/products/summer-dress

Option 2: Structured Deep Link

  • Key: type
    ​Value: The type of resource (e.g., product, collection)

  • Key: value
    ​Value: The handle or unique identifier of the resource

Example:
For a product deep link, use:
​type: product
​value: summer-dress-blue
​

Step 7: Preview and Send Notification

  1. Use the Preview feature to see how the notification will look.

  2. Click Send or Schedule (if you specified a scheduled time).

Step 8: Monitor Notification Analytics

  1. Go to Analytics > Events in the Firebase Console to track how users engage with your notification.

  2. Use Cloud Messaging > Reports to view metrics on delivery, opens, and conversions.

Events Tracked

This is a comprehensive list of all events that are tracked and sent to Firebase. These can be used for analytics purposes, creating user segments

ReactivEventName.ScreenViewedEvent → 'screen_view'

ReactivEventName.CollectionViewedEvent → 'view_item_list'

ReactivEventName.ShowProductEvent → 'show_item'

ReactivEventName.ProductViewedEvent → 'view_item'

ReactivEventName.SelectProductEvent → 'select_item'

ReactivEventName.CartViewEvent → 'view_cart'

ReactivEventName.CartItemAddedEvent → 'add_to_cart'

ReactivEventName.CartDiscountCodeAddedEvent → 'view_promotion'

ReactivEventName.CheckoutStartedEvent → 'begin_checkout'

ReactivEventName.CheckoutSuccessEvent → 'purchase'

ReactivEventName.CheckoutFailedEvent → 'checkout_failed'

ReactivEventName.SearchAppliedEvent → 'perform_search'

ReactivEventName.SearchFilterAppliedEvent → 'perform_filter'

ReactivEventName.SearchSortAppliedEvent → 'perform_sort'

ReactivEventName.WishListItemAddedEvent → 'add_to_wishlist'

ReactivEventName.WishListItemRemovedEvent → 'remove_from_wishlist' (NOT AN OFFICIAL EVENT)

ReactivEventName.CartItemUpdatedEvent → 'update_cart_item'

ReactivEventName.CartItemRemovedEvent → 'remove_from_cart'

ReactivEventName.CartDiscountCodeSeenEvent → 'viewed_promotion' (NOT AN OFFICIAL EVENT)

ReactivEventName.CartDiscountCodeRemovedEvent → 'remove_promotion' (NOT AN OFFICIAL EVENT)

ReactivEventName.AccountSignUpSuccessEvent → 'sign_up'

ReactivEventName.AccountSignUpFailedEvent → 'sign_up_failed'

ReactivEventName.AccountSignInSuccessEvent → 'login'

ReactivEventName.AccountSignInFailedEvent → 'login_failed'

ReactivEventName.AccountForgotPasswordEvent → 'forgot_password' (NOT AN OFFICIAL EVENT)

ReactivEventName.AccountRecoveredPasswordEvent → 'recover_password' (NOT AN OFFICIAL EVENT)

ReactivEventName.AccountAddressAddedEvent → 'add_address'

ReactivEventName.AccountAddressUpdatedEvent → 'update_address'

ReactivEventName.AccountAddressRemovedEvent → 'remove_address'

ReactivEventName.ExternalLinkClickedEvent → 'click_external_link' (NOT AN OFFICIAL EVENT)

ReactivEventName.WebpageViewedEvent → 'view_webpage'

ReactivEventName.SubscribedToMarketingEvent → 'subscribe_marketing' (NOT AN OFFICIAL EVENT)

ReactivEventName.QRCodeScannedEvent → 'scan_qr_code'

ReactivEventName.PushPermissionAcceptedEvent → 'mobile_app_accept_push' (NOT AN OFFICIAL EVENT)

ReactivEventName.PushPermissionDeclinedEvent → 'mobile_app_decline_push' (NOT AN OFFICIAL EVENT)

ReactivEventName.LocationPermissionAcceptedEvent → 'mobile_app_accept_location' (NOT AN OFFICIAL EVENT)

ReactivEventName.LocationPermissionDeclinedEvent → 'mobile_app_decline_location' (NOT AN OFFICIAL EVENT)

ReactivEventName.AdsTrackingPermissionAcceptedEvent → 'mobile_app_accept_ads_tracking' (NOT AN OFFICIAL EVENT)

ReactivEventName.AdsTrackingPermissionDeclinedEvent → 'mobile_app_decline_ads_tracking' (NOT AN OFFICIAL EVENT)

ReactivEventName.ApplicationInstalledEvent → 'mobile_app_install' (NOT AN OFFICIAL EVENT)

ReactivEventName.NotificationReceivedEvent → 'notification_received'

ReactivEventName.NotificationClickedEvent → 'notification_opened'

(NOT AN OFFICIAL EVENT) = namespace reserved event with google

Did this answer your question?