Skip to main content

Onboarding Process

Step by step guide through the new customer journey for traditional websites, SPAs and apps

I
Written by Isaac Whelan

The Onboarding Email

After your initial approval waiting period you will receive an onboarding email from our Publisher Success team. This email includes:

After sending us your GAM status, please proceed to your setup guide.

Setup Guide

The setup guide has multiple, easy to follow steps and will guide you through the installation of our header ad script, the ads.txt redirect, placement configuration and our required compliance checks for GDPR and CCPA. If you are unable to log in to your account and access the setup guide, please reach out to us via the intercom bubble in the bottom right or send an email to [email protected].

Ad Script

Step 1 of the setup guide is the ad script - From your dashboard, copy your unique site ad script (example shown below) and place it within the <head> section of your website’s HTML.

<script data-cfasync="false">   window.nitroAds = window.nitroAds || {     createAd: function() {       return new Promise(e => { window.nitroAds.queue.push(["createAd", arguments, e]) })     },     addUserToken: function() {       window.nitroAds.queue.push(["addUserToken", arguments])     },     queue: []   }; </script> 

<script data-cfasync="false" async src="https://s.nitropay.com/ads-xxxx.js"></script>

Important: Each domain has a unique script (e.g. ads-xxxx.js). Only use the one assigned to the domain you’re integrating.

Learn more about the ad script integration here

SPA Specific Settings

If your site uses a SPA framework (such as React, Vue, or Angular), Nitro supports automatic ad refreshes when navigation occurs without reloading the page.

You have two options — use one of the following:

  1. Recommended: Add data-spa="auto" to your Nitro script tag. This automatically calls onNavigate() for all active ads whenever internal navigation is detected.

  2. Alternative: Manually invoke nitroAds.navigate() in your app’s route change handler to refresh ad instances.

Example – Recommended data-spa="auto" Integration

<script data-cfasync="false">   window.nitroAds = window.nitroAds || {     createAd: function() {       return new Promise(e => { window.nitroAds.queue.push(["createAd", arguments, e]) })     },     addUserToken: function() {       window.nitroAds.queue.push(["addUserToken", arguments])     },     queue: []   }; </script> 

<script data-cfasync="false" async src="https://s.nitropay.com/ads-xxxx.js" data-spa="auto"></script>

This approach ensures all active ad placements are refreshed automatically as users navigate through your app — no manual calls required. You will still have to clean up ads that do not persist across multiple page views by removing their element from the DOM.
The data-spa="auto" attribute is lightweight, reliable, and compatible with all major front-end frameworks.

Ads.txt

Step 2: Redirect Your ads.txt

Your ads.txt file confirms which sellers are authorized to represent your ad inventory — required by all major ad exchanges.

To ensure proper validation, set up a 301 redirect from your domain’s /ads.txt to your hosted Nitro version:

https://api.nitropay.com/v1/ads-xxxx.txt

This approach allows Nitro to keep your file up to date as new exchanges are added.
Custom entries can be added in your Dashboard → ads.txt tab.

Learn more about your ads.txt redirect options here

Ad Placement Configuration

Step 3: Configure Ad Placements

Use the Placement Builder in your dashboard to create ad units tailored to your layout.
Each placement will generate its own code snippet for you to embed on your site.

For advanced customization, see: Special Ad Formats

It is important to note that you can test ads without fill using placeholders by enabling the "demo" flag. You can either use a query string of ?nitro_demo=1 on the page, add demo: "true" to the createAd config or set the data-demo attribute to "true" on the ad script. This setting should only be used for testing, not in a production environment.

Testing and Debugging

An important note for testing ad placements - be sure to double check the ad scripts output for any errors, and to ensure the script is functioning appropriately. To do so append ?nitroads_debug=1 to the URL and check your dev console. You can also alter the data-log-level attribute from 0-5 (https://api-docs.nitropay.com/index.html#md:log-level), or use nitroAds.setlevel().

Demo units

You can also load placeholder demo units by appending ?nitro_demo=1 to the end of the URL, adding demo: "true" to your createAd call, or by setting data-demo on the script attributes.

Compliance and Privacy Policy

Advertising partners require privacy and consent compliance under regional laws.
Please review and implement the steps relevant to your audience.

CCPA (California Consumer Privacy Act)

  • Add a “Do Not Sell My Personal Information” link to your site.

  • Update your privacy policy with CCPA disclosures.

  • Review our CCPA Compliance Guide for implementation details.

GDPR & Consent Management

If your traffic includes users from the EU/EEA:

  • Implement a CMP consent resurfacing link following our CMP Consent Guide.

  • Update your privacy policy to include GDPR language and consent details.

Recommended Quick-Start Layout

To achieve a solid baseline of performance to build off of, we recommend beginning with a balanced layout that maximizes engagement and maintains a healthy content-to-ad ratio - while also covering your bases with a variety of ad formats.

Core Elements

  • Anchor Ad: Persistent banner at the bottom of the viewport.

  • Floating Video Player: Enabled on both desktop and mobile.

  • Sticky Side Rail (Desktop Only): Include one if space allows.

    • For mobile, there is no substitute for this placement, you need to use In-content units for additional ad density

  • In-Content Ads: At most one ad per page height, excluding the initial page paint area.

Layout Targets

  • Maximum Content-to-Ad Ratio: ~70% content / 30% ads

  • Maximum Ads Displayed Simultaneously: 4

  • Avoid excessive ad loads above the fold as these can attribute to higher bounce rates and negative impacts to page speed.

    • Ads that load at the top or bottom of the page do not perform well, either, you're better off finding a spot within the content to serve those slots.

These guidelines ensure strong initial monetization while preserving user experience, engagement, and page performance.

Learn more about our ad formats and their settings here

Customer Success Review

We highly recommend that your first pass at a Nitro integration is done via a staging environment or test page using our demo ads, and then passed over to our success team for review and analysis. If we find any issues we'll let you know - otherwise we'll give you a thumbs up and you're good to get started. Please reach us at either [email protected] or via the green Intercom bubble in the bottom right of your dashboard.

Final Review Checklist

✅ User account created and dashboard access verified
✅ Ad script installed in <head>
✅ data-spa="auto" or nitroAds.navigate() integrated (if SPA)
✅ ads.txt redirect configured
✅ Ad placements created and tested
✅ CCPA/GDPR compliance implemented
✅ Balanced starting layout deployed

✅ Success team contacted with your initial layout or staging environment

Did this answer your question?