Web push channel configuration

Here, you will configure the web push channel for your websites.

Requirements

Before you proceed with configuration, make sure that:

• The website you want to activate the web push channel for has is listed in the Web Tracking > Websites section.
• Web tracking channel has been configured for this website.

Web push channel configuration

1. Go to Settings > Web push > Web push.
2. Find the website you want to activate the web push channel for.
3. Click the Configure icon to start the setup process.

The next steps will depend on whether a service worker file is already available on the server hosting your website.

Now, choose the appropriate configuration scenario.

The service worker file is already installed on my server

1. In the Configure web push window, click I have the service worker file on my server tab.
2. Copy the provided code.
3. Log in to the server hosting your website.
4. Find the service worker file using the file manager tool or a file browser. Common names include service-worker.js, or sw.js, usually located in one of the following directories:
   • The root directory, e.g., [/service-worker.js]
   • The ‘public’ directory, e.g., [/public/service-worker.js]
5. Open the service worker file in edit mode. You can use the in-site editor or download the file to your computer and open it in any text editor, e.g., Notepad.
6. Paste the code either at the beginning or end of the file. Avoid placing it randomly within the file, as it may not work properly.
7. Save the changes.
8. If you edited the file locally, upload it back to the server, replacing the old service worker file.
9. Copy the file location, usually available as a URL:
   • https://www.YourStore.com/service-worker.js – if located in the root directory.
   • https://www. YourStore.com/public/service-worker.js – if located in the [public] directory.
10. Return to Configure web push window in the platform.
11. Paste the URL in the have the service worker file on my server tab.
12. Click Verify the file status to check if the service worker file is accessible and working properly.
13. Once the file has been verified, save the settings.
14. After verification, the channel status will update to Active. You can check this in the table grid under Settings > Web push.

There is no service worker file on my server

1. In the Configure web push window, click I don’t have the service worker file on the server tab.
2. Click Download the service worker file. The file contains the code needed to enable web push notifications for the users.
3. Log in to the server hosting your website.
4. Using the file management tool, place the downloaded service worker file on your server. It is usually located in one of the following directories:
   • The root directory, e.g., [/service-worker.js]
   • The ‘public’ directory, e.g., [/public/service-worker.js]
5. Open the service worker file in edit mode. You can use the in-site editor or download the file to your computer and open it in any text editor, e.g., Notepad.
6. Paste the code either at the beginning or end of the file. Avoid placing it randomly within the file, as it may not work properly.
7. Save the changes.
8. If you edited the file locally, upload it back to the server replacing the old service worker file.
9. Copy the file location, usually available as a URL:
   • https://www.YourStore.com/service-worker.js – if located in the root directory.
   • https://www. YourStore.com/public/service-worker.js – if located in the [public] directory.
10. Return to Configure web push window in the platform.
11. Paste the URL in I have the service worker file on my server tab.
12. Click Verify the file status to check if the service worker file is accessible and working properly.
13. Once the file has been verified, save the settings.
14. After verification, the channel status will update to Active. You can check this in the table grid under Settings > Web push.

Now, the web push channel is ready to go!

What do I do when the web push configuration has failed?

Here are the most common causes of failed web push configuration and how to deal with them:

Next steps

Once the web push channel is active, you need to collect visitors’ consent for sending web push notifications. You will do so by displaying the opt-in prompts in the visitors’ browsers.

• Create an opt-in prompt to collect consents
• Create a web push notification