Web Push Integration on WIX

Wix is an amazing platform to start your own website. Integrating Push Notifications on Wix Site with D·engage is very simple and takes less than 10 minutes. In this article, we will show the exact steps to integrate web push notifications on a Wix site.

Below are the steps to install Push Notifications on a Wix website

1. Goto the admin panel of your account and navigate to Settings > Application.

2. Create a new web application and fill in the necessary details. Once done with that it will provide you the setup guide like below. Copy the code and download the service worker file.

3. Wix Account: Log in to your Wix account. Select the Edit site.

4. Go to Site Code then go to Backend Files.

Create a new javascript file. File Name should be http-functions.js and paste the following code in the file:

Replace the line 6 with your import script code in the service worker file.

1. import {ok, notFound, serverError} from 'wix-http-functions';
   

   let DengageSDKWorkerjs = `var swUrl = new URL(location);
   

   var accountId = swUrl.searchParams.get('account_id') || '';
   

   var appGuid = swUrl.searchParams.get('app_guid') || '';
   

   if (accountId && appGuid) {
   

       importScripts("https://us-pcdn.dengage.com/p/push/%22 + accountId + "/" + appGuid + "/dengage_sw.js");
   

   }`;
   

   export function get_dnsw(request) {
   

    let options = {
   

    "headers": {
   

    "Content-Type": "application/javascript",
   

    "Service-Worker-Allowed" : "/"
   

           },
   

    "body": DengageSDKWorkerjs
   

    
     };

    return ok(options);
   

    
   }

   
   

Click Save and then Publish.

5. Click Settings, scroll down to Advanced section and select Custom Code.

6. Click on + Custom Code Name It to (HTTP Header) and Code Type should be Essential.

7. Paste the script you copied in the step 2 here and replace the dengage('initialize'); in line 2  with dengage('initialize', {swUrl: '/_functions/dnsw'});

1. <script> !function(e,a,n,d,g){e.dengage=e.dengage||function(){(e.dengage.q=e.dengage.q||[]).push(arguments)},d=a.getElementsByTagName("head")[0],(g=a.createElement("script")).async=1,g.src="https://us-pcdn.dengage.com/p/push/4/236cccc3-f3ce-4686-4c21-8373ac58a5c8/dengage_sdk.js%22,d.appendChild(g)%7D(window,document);
2.   dengage('initialize', {swUrl: '/_functions/dnsw'});
3. </script>

8. Select All Pages option then Select Head option and Click Ok

• Related Articles

• How can I import my previously collected web push tokens?

  Import your previous web push tokens using file import. OR By creating an automation job But, you will not be able to use them to send push notification because for the service worker file to be updated the person should do these steps Remove all ...

• Neto Integration

  Neto D·engage Integration In a matter of minutes, without a single line of code you will become able to connect your Neto store to your D·engage account. This integration is a one-way sync that sends your product catalog as well as your contact and ...

• Event Data Integration

  There are two options to send Event Data to D·engage: 1. Send event data via D·engage SDK First, you need to create a website application to use the dEngage Web SDK. Go to D·engage Event SDK page for detailed instructions to 'create an ...

• Safari Web Push

  Web Push SDK Setup Requirements D·engage Application Definition Access to your Website Files D·engage Web SDK provides an interface that handles device subscriptions and web push notifications. Optionally, it also provides event tracking ...

• Web Push SDK Implementation

  With D·engage's Web Push SDK you can collect session and event data from your website. You can also use the Web SDK to engage with your users by sending web push notifications.  Please check the following page to implement D·engage's Mobile Push SDK: ...