Adding the script to the page

The script is included on the page through a script tag

<script src="//assets.npo-data.nl/tag/v3/npotag.js"></script>

After this, the NPO object will be available on the page.

Asynchronous loading

If desired, the script can be loaded asynchronuously. Code using the tag will have to wait until the tag is present. This can be done by adding the async attribute:

<script src="//assets.npo-data.nl/tag/v3/npotag.js" async></script>

Code should then be executed through a listener on the npoReady event. Please note that the listener should be attached before the script tag.

<script>

	document.addEventListener('npoReady', function () {

		NPO.page();

	});

</script>
<script src="//assets.npo-data.nl/tag/v3/npotag.js" async></script>

Loading the script through XHR techniques is possible. Listening to the npoReady event is also compulsory in that case.

Passing extra configuration to the tag

Some extra configuration can be sent to the tag while adding it to the page.

• pageview This will let the tag send a pageview by itself, so calling NPO.page() is not necessary.
• plugins A list of plugins to be enabled. Defaults to ‘npo, atinternet’.

This configuration can be done in two ways:

By adding attributes to the script tag

<script src="//assets.npo-data.nl/tag/v3/npotag.js" data-pageview data-plugins="npo,atinternet"></script>

By adding parameters to the script’s url. (e.g. when you use a script loader)

jQuery.ajax({
	dataType: 'script',
	cache: true,
	url: 'https://assets.npo-data.nl/tag/v3/topspin.js?pageview=true&plugins=npo,atinternet'
})