Skip to main content
All CollectionsDeveloper resources
Nextsale pixel installation
Nextsale pixel installation

Learn how to install Nextsale pixel on custom websites

Neo Gurbanli avatar
Written by Neo Gurbanli
Updated over 7 months ago

This document explains how to add the Nextsale Pixel tag to custom websites.

There are two methods of installing the the pixel tag. For both methods, Nextsale Pixel tag should be added to the head section of the page. Nextsale should be added to each page of the website.


Installation method #1:

1. Copy and paste this code snippet before the </head> tag on every page you want the Messenger to appear.

<!--Nextsale Pixel--><script>(function(w,d,s,r,k){w['NextsaleObject']=r;w[r]=w[r]||function(){(w[r].q=w[r].q||[]).push(arguments)};a=d.createElement(s),m=d.getElementsByTagName(s)[0];a.async = 1;a.src='https://sdk.nextsale.io/nextsale.min.js?key='+k;m.parentNode.insertBefore(a, m)})(window, document, 'script', 'nsio', '{PUBLIC_KEY}');</script><!--END Nextsale Pixel-->

2. Once you’ve completed your changes, open your website. A ping request to our servers and then your website's status should change to active. (Green dot near to the website name)

The above code does 2 main things:

  1. Creates a <script> element that starts asynchronously downloading the nextsale.min.js JavaScript library from https://sdk.nextsale.io/nextsale.min.js?key={PUBLIC_KEY}

  2. Initializes a global nsio function that allows you to schedule commands to be run once the Nextsale JS library library is loaded and ready to go. This function also makes it possible to install the Nextsale Pixel in a Single Page Application (SPA)


Installation method #2:

1. Copy and paste this code snippet before the </head> tag on every page you want the Messenger to appear.

<!--Nextsale Pixel--><script>(function (w,r){w['NextsaleObject']=r;w[r]=w[r]||function(){(w[r].q = w[r].q || []).push(arguments)};})(window, 'nsio');</script><script src="https://sdk.nextsale.io/nextsale.min.js?key={PUBLIC_KEY}" async></script><!--End Nextsale Pixel-->

2. Once you’ve completed your changes, open your website. A ping request to our servers and then your website's status should change to active. (Green dot near to the website name)

Above script does exactly same things with the installation method #1. The only difference is the loading method of the javascript library. It uses the async attribute which adds support for preloading. This method has small performance boost over installation method #1 but it will degrade to synchronous loading and execution on older browsers.

As seen above there are actually two script tags for this installation method. First script tag is for registering the global nsio function and the second one if for loading the Nextsale JS library. If you're not going to use the nsio function, then you can completely ignore the first script tag and add only the second tag to the <head> section.

<!--Nextsale Pixel--><script src="https://sdk.nextsale.io/nextsale.min.js?key={PUBLIC_KEY}" async></script><!--End Nextsale Pixel-->

NOTE: Don't forget to replace the {PUBLIC_KEY} with your website's actual public key. If you copy the installation code from Nextsale Dashboard this key will be filled automatically for you.

Did this answer your question?