Integration Overview

Choose the right integration approach for your Ring DAS implementation

Integration Overview

Ring DAS offers multiple integration approaches to fit different use cases, technical requirements, and implementation timelines. This guide helps you choose the right method and get started quickly.

Integration Approaches

Ring DAS provides three primary integration methods:

1. JavaScript SDK (Recommended for Most Use Cases)

Best for: Client-side ad serving on websites and web applications

Advantages:

  • Fastest implementation (15-minute quick start)
  • Automatic ad rendering and event tracking
  • Built-in viewability measurement
  • Minimal backend development required
  • Automatic session management

Disadvantages:

  • Requires JavaScript enabled on client
  • May be blocked by ad blockers
  • Limited control over request/response handling

Use cases:

  • Standard display advertising
  • Sponsored content
  • Product recommendations
  • Retail media placements

2. HTTP API (Server-to-Server)

Best for: Server-side rendering, native apps, custom implementations

Advantages:

  • Full control over ad request and rendering
  • No client-side JavaScript required
  • Bypass ad blockers
  • Custom caching strategies
  • Integration with backend systems

Disadvantages:

  • Requires backend development
  • Manual impression/click tracking
  • Viewability measurement requires additional implementation

Use cases:

  • Mobile applications (iOS, Android)
  • AMP pages
  • Server-side rendering (SSR) frameworks
  • Email newsletters
  • Digital signage

3. Tag Manager Integration

Best for: Publishers already using Google Tag Manager or similar platforms

Advantages:

  • No code deployment required
  • Managed through GTM interface
  • Version control and testing via GTM
  • Easy A/B testing

Disadvantages:

  • Dependent on tag manager platform
  • Limited customization options
  • Additional latency from tag manager layer

Use cases:

  • Publishers with existing GTM setup
  • Multi-platform ad management
  • Quick testing and iteration

Decision Matrix

Choose your integration approach based on your requirements:

RequirementJavaScript SDKHTTP APITag Manager
Quick Setup (< 1 hour)✅ Excellent❌ No✅ Excellent
Mobile App Support❌ No✅ Excellent❌ No
Server-Side Rendering⚠️ Limited✅ Excellent❌ No
Ad Blocker Resistance❌ No✅ Excellent❌ No
Automatic Event Tracking✅ Excellent⚠️ Manual✅ Excellent
Viewability Measurement✅ Excellent⚠️ Manual✅ Excellent
Custom Rendering⚠️ Limited✅ Excellent❌ No
No-Code Deployment❌ No❌ No✅ Excellent

Prerequisites

Before integrating Ring DAS, ensure you have:

Required

  • Ring DAS account - Contact your account manager or request access
  • Network ID - Your unique tenant identifier (provided during onboarding)
  • Placement IDs - Ad unit identifiers for where ads will appear
  • Test environment - Development/staging site for integration testing

Recommended

  • API credentials - For programmatic campaign management (optional)
  • Analytics tools - Google Analytics, Adobe Analytics, or similar
  • GDPR compliance - Consent management platform (CMP) integration
  • Test ad campaigns - Sample campaigns for validation

Initial Setup

Step 1: Configure Your Network

  1. Log in to Ring DAS platform at your assigned URL
  2. Navigate to SettingsNetwork Configuration
  3. Verify or configure:
    • Network name and ID
    • Default currency (USD, EUR, etc.)
    • Time zone
    • Default language

Step 2: Create Ad Inventory

