Sending web push notifications using my own domain

instant browser-based messages (aka "web push notifications") are a superb way to capture leads and grow repeat customers who visit your site using Chrome, Firefox, Safari or Opera! By default, web push messages display E-goi's domain, but you can have it show your own URL.

 

 

Customising the web push URL

Step 1: Create a custom Firebase web app for your domain

You'll need to do this outside E-goi. Ask a helping hand from your developers!

This step is about accessing Firebase, a Google feature to easily create a web app with your website domain.

There you'll get a code snippet and a keyfile for your custom web app.

 

  • Set up Firebase (JSON code)

1) Head over to https://firebase.google.com/ and click Go to console on the upper right corner.

2) Hit Create a project. Enter your project name and choose the settings that best suit your needs.

3) These will be saved in your project. You'll be taken to a dashboard, where you should click the < / > symbol to create a web app within the project.

 

4) Type in a name for your web app and hit Register app. Scroll all the way down and click Continue to the console.

5) You'll be back to the project dashboard. View the web app you just created by clicking the cog-shaped icon next to Project Overview.

 

6) You are now in the project settings. Scroll down to the SDK setup and configuration section and hit Config. This is the code snippet you'll need to paste into E-goi later.

 

  • Generate a Firebase private key

7) Scroll up the project settings page and click the Service accounts tab. Then hit Generate new private key. This will pull up a keyfile which you'll need to add to E-goi in the next step.

 

This bit is done (phew!). If later on you need to access your Firebase projects, go to https://console.firebase.google.com/

 

 

Step 2: Add your web app keyfile to E-goi

Once you have your web app created, go to your E-goi account.

This is where you'll be adding the code snippet and keyfile you generated above.

1) Click the Collect menu and hit Web push.

2) Click Add app in the upper-right corner and select Web push (custom domain).

3) Type in your site URL and choose the contact list your web push subscribers will be fed into.

4) Paste the code snippet and upload the private keyfile.

Be sure to paste in just the snippet of code between curly brackets { }. The words before the colon should also be enclosed in quotes, as shown below.

 

5) Now upload an image for your web push invite.

6) You can optionally add a Safari Certificate if you'd like your web push notifications to be shown in Safari as well.

All set? Now let's create your web push invite.

 

 

Step 3: Putting your invite together

Time to get creative ;)

1) Choose your type of web push invite (an invite is where it usually says "Would you like to receive notifications from this site?"):

  • Floating icon: A small icon on a corner of your site. People clicking on it will be shown the invite.
  • Pop-up: The standard. Your invite will pop to visitors as small window.
  • Custom: An icon which you can place anywhere in your site.

2) Depending on the type of invite, you may customise how it looks and behaves. You can also allow people to subscribe via email if they say "no" to the invite..

Done? Now let's move on to actually adding the invite to your site.

 

Step 4: Embedding the invite

E-goi will provide you with a set of code snippets:

  • Service worker file: Place it in your site's root folder (you'll need to log into your hosting service to do this).
  • Code: Same location as where you paste Google Analytics tracking codes. This will usually be your site's footer HTML.
  • Icon code: If you've opted for a custom invite above, add this snippet to the element ID or tag in your site where the icon will appear.

And you're all done! ;)

 

 

Step 5: Creating and sending out your web push notifications

Got the invite up and running in your site? Now simply send notifications as usual to your web push subscribers. The domain they see should be your own instead of E-goi's.

 

 

I already have web push subscribers from my own web app. Can I import them into E-goi?

Yes! If you were using a Firebase app as a web push platform for your site, you can migrate your tokens directly. Get in touch with us using your account's Help widget so we can give you a hand!