Click Here For More Support

Integrate Webpush Notifications

Steps

  1. Add Your Website

    • Navigate to the Settings section in the Marketing Engine

    • Go to Integrations, Website, and Add a New Website

    • Add required fields and hit Submit

  2. Request Web Push Activation

    • Reach out to the Marketing Engine support team at [email protected] to enable web push notifications for your website.

  3. Receive Website Credentials

    • Once web push is enabled, the support team will provide you with a unique website ID and domain.

  4. Update Your Website

    • Use the provided website ID and domain to add the required scripts to the <head> section of your website’s index.html file.

<!-- Start FTreal -->
<script type="application/javascript" async>
    (function () {
        let a = document.createElement("script");
        let m = document.getElementsByTagName("script")[0];
        a.async = true;
        a.src = "https://g1-tracker.factoreal.com/ftreal.min.js";
        a.onload = function () {
            let ftreal = (window.ftreal = window.ftreal || {});
            ftreal.init("{Website_id}", true);
        };
        m.parentNode?.insertBefore(a, m);
    })();
</script>
<!-- End FTreal -->
<!-- Start WebPush -->
<script type="text/javascript" async>
    var _at = {};
    var u = "https://storage.googleapis.com/factoreal-webpush-global/";
    _at.domain = '{Domain}';
    // Sample: _at.domain = 'combifam.com' (for regular websites) or 
    // 'combifam.myshopify.com' (for Shopify website)
    _at.idSite = '{Website_id}';
    // Sample: 514cc670-a384-11ed-87ce-41eeaf703333
    (function () {
        var d = document,
            g = d.createElement("script"),
            s = d.getElementsByTagName("script")[0];
        g.type = "text/javascript";
        g.async = true;
        g.src = u + "fsw.min.js";
        s.parentNode.insertBefore(g, s);
    })();
</script>
<!-- End WebPush -->

  1. Add a new file named `sw-factoreal.js` to the same folder as `index.html` with the content below:

importScripts("https://storage.googleapis.com/factoreal-webpush-global/sw-factoreal.js");

  1. To send webpush to contacts, you need to pass the user’s email/phone number when they log in to your site. This will help create audiences and send customized push notifications.

<script>
    function oauthCallback(user) {
        // handle login...
        if (user.email) {
            ftreal?.setUserId(user.email);
        } else if (user.phone) {
            // phone number should be in E.164 format
            // https://www.twilio.com/docs/glossary/what-e164
            ftreal?.setUserId(user.phone);
        }
    }
</script>

Last updated

Was this helpful?