4. Writing the header and body scripts

Now, it is time to define the scripts that your Pixel app will run on the store website. You can specify scripts that execute inside the <header> and/or <body> tags.

Adding a script to the <header> ensures that it will be executed before any other HTML element is rendered on the page. Although this may affect store performance, it is a good option if your Pixel app relies on the interaction between users and store components. On the other hand, adding a script to the store <body> tag will probably reduce the impact on performance scores. However, this may come at the cost of losing user data. Choose wisely based on the functionality of your Pixel app.

Instructions

Open the pixel/header.html file and replace the provided function with your own.

If you choose to execute your script inside the <body> tag, rename the header.html file to body.html.

Use the settingsSchema identification key previously defined where applicable. See the following example:


_10<script>
_10  // Using via JavaScript
_10  var appId = "{{settings.gtmId}}";
_10</script>
_10
_10
_10<script src="//foobar.com?gtmId={{settings.gtmId}}"></script>