Integration guide

Welcome to the HighVibes Media integration guide! This document provides a step-by-step approach to integrating our platform into your webpage. We offer two integration options: a basic integration and an integration for Google Ad Manager.

This guide will walk you through both, explaining what each attribute does, and how to ensure the integration works perfectly for your needs.

Table of contents

  1. Standard Integration Script
  2. Google Ad Manager Integration Script
  3. Explanation of Attributes
  4. Prebid Integration
  5. Sample Scripts

Integration Scripts

Update (May 2025):
We now recommend using our new JavaScript integration method for improved flexibility and future features.
The previous script tag integration remains fully supported and backwards compatible.
Please use the latest version if possible.

Add the following JavaScript snippet to your webpage.
Replace the values for tagId, gc, gi, and targetId as needed:

<script>
!function(i){var a=window,e=i&&i.tagId,t=document;if(e){var d=a.HIGHVIBES_=a.HIGHVIBES_||{};d[e]=d[e]||{},d[e].config=i,d[e].initialized=!1;var n=t.createElement("script");n.async=!0,n.src="https://static.highvibes.media/libs/hia/hvm-integration.js",(t.head||t.body).appendChild(n)}else console.error("HIGHVIBES_: tagId missing")}
({
  tagId:"xxxxxxx"
});
</script>

Steps to Implement:

  • Place this <script> block in the <head> or <body> section of your webpage.
  • Replace the values with those provided by HighVibes Media.
  • See Explanation of Attributes for details.

Previous Integration Script (Still Supported)

You can still use the previous script tag integration if you prefer:

<script
  async
  id="hvm-integration"
  src="https://static.highvibes.media/libs/hia/hvm-integration.js"
  data-tagId="xxxxxxx"
></script>

Both integration methods are fully supported and will continue to work.

For integration with Google Ad Manager, use the following script:

<script>
!function(i){var a=window,e=i&&i.tagId,t=document;if(e){var d=a.HIGHVIBES_=a.HIGHVIBES_||{};d[e]=d[e]||{},d[e].config=i,d[e].initialized=!1;var n=t.createElement("script");n.async=!0,n.src="https://static.highvibes.media/libs/hia/hvm-integration.js",(t.head||t.body).appendChild(n)}else console.error("HIGHVIBES_: tagId missing")}
({
  tagId:"xxxxxxx",
  gc:"%%CLICK_URL_UNESC%%",
  gi:"%%VIEW_URL_UNESC%%"
});
</script>

Steps to implement:

  • Place this <script> tag in the <head> or <body> section of your webpage.
  • Replace the tagId with your unique Tag ID.
  • The gc and gi attributes are Google Ad Manager macros. These will automatically be replaced by the correct URLs for tracking clicks and impressions when the script runs.
  • See Explanation of Attributes for additional script attributes

Important Note on Google Ad Manager View Macros:

When adding a third-party creative in Google Ad Manager, only use the View macro (gi) for Simple URL tags and out-of-page creatives. Using the View macro for other creative types may cause double-counting of impressions. For more details, see the official Google Ad Manager documentation.

By using this script with the correct macros, Google Ad Manager will accurately track clicks and impressions, ensuring proper ad reporting.

Setup requirements

To ensure the successful operation of the HighVibes Media integration script, please ensure the following conditions are met:

  1. Avoid secure frames and safeframes

    The integration script must not be placed in a secure frame or safeframe. These environments impose restrictions that prevent the script from executing correctly, leading to issues such as:

    • Inability to fetch or render ads correctly.
    • Restricted communication between the script and the webpage.
    • Blocked access to necessary tracking and analytics functionality.

  2. Script placement

    The script can be placed in the <head> or <body> section where you desire.

  3. Only one integration script per page

    HighVibes Media supports only one integration script per website.

  4. Only use IDs provided by HighVibes Media

    IDs and placement names corresponds to your account in HighVibes Media.

Attributes

AttributeDescription
tagIdHolds your Placement ID in HighVibes Media platform.
targetIdCorresponds to the DIV tag appended to the page where the creative scripts will be loaded.
gc(GAM only) A macro used for tracking clicks on ads. When the script runs, this macro is replaced with the correct URL by Google Ad Manager.
gi(GAM only) A macro used for tracking ad impressions (views). It gets replaced with the correct URL for tracking views.
xxxxxxx

Prebid integration

We support being added as a bidder in your existing Prebid setup. Use the configuration snippet below to include us as a bidder.

Configuration Example:

{
  "bidder": "appnexus",
  "params": {
    "member": 16496,
    "placementId": "xxxxxxx",
    "usePaymentRule": false
  }
}

Requirements:

  1. Include AppNexus Bidder Adapter:

    • Ensure the AppNexus bidder adapter is included in your Prebid library build.
    • You can check Prebid’s documentation to verify the adapter is enabled in your configuration.

    Adapter Info: https://docs.prebid.org/dev-docs/bidders/appnexus.html

  2. Size Agreement:

    • Ensure that our bid profile is included for the banner sizes we support or have agreed upon with your team. For instance, if we support 300x250 and 320x50, these sizes should be explicitly configured in your ad unit setup.

Sample scripts

Please only use scripts and IDs provided by HighVibes Media.

Custom placement name

Use the targetId attribute to add the custom placement name. Only run 1 integration script on your page

<script>
!function(i){var a=window,e=i&&i.tagId,t=document;if(e){var d=a.HIGHVIBES_=a.HIGHVIBES_||{};d[e]=d[e]||{},d[e].config=i,d[e].initialized=!1;var n=t.createElement("script");n.async=!0,n.src="https://static.highvibes.media/libs/hia/hvm-integration.js",(t.head||t.body).appendChild(n)}else console.error("HIGHVIBES_: tagId missing")}
({
  tagId:"xxxxxxx",
  gc:"%%CLICK_URL_UNESC%%",
  gi:"%%VIEW_URL_UNESC%%",
  targetId:"hvm_floorad_mobile"
});
</script>