Web Push Notification Tutorial

A web push notification is a message that slides into the top right or bottom left corner of your audience’s web browser (depending on the browser). On a mobile device, web push notifications appear similar to a push notification.

See the Web Push Notification Reference for options and settings details.

 Note

Supported Browsers

  • Desktop and Android Mobile: Google Chrome, Mozilla Firefox, Opera, and Safari
  • Android Mobile only: Microsoft Edge

 Tip

You can save this message as a Composer Favorite — a reusable message with preset settings and content. You can use Composer Favorites instead of recreating commonly used messages. See: Use Composer Favorites.

  1. Click Create and select Message.

  2. (Optional) Add a message name and/or flag the message as a test.
    1. Click   in the header.
    2. Enter the name.
    3. Enable Test.
    4. Click outside the box to close it.

    See also: Name a Message and Flag a Message as a Test.

  3. Define your message Audience.

    1. Select the Web channel. When Web is the only enabled channel, the composer is reduced to only fields and settings relevant to web push notifications.

    2. Select the group of users you want to send your message to.
      • All Users: Sends the message to your entire audience.
      • Target Specific Users: Create a recipient group based on segmentation data. See: Target Specific Users.
      • Test Users: Predefined recipient groups. After choosing Test Users, select from the Test Groups dropdown menu that appears. See: Test Groups.
       Important

      If you are using merge fields in your message, you must select Upload Users.

    3. Click Content in the header to move on.

  4. Add your message Content.

    1. Enter your message text.

    2. Select a message action.

      Home Home opens your app’s home screen. For web push notifications it opens your Default Action URL. You can override the default URL by selecting the Web Page action and entering a different URL.
      Web Page Web Page opens a web page or any valid-device level URL such as App Store or app protocol links. The web page opens in the device’s default browser. Enter a URL.
      Adaptive Link

      Adaptive Link opens a mobile wallet pass. Select an Adaptive LinkA mobile wallet pass link that supports templates for both Google Pay and Apple Wallet. When a user taps the link, Airship determines the user’s platform and generates the right pass for the user. from the list.

      • Adaptive links must be configured before they will appear in the actions list. See: Adaptive Links Tutorial.
      • Only adaptive links created in the dashboard will appear in the actions list.

    3. (Optional) Set and/or remove tags when the user interacts with your message.
      1. Click Set a tag.
      2. Select Add or Remove, then search for tags that exist in the system, or create a new tag.
      3. (Optional) Click Set another tag and repeat the previous step.
       Tip

      Setting one or more tags when a user interacts with a message can help you track user interactions for follow-on retargeting campaigns. For example, if you set a tag “responded-campaign1”, you can target users bearing the “responded-campaign1” tag with another message at a later date, knowing that they are active users. Alternatively, you can re-engage users with this tag using an automated message if they are inactive for a period of time.

    4. Set Optional Features:

      • Buttons
      • Title
      • Media
      • Icon
    5. Click Delivery in the header to move on.

  5. Set Delivery options for your message.

    1. Select a delivery type.

      Send now Send the message immediately after review.
      Schedule

      Choose an exact time of day to send the message.

      1. Enter a date in YYYY-MM-DD format and select the time and time zone.

      2. (Optional) Select Delivery By Time Zone to deliver messages at the specified time in your audience’s time zone(s). For example, a push notification scheduled for 9 a.m. will arrive for people on the east coast at 9 a.m. Eastern Time, in the midwest an hour later at 9 a.m. Central Time, then on the west coast two hours after that, at 9 a.m. Pacific Time.

         Note

        A message delivered by time zone includes a Delivery by Time Zone section in its message report. See: View Message Detail.

         Tip

        The API equivalent of Delivery By Time Zone is Push to Local Time.

      Recurring

      Send the message periodically at specified intervals. You may want to send recurring messages for things like payment reminders. You can pause, resume, and cancel recurring messages in Messages Overview.

       Note

      Segmentation data is evaluated at send time. For example, if your recurring message targets an audience list whose members change over time, each recurring message is sent to the current version of the list when the message is sent.

       Note

      Recurring messages that include multi-language localized content cannot be edited.

      1. Specify the delivery interval by number of hours/days/weeks/months/years. If you selected weeks, also specify which days of the week to send the messsage.

      2. Set the initial date. This is the first day Airship will send your message.

      3. Set the initial time. This is the time of day Airship will send each message.

      4. (Optional) Specify when to stop sending the message.

        1. Enable End date.
        2. Enter a date.
        3. Select the time and time zone.
      5. (Optional) Specify dates or days of the week when the message should not be sent. If you selected the hours interval for delivery, you can also specify which hours of the day should be excluded.

        If the scheduled send falls during an excluded period, Airship waits to send the message until the next available valid send time. For example, if you scheduled delivery weekly on Thursdays but added Thanksgiving Day as an exclusion, the next send would be the Thursday after Thanksgiving.

        1. Enable Do not send.
        2. Click Add date exclusion, enter a date, and repeat for additional dates.
        3. Click Add day exclusion and select days.
        4. Click Add time exclusion and set start and end times.

    2. Set Optional Features.

    3. If your message includes External Data FeedsA connection to an external API. When you send a message, Airship uses a response from that API to personalize messages. , you must configure each feed listed in External data feed options.

      Failure behavior Determine how your message is handled if the feed fails. Select Abort sending the message or Send message without this data.
      Default value for [var]

      This displays the default value for each message-level variable used in your data feed’s request URL. You set the default value when you Add a data feed in your project’s settings.

      You can change the value to override the default for this message only.

    4. Click Review in the header to move on.

  6. Review your message.

    1. Review the device preview and message summary.

      Click the arrows to page through the various previews. The browser selection dynamically updates in the dropdown menu above. You can also select a preview directly from the dropdown menu.

      If you would like to make changes, click the associated step in the header, make your changes, then return to *Review*.
    2. (Optional) Send a test message and verify its appearance and behavior on each channel the message is configured for.

      The message is sent to your selected recipients immediately, and it appears as a test in Messages Overview.

      1. Click Send Test.
      2. Enter at least one named user or Test GroupA reusable audience group that can be used as a recipient for test messages. Messages you send to a test group appear as tests in Messages Overview. and select from the results.
      3. Click Send.
    3. Click Send Message or Schedule Message.