Our Analytics SDK is designed to provide practical benefits for your HypeLab ads. By integrating this SDK into your website, you will be able to easily share deeper funnel analytics events back to HypeLab, which will help our personalization algorithms learn about what works and what doesn't. Ultimately, this should translate into better return on ad spend (ROAS) for you.
When someone takes a specific action after interacting with your ad, that's a conversion. Sending a conversion tells us that a user is engaging in behavior that aligns with your goals! In web3 advertising, conversion actions can be anything from a user connecting their wallet to a player signing up for an NFT whitelist. If you celebrate it and count it as a win, you should be sending a conversion. Here are some of the most common conversions we see:
- Connecting a wallet
- Submitting a transaction
- Clicking on a "Join Discord" link
- Completing a quest
- Signing up for a whitelist
In order to send a conversion to our servers, you have to install the HypeLab Analytics SDK, but the installation process is simple! Most of our advertisers tell us that it takes them less than 10 minutes to get up and running. Plus, if you're already using a tag manager, like Google Tag Manager, then it's even faster.
-
Find the
<head>tag on your website or locate the header template in your CMS or web platform. -
Copy the code snippet below:
<script>!function(h,y,p,e,l,a,b){(l=document.createElement(h)).async=!0,l.src=y,l.onload=function(){a=new HypeLabAnalytics.Client({URL:p,propertySlug:e}),HypeLabAnalytics.setClient(a)},(b=document.getElementsByTagName(h)[0]).parentNode.insertBefore(l,b)}("script","https://api.hypelab.com/v1/scripts/ha-sdk.js?v=0","https://api.hypelab.com","<YOUR_PROPERTY_SLUG>");</script>- Paste the snippet at the bottom of the header section, just above the closing head tag:
<html>
<head>
...
<!-- Insert HypeLab Analytics here -->
</head>
<body>
...
</body>
</html>-
Change
<YOUR_PROPERTY_SLUG>to your own property slug. -
To track an event, like a conversion, add this JS function call wherever you want to track the event:
HypeLabAnalytics.logEvent("<EVENT_NAME>")-
Log in to Google Tag Manager and select your website account.
-
Press add a new tag and enter a name for your tag (e.g. "HypeLab Analytics").
-
Under Tag Configuration select Custom HTML Tag.
-
Paste the code snippet below:
<script>!function(h,y,p,e,l,a,b){(l=document.createElement(h)).async=!0,l.src=y,l.onload=function(){a=new HypeLabAnalytics.Client({URL:p,propertySlug:e}),HypeLabAnalytics.setClient(a)},(b=document.getElementsByTagName(h)[0]).parentNode.insertBefore(l,b)}("script","https://api.hypelab.com/v1/scripts/ha-sdk.js?v=0","https://api.hypelab.com","<YOUR_PROPERTY_SLUG>");</script>-
Change
<YOUR_PROPERTY_SLUG>to your own property slug. -
Under Triggering select All pages.
-
Save the newly created tag.
All GTM triggers are supported: link clicks, page loads, etc.
You can find detailed docs on triggers in the Google Tag Manager Help Center:
https://support.google.com/tagmanager/answer/7679316
-
Press add a new tag and enter a name for your tag (e.g. "HypeLab Analytics - Track Conversion").
-
Under Tag Configuration select Custom HTML Tag.
-
Enter the event code into the HTML input:
<script>HypeLabAnalytics.logEvent("<EVENT_NAME>")</script>-
Under Triggering select the trigger where you want the event to fire.
-
Save the newly created tag.
After you've finished setting up the events in Google Tag Manager, press Submit to deploy the workspace changes to your live website.
Q: What information does the SDK collect?
We collect the following:
- All automatic events and any custom events that you have instrumented.
- General browser information (e.g., URL, user agent, IP, etc.)
- Spam & fraud prevention data (e.g., HTTP headers, request IP, etc.) — needed to prevent spam attacks and bot traffic.
Q: What automatic events are sent from the SDK?
For our web SDK, we only send page loads at the moment. In the future, we may collect others, including clicks and page scroll actions.