Customizing subscription process using additional SDK parameters

Notix has rich opportunities to customize subscription process. Most common options can be set directly inside Notix SSP using user interface and without writing any line of code. But also we provide ability to customize all of these settings inside javascript code that is integrated into your site. So you can manage them programmatically or which ever way you want. Just remember that settings that are inlined inside tag override settings that are defined using UI inside Notix SSP.

Minimal Notix tag should look like this. No setting is overridden inside tag.

<script>
    var s = document.createElement("script")
    s.src = "https://notix.io/ent/current/enot.min.js"
    s.onload = function (sdk) {
        sdk.startInstall({
            appId: "YOUR-APP-ID-HERE"
        })
    }
    document.head.append(s)
</script>

Fully customized Notix tag looks like this. No setting is fetched from SSP - all of them are defined inside tag code.

<script>
    var s = document.createElement("script")
    s.src = "https://notix.io/ent/current/enot.min.js"
    s.onload = function (sdk) {
        sdk.startInstall({
            appId: "YOUR-APP-ID-HERE",
            loadSettings: false,
            var: "traff_source_fb",
            user: "your-user@notix.co",
            step0: "useCategories",
            skinName: "categories",
            categories: "{\"news\":\"Our hot news\",\"sports\":\"Latest sport news\"}",
            delay: 5,
            texts: {
              "default": {
                "notificationHeading": "{pubHost} wants to",
                "notificationText": "Show notifications",
                "notificationTextMobile": "{pubHost} wants to send you notifications.",
                "allowBtn": "Allow",
                "denyBtn": "Block"
              },
              "es": {
                "notificationHeading": "{pubHost} quiere",
                "notificationText": "Mostrar notificaciones",
                "notificationTextMobile": "{pubHost} quiere enviarte notificaciones.",
                "allowBtn": "Permitir",
                "denyBtn": "Bloquear"
              },
              "fr": {
                "notificationHeading": "{pubHost} souhaite",
                "notificationText": "Afficher les notifications",
                "notificationTextMobile": "{pubHost} veut vous envoyer des notifications.",
                "allowBtn": "Autoriser",
                "denyBtn": "Bloquer"
              }
            }
        })
    }
    document.head.append(s)
</script>

All parameters that define tag behaviour are located inside sdk.startInstall({}) block.

Tag parameters

Control behavior

  • appId [string]Only this setting should always be present in tag. Identifies your tag and users, subscribed with it. Without this, Notix can't identify your subscribers.
  • loadSettings [bool] – Settings that are not inlined to tag can be loaded from server. You should not change tags when you change some settings in Notix SSP. However all settings can be overridden in tag parameters, which have greater priority than settings from SSP. Default true.
  • disableConsole [bool] – Removes all output into browser console. Tag becomes silent, but also disappears possibility to define what's wrong with setup if something does not work. Usage example.

Provide additional info about subscriber

  • var [string] – Pass any variable for later traffic separation and analysis. This can be used for server-to-server callback about subscription event. Also used for grouping inside statistics.
  • user [string] – User identifier inside your system, for example email or phone or other ID. Can be used later for sending targeted messages.

Control appearance

  • step0 [string] – How to ask user for permissions to send push notifications. Following values supported:
    • usePrerequest – The first request window that is shown on the page. Native browser permission request is only shown if the user gave permission on the initial one.
    • skip – Display native browser permission request immediately
    • waitClick – Display native browser permission only after user clicks on page
    • waitUserActivity – Display native browser permission only after user interacts with page (click, button press)
  • delay [integer] – Defines how many seconds should pass after page loading and before requesting permission. Works if step0 == "usePrerequest" or step0 == "skip"
  • audiences [array of string] – This variable is defined by the site owner. Any strings can be passed into tag before user subscribes. After subscription these values can be used like targeting values for splitting all users into separate audiences.
  • prerequest [object] – Object for configuring not native permission request. Only available when step0 == "usePrerequest"
    • afterCloseDelay [integer] – Number in hours for minimum delay between asking user permissions using prerequest (not native) window.
    • frequency [integer] – How many times permission prompt can be shown to user, during capping hours. Works only with capping, alternative to afterCloseDelay.
    • capping [integer] – Interval in hours for frequency setting. Works only with frequency, alternative to afterCloseDelay. Example: frequency=3, capping=24 - Not more than 3 permission requests during 24 hours.
  • texts [object] – Customize permission prompt texts for all languages.
  • skinName [string] – How the permission request looks like. Only available when step0 == "usePrerequest"
    • slider – Lightbox located in the center of the screen.
    • categories – Allows you to perform some user segmentation during subscription process. For example to select interesting topics/categories of information that user wants to receive.
    • bell – Small bell in the bottom corner of screen.
  • categories [string, serialized object] – Only available when skinName == "categories" Encoded JSON object with key-value pairs that allow to subscriber select some categories before subscription. These values are displayed inside permission prompt window and are selectable by user. Example: "{\"sport\":\"Sport events\", \"fresh_news\":\"Daily fresh news\"}"