Set up your ad placements in Inventory Manager:

  1. Navigate to InventoryAd Units

  2. Click Create Ad Unit

  3. Configure:

    • Name: Descriptive name (e.g., "Homepage Banner")
    • Size: Dimensions in pixels (e.g., 728x90, 300x250)
    • Placement Type: Display, Video, Native, etc.
    • Floor Price: Minimum CPM (optional)
  4. Save and note the Placement ID (you'll need this for integration)

Step 3: Create a Test Campaign

Create a simple campaign for testing:

  1. Navigate to CampaignsDeals

  2. Click Create Deal

  3. Configure:

    • Name: "Test Campaign"
    • Advertiser: Select or create test advertiser
    • Start/End Date: Set to current date range
    • Budget: Set to unlimited or small amount
  4. Add a Line Item:

    • Type: Standard
    • Priority: Standard
    • Targeting: No targeting (deliver to all)
    • Pricing: CPM $1.00
  5. Upload a Creative:

    • Use a simple 728x90 or 300x250 image
    • Or use test creative from Ring DAS library
  6. Activate the campaign

15-Minute Quick Start

Get ads serving on your site in 15 minutes:

Quick Start Steps

<!-- Step 1: Add Ring DAS SDK to your HTML head -->
<script async src="https://cdn.ringdas.com/sdk/v1/ringdas.js"></script>

<!-- Step 2: Initialize the SDK -->
<script>
  window.ringDAS = window.ringDAS || [];
  ringDAS.push(function() {
    ringDAS.init({
      networkId: 'YOUR_NETWORK_ID',  // Replace with your Network ID
      debug: true                     // Enable debug mode for testing
    });
  });
</script>
<!-- Step 3: Add ad placement to your page body -->
<div id="ad-placement-1"
     class="ringdas-ad"
     data-placement-id="PLACEMENT_ID"
     data-size="728x90">
  <!-- Ad will render here -->
</div>

<script>
  // Step 4: Request and display the ad
  ringDAS.push(function() {
    ringDAS.displayAd('ad-placement-1', {
      placementId: 'PLACEMENT_ID',  // Replace with your Placement ID
      size: '728x90'
    });
  });
</script>

Test Credentials (Sandbox Environment)

Use these credentials for initial testing:

Network ID: demo-network-12345
Placement ID: demo-placement-banner-728x90
Sandbox URL: https://sandbox.ringdas.com
API Endpoint: https://api-sandbox.ringdas.com/v1

Sandbox Limitations: The sandbox environment is for testing only. It has rate limits (100 requests/hour) and campaigns are automatically deleted after 24 hours. Do not use for production traffic.

Verify Integration

After implementing the quick start code:

  1. Open your page in a browser

  2. Check browser console for:

    [Ring DAS] SDK initialized successfully
    [Ring DAS] Ad request sent for placement: PLACEMENT_ID
    [Ring DAS] Ad rendered successfully
  3. Verify ad display:

    • Ad creative should be visible in the placement div
    • Click the ad to verify click tracking
    • Check that impression is tracked (see debug console)
  4. Check Ring DAS dashboard:

    • Navigate to ReportsReal-Time
    • Verify impression and click events appear

Integration Patterns by Use Case

Pattern 1: Publisher Website (Standard Display Ads)

Recommended: JavaScript SDK

<!-- Header Integration -->
<script async src="https://cdn.ringdas.com/sdk/v1/ringdas.js"></script>
<script>
  ringDAS.push(function() {
    ringDAS.init({ networkId: 'YOUR_NETWORK_ID' });
  });
</script>

<!-- Ad Placements Throughout Page -->
<div class="ringdas-ad" data-placement-id="header-banner"></div>
<div class="ringdas-ad" data-placement-id="sidebar-box"></div>
<div class="ringdas-ad" data-placement-id="footer-banner"></div>

Pattern 2: E-commerce Site (Retail Media)

Recommended: JavaScript SDK + Pixel API

<!-- Ad serving + eCommerce tracking -->
<script async src="https://cdn.ringdas.com/sdk/v1/ringdas.js"></script>
<script async src="https://cdn.ringdas.com/pixel/v1/pixel.js"></script>

<script>
  // Initialize ad serving
  ringDAS.push(function() {
    ringDAS.init({ networkId: 'YOUR_NETWORK_ID' });
  });

  // Initialize tracking pixel
  dlApi.cmd.push(function(dlApi) {
    dlApi.init({
      network: 'YOUR_NETWORK_ID',
      pixelId: 'YOUR_PIXEL_ID'
    });
  });
</script>

<!-- Sponsored product placements -->
<div class="sponsored-products" data-placement-id="search-results-sponsored"></div>

Pattern 3: Mobile Application (iOS/Android)

Recommended: HTTP API

// iOS Example (Swift)
import Foundation

class RingDASClient {
    let networkId: String
    let apiUrl = "https://api.ringdas.com/v1"

    func requestAd(placementId: String, completion: @escaping (AdResponse?) -> Void) {
        let url = URL(string: "\(apiUrl)/ads/request")!
        var request = URLRequest(url: url)
        request.httpMethod = "POST"
        request.setValue("application/json", forHTTPHeaderField: "Content-Type")

        let body: [String: Any] = [
            "networkId": networkId,
            "placementId": placementId,
            "device": [
                "type": "mobile",
                "os": "iOS",
                "osVersion": UIDevice.current.systemVersion
            ]
        ]

        request.httpBody = try? JSONSerialization.data(withJSONObject: body)

        URLSession.shared.dataTask(with: request) { data, response, error in
            // Handle response
            completion(parseAdResponse(data))
        }.resume()
    }
}

Pattern 4: Server-Side Rendering (Next.js, Nuxt, etc.)

Recommended: HTTP API (server-side) + Event Tracking (client-side)

// Next.js API Route: pages/api/ads/[placementId].js
export default async function handler(req, res) {
  const { placementId } = req.query;

  const response = await fetch('https://api.ringdas.com/v1/ads/request', {
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify({
      networkId: process.env.RINGDAS_NETWORK_ID,
      placementId: placementId,
      device: req.headers['user-agent']
    })
  });

  const adData = await response.json();
  res.status(200).json(adData);
}

Security Considerations

API Authentication

All API requests require authentication:

curl -X POST https://api.ringdas.com/v1/ads/request \
  -H "Authorization: Bearer YOUR_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{
    "networkId": "YOUR_NETWORK_ID",
    "placementId": "PLACEMENT_ID"
  }'

