To let FirstHive track the user behavior on your website, its tracking code needs to be placed on the target website or landing pages. A code similar to the below sample code would be provided for your account. This needs to be placed on the target website for FirstHive to start tracking the user’s behavior on the site.
Place the below tag manager code in the header section of every page of your website.
Sample Tag Manager Code:
<!-- FH Tag Manager -->
<script type="text/javascript">
var _mtm = _mtm || [];
_mtm.push({'mtm.startTime': (new Date().getTime()), 'event': 'mtm.Start'});
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
g.type='text/javascript'; g.async=true; g.defer=true; g.src='https://analytics.firsthive.com/js/container_clltfUIkS.js'; s.parentNode.insertBefore(g,s);
var _paq = _paq || [];
</script>
<!-- End FH Tag Manager -->
|
Alternatively, you can place this tag in a 3rd party tag manager like GTM, Adobe, etc. However, make sure you configure it to be triggered in the head section of every page of your website.
As per standard implementation, a nested tag manager is not recommended. Depending on the browser and sometimes due to conflicting codes the tag manager may not function to its full capability.
|
NOTEHow to implement a FirstHive Data Layer?
The Data Layer is a central piece within FirstHive Tag Manager as it ensures maximum flexibility.
For example, you may wish to push a value from an e-commerce order into the data layer, allowing someone who configures a container (tag manager) to access this value as part of a tag or trigger configuration. It also allows you to trigger an event which in turn can fire a certain tag.
This way you can integrate for example any e-commerce, CRM, marketing suite, and more into the tag manager.
Setting a Variable
You can push one or multiple values at once to the data layer by calling the _mtm.push method:
Triggering an Event
Triggering an event within the container works similarly to setting a variable. Simply specify a property named event as part of the parameters:
var _mtm = _mtm || [];
_mtm.push({'event': 'purchase', 'orderTotal': 4545.45});
|
Configuration in Matomo Tag Manager
To access this value as a variable in Matomo Tag Manager, create a new variable of type Data Layer and configure it as Data Layer Variable Name for example orderTotal. You can now assign this variable to any trigger or tag.
Assuming you created a variable “Order Total” for the orderTotal data layer variable, you could even configure a condition along with the trigger to for example only trigger when Order Total is greater than 100.
Configuration in FirstHive Tag Manager
To create a trigger that is listening to this event in Matomo Tag Manager, create a new trigger of type Custom Event and configure as Event Name the valuepurchase`. You can now assign this trigger to a tag to ensure a tag will be fired or blocked whenever this event is being triggered from your website or app.
Assuming you created a variable “Order Total” for the orderTotal data layer variable, you could even configure a condition along with the trigger to for example only trigger when Order Total is greater than 100.
How to Read from the Google Data Layer?
If you have already implemented Google Analytics and would like FirstHive to read from the existing google data layer. Please follow the below steps.
Place the additional code (marked in grey) after the FirstHive tag manager tag. This code reads the google data layer and pushes it into FirstHive datalayer. This can then be used to configure events in the FirstHive Tag manager.
It is recommended to place the FH tag manager on the page (as instructed above) for better results. However, if that is not possible then place the additional code (marked in grey) on the page after the code e.g., GTM (if that is from where the firsthive tag will be loaded on the page).
<!-- CDP Tag Manager --> <script type="text/javascript"> var _mtm = _mtm || []; _mtm.push({'mtm.startTime': (new Date().getTime()), 'event': 'mtm.Start'}); var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0]; g.type='text/javascript'; g.async=true; g.defer=true; g.src='https://analytics.firsthive.com/piwik/js/container_23904AO.js'; s.parentNode.insertBefore(g,s); var _paq = _paq || []; </script> <script> var eventify = function(arr, callback) { arr.push = function(e) { Array.prototype.push.call(arr, e); callback(arr); }; }; eventify(dataLayer, function(updatedArr) { var obj = dataLayer[dataLayer.length-1]; _mtm.push(obj); }); </script> <!-- End CDP Tag Manager --> |
How to Read from Adobe Data Layer?
If you have already implemented Adobe analytics and would like FirstHive to read from the existing Adobe data layer. Please follow the below steps.
Place the additional code (marked in grey) after the FirstHive tag manager tag. This code reads the Adobe data layer and pushes it into FirstHive data layer. This can then be used to configure events in FirstHive Tag manager.
It is recommended to place the FH tag manager on the page (as instructed above) for better results. However, if that is not possible then place the additional code (marked in grey) on the page after the FH code e.g., Adobe tag manager (if that is from where the firsthive tag will be loaded on the page).
<!-- CDP Tag Manager -->
<script type="text/javascript">
var _mtm = _mtm || [];
_mtm.push({'mtm.startTime': (new Date().getTime()), 'event': 'mtm.Start'});
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
g.type='text/javascript'; g.async=true; g.defer=true; g.src='https://analytics.firsthive.com/js/container_GpMvEPV3.js'; s.parentNode.insertBefore(g,s);
var _paq = _paq || [];
</script>
<script>
digitalData.event=digitalData.channel;
var obj = digitalData;
console.log(digitalData);
var _mtm = _mtm || [];
mtm.push(obj);
console.log(_mtm);
</script>
<!-- End CDP Tag Manager -->
|
|
Click here to know how to set up tags in FirstHive Tag manager.