Quick Start Guide

Prerequisites

The quick start guide assumes:

  • You want to jump right in and prefer to just figure it out
  • You already have an HTL BID account
  • You already use Google Ad Manager (GAM)
  • You already have ads running successfully via GAM
  • You know HTML and Javascript

Not you? That’s okay - you can still use HTL BID!

Your technical account manager will walk you through every step of the onboarding process.

Review the complete Implementation Guide to learn more.

Video Quick Start

Login

First you need to login to HTLBID

Setup a new Site

Next, create a new “Site” in HTL BID

  • Click the “create site” button
  • Enter the domain name of your website
  • Click “configure site”

Next, edit the latest version of your newly created site.

  • Click the “1” to edit the latest version

Now you are editing the HTL BID configuration.

Next, configure GAM settings

  • Click “Account Information”
  • Under “GAM Setup”, input your GAM Network ID

Next, configure CMP settings

  • Click “Consent Management”
  • Under “name”, input the name of your CMP
    • If you don’t have a CMP yet, you can put “none” here
    • A CMP must be configured before the final “go live”

Create an ad slot

Next, create one or more Ad Slots

  • Click “ad configuration”
  • Set the “slot name” to “leaderboard”
  • Click the down arrow to expand the slot
  • Input the name of your GAM Ad Unit
  • Under “device”, choose “All Viewports” which will cause this slot to render on all screen sizes
  • Click “sizes” and input “728x90”

Save and build

Finally, save your changes

  • Click the “Save and build” button
  • Write a short note describing your changes, such as “created first ad slot”

Clicking “save and build” instructs HTL BID to save your edits as a new revision. Behind the scenes HTL BID will build a custom javascript file that contains all your configuration settings. Every revision is stored, so that you can review and rollback changes if necessary.

You will see a “status” button that says “Pending”.

  • Wait 1-2 minutes
  • The button will automatically transition to “Running” and then “Success”.

After the button says “Success”

  • Click “Success”
  • Click the “Instructions” link

Add code to your webpage

Finally, on the “Instructions” page in Step 2, you will see a code snippet that you need to implement in order to integrate HTL BID into your webpage.

Add this script in the HEAD of your webpage. This script loads the HTL BID javascript library.

<script async src="https://htlbid.com/stage/v3/example.com/htlbid.js" ></script>
NOTE: The URL above is “example.com”. The URL of your script tag will be different, depending on domain you configured above.

Next, add these lines of javascript to your site. This code initializes HTL BID.

<script>
  window.htlbid = window.htlbid || {};
  htlbid.cmd = htlbid.cmd || [];
  htlbid.cmd.push(() => {
    htlbid.layout();
  });
</script>

Finally, add a new DIV to your page where you want the leaderboard slot to appear

<div class="htlad-leaderboard"></div>
NOTE: the class name above assumes that you named your slot “leaderboard”. If you changed the slot name, then you will need to use that class name here instead.

You’re Done!

Implementation is complete. Reload your webpage and you should see ads using HTL BID.

If ads did not render, see the Troubleshooting section below

This quick start was intended to get you up-and-running with HTL BID as quickly as possible, and it barely scratches the surface. There are LOTS of features and configuration options available. We suggest that you read the full implementation guide to learn more about:

Troubleshooting

Ad delivery is a multi-step process, and an error at any stage can prevent rendering. If ads did not render, there are several things that may be wrong.

If you have followed the Quick Start steps above, but ads are not rendering, check out our troubleshooting guide for debugging instructions and a list of the most common problems that publishers encounter with ad rendering.

If you still need help after troubleshooting, please contact HTL for assistance.