Best practices:

  • Store API keys in environment variables (never in code)
  • Use separate API keys for development, staging, and production
  • Rotate API keys every 90 days
  • Revoke unused API keys immediately

GDPR Compliance

Integrate with your Consent Management Platform (CMP):

ringDAS.push(function() {
  ringDAS.setConsent({
    analytics: userConsent.analytics,        // true/false
    personalization: userConsent.targeting,  // true/false
    marketing: userConsent.marketing         // true/false
  });

  ringDAS.init({ networkId: 'YOUR_NETWORK_ID' });
});

Content Security Policy (CSP)

Add Ring DAS domains to your CSP headers:

Content-Security-Policy:
  script-src 'self' https://cdn.ringdas.com https://api.ringdas.com;
  img-src 'self' https://cdn.ringdas.com https://pixel.ringdas.com;
  connect-src 'self' https://api.ringdas.com https://pixel.ringdas.com;

Performance Optimization

Lazy Loading

Load ads only when they enter the viewport:

ringDAS.push(function() {
  ringDAS.init({
    networkId: 'YOUR_NETWORK_ID',
    lazyLoad: true,                // Enable lazy loading
    lazyLoadMargin: '200px'        // Load 200px before viewport
  });
});

Ad Caching

Cache ad responses on the server for improved performance:

// Server-side caching (Node.js example)
const cache = new Map();
const CACHE_TTL = 60000; // 60 seconds

async function getAd(placementId) {
  const cacheKey = `ad:${placementId}`;
  const cached = cache.get(cacheKey);

  if (cached && Date.now() - cached.timestamp < CACHE_TTL) {
    return cached.data;
  }

  const adData = await fetchAdFromRingDAS(placementId);
  cache.set(cacheKey, { data: adData, timestamp: Date.now() });

  return adData;
}

Minimize Latency

Reduce ad serving latency:

  1. Use CDN endpoints - Ring DAS automatically routes to nearest edge location
  2. Batch ad requests - Request multiple placements in single API call
  3. Prefetch ads - Request ads before they're needed
  4. Implement timeouts - Don't wait longer than 500ms for ad response

Next Steps

Choose your integration path:

JavaScript SDK Integration

Learn how to make ad requests using the JavaScript SDK

HTTP API Integration

Implement server-side ad requests via HTTP API

Event Tracking Setup

Set up DAS Pixel for conversion tracking and analytics

Testing Your Integration

Validate and test your Ring DAS implementation

Support

Need help with your integration?

Related Topics