> ## Documentation Index
> Fetch the complete documentation index at: https://docs.topsort.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Going Live

> Complete guide to preparing for and executing a smooth transition to production with comprehensive testing and monitoring strategies.

export const IntegrationsCard1A = () => {
  return <>
      <style>{`
        .integrations-card-1a {
          display: flex;
          flex-direction: column;
          background-color: #f0f2f4;
          border: 1px solid rgba(0, 0, 0, 0.08);
          border-radius: 12px;
          padding: 1.25rem 1.5rem;
          gap: 0.25rem;
          color: #25253b;
          box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02);
          transition: box-shadow 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
          margin-top: 2rem;
        }

        .integrations-card-1a:hover {
          box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
          border-color: rgba(0, 0, 0, 0.12);
        }

        .dark .integrations-card-1a {
          background-color: #25253b;
          color: #f6f8fa;
          border-color: rgba(255, 255, 255, 0.08);
          box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
        }

        .dark .integrations-card-1a:hover {
          box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
          border-color: rgba(255, 255, 255, 0.12);
        }

        .integrations-card-1a-avatar-row {
          display: flex;
          margin-left: 14px;
          flex-wrap: nowrap;
        }

        .integrations-card-1a-avatar {
          width: 44px;
          height: 44px;
          border-radius: 50%;
          border: 2px solid #f0f2f4;
          margin-left: -14px;
          object-fit: cover;
          box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
          pointer-events: none;
          cursor: default;
        }

        .dark .integrations-card-1a-avatar {
          border-color: #25253b;
          box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
        }

        .integrations-card-1a h2 {
          margin: 0;
          line-height: 1.25;
          font-size: clamp(1.25rem, calc(0.875rem + 1.25vw), 1.75rem);
          font-weight: 700;
          letter-spacing: -0.025em;
          color: #111827;
        }

        .dark .integrations-card-1a h2 {
          color: #f9fafb;
        }

        .integrations-card-1a-subtitle {
          font-size: 0.9375rem;
          font-weight: 500;
          line-height: 1.5;
          color: #4b5563;
          margin: 0;
        }

        .dark .integrations-card-1a-subtitle {
          color: #d1d5db;
        }

        .integrations-card-1a p {
          margin: 0;
          line-height: 1.5;
          font-size: 0.875rem;
          color: #374151;
        }

        .dark .integrations-card-1a p {
          color: #d1d5db;
        }

        .integrations-card-1a a {
          color: #0500ff;
          text-decoration: none;
          font-weight: 500;
          transition: color 0.15s ease;
        }

        .integrations-card-1a a:hover {
          color: #0400cc;
        }

        .dark .integrations-card-1a a {
          color: #8280ff;
        }

        .dark .integrations-card-1a a:hover {
          color: #a19fff;
        }

        @media (max-width: 640px) {
          .integrations-card-1a-avatar {
            width: 38px;
            height: 38px;
            margin-left: -12px;
          }

          .integrations-card-1a-avatar-row {
            margin-left: 12px;
          }
        }

        @media (min-width: 1280px) {
          .integrations-card-1a p {
            font-size: 0.6875rem;
            line-height: 1.4;
            letter-spacing: -0.01em;
          }

          .integrations-card-1a h2 {
            font-size: clamp(1rem, calc(0.75rem + 1vw), 1.25rem);
          }

          .integrations-card-1a-subtitle {
            font-size: 0.75rem;
          }
        }
      `}</style>
      <div className="integrations-card-1a">
        <div className="integrations-card-1a-avatar-row">
          <img src="/images/integration-team/agustin.webp" alt="Agustin - Integrations Team Member" loading="lazy" className="integrations-card-1a-avatar" />
          <img src="/images/integration-team/amelia.webp" alt="Amelia - Integrations Team Member" loading="lazy" className="integrations-card-1a-avatar" />
          <img src="/images/integration-team/bernardita.webp" alt="Bernardita - Integrations Team Member" loading="lazy" className="integrations-card-1a-avatar" />
          <img src="/images/integration-team/borumy.webp" alt="Borumy - Integrations Team Member" loading="lazy" className="integrations-card-1a-avatar" />
          <img src="/images/integration-team/felipe.webp" alt="Felipe - Integrations Team Member" loading="lazy" className="integrations-card-1a-avatar" />
          <img src="/images/integration-team/gui.webp" alt="Gui - Integrations Team Member" loading="lazy" className="integrations-card-1a-avatar" />
          <img src="/images/integration-team/javiera.webp" alt="Javiera - Integrations Team Member" loading="lazy" className="integrations-card-1a-avatar" />
          <img src="/images/integration-team/linn.webp" alt="Linn - Integrations Team Member" loading="lazy" className="integrations-card-1a-avatar" />
          <img src="/images/integration-team/marcio.webp" alt="Marcio - Integrations Team Member" loading="lazy" className="integrations-card-1a-avatar" />
          <img src="/images/integration-team/mateus.webp" alt="Mateus - Integrations Team Member" loading="lazy" className="integrations-card-1a-avatar" />
          <img src="/images/integration-team/max.webp" alt="Max - Integrations Team Member" loading="lazy" className="integrations-card-1a-avatar" />
          <img src="/images/integration-team/rodrigo.webp" alt="Rodrigo - Integrations Team Member" loading="lazy" className="integrations-card-1a-avatar" />
        </div>

        <h2>Need help with your Topsort integration?</h2>

        <p className="integrations-card-1a-subtitle">
          Talk to us, the integrations engineering team.
        </p>

        <p>
          Reach us via <strong>your dedicated messaging channel</strong> or at{" "}
          <a href="mailto:support@topsort.com">support@topsort.com</a>.
        </p>

        <p>
          If you're not a customer yet,{" "}
          <a href="https://www.topsort.com/book-a-demo">book a demo</a> with our
          sales team instead.
        </p>
      </div>
    </>;
};

Before moving to production, conduct thorough User Acceptance Tests (UAT) to ensure a smooth transition. This guide walks you through pre-launch preparation, testing procedures, deployment steps, and post-launch monitoring.

<Note>
  **Your go-live process may vary** depending on your integration path and ad formats. This guide covers the most common scenarios, but your specific implementation may differ. For example:

  * **Sponsored Listings** require full catalog integration with product data
  * **Banner Ads** may only require vendor/advertiser setup without product-level catalog
  * **Placement configurations** vary based on your ad format choices

  Work with your Topsort contact to confirm which sections apply to your integration.
</Note>

## Pre-Launch Checklist

<Tabs>
  <Tab title="Sponsored Listings">
    <AccordionGroup>
      <Accordion title="Catalog Integration">
        * [ ] Product feed is connected and updating regularly
        * [ ] All product attributes (id, name, price, image, category) are populated
        * [ ] Product availability is accurate
        * [ ] Category taxonomy is properly mapped (based on your agreed taxonomy structure)
      </Accordion>

      <Accordion title="Auctions Integration">
        * [ ] Auction requests include all required fields
        * [ ] Response handling is implemented
      </Accordion>

      <Accordion title="Events Integration">
        * [ ] Impression tracking fires when sponsored products are visible
        * [ ] Click tracking fires on product clicks (including "Add to Cart" if applicable)
        * [ ] Purchase events include all order details
        * [ ] User IDs are consistent across all events
      </Accordion>
    </AccordionGroup>
  </Tab>

  <Tab title="Banner Ads">
    <AccordionGroup>
      <Accordion title="Vendor/Advertiser Setup">
        * [ ] Vendors/advertisers are configured in the system
        * [ ] Placements or JSON templates are created in the system
        * [ ] Banner creative assets are uploaded and approved
        * [ ] Click-through URLs are configured correctly
        * [ ] (Optional) content standards are uploaded to the system
      </Accordion>

      <Accordion title="Auctions Integration">
        * [ ] Auction requests include all required fields
        * [ ] Banner placement IDs are correctly configured
        * [ ] Response handling returns banner creative data
        * [ ] Banner rendering logic is implemented
      </Accordion>

      <Accordion title="Events Integration">
        * [ ] Impression tracking fires when banner is visible
        * [ ] Click tracking fires on banner clicks
        * [ ] User IDs are consistent across all events
      </Accordion>
    </AccordionGroup>
  </Tab>
</Tabs>

### Common Configuration (All Ad Formats)

<AccordionGroup>
  <Accordion title="Environment Configuration">
    **API Credentials:**

    * [ ] Sandbox API keys are properly configured
    * [ ] Production API keys are ready (don't switch yet)
    * [ ] API keys are stored securely in environment variables
    * [ ] Key rotation process is documented

    **Environment Setup:**

    * [ ] Staging environment mirrors production configuration
    * [ ] All API endpoints are configured correctly
    * [ ] Timeout values are appropriate (recommended: 500-1000ms)
    * [ ] Error handling is implemented
  </Accordion>

  <Accordion title="UI/UX Verification">
    **Ad Display:**

    * [ ] Ad placements render correctly on all device types
    * [ ] Ad labels are clearly visible (see labeling guidelines below)
    * [ ] Ad images/creatives load properly with fallbacks
    * [ ] Click-through behavior works as expected

    **Performance:**

    * [ ] Page load times are acceptable with ads
    * [ ] Ads don't block critical page rendering
    * [ ] Mobile experience is optimized (touch targets, responsive layouts, fast load times)
    * [ ] Accessibility requirements are met
  </Accordion>

  <Accordion title="Monitoring & Analytics">
    **Instrumentation:**

    * [ ] Error tracking is configured (Sentry, Datadog, etc.)
    * [ ] Performance monitoring is in place
    * [ ] Custom dashboards are set up
    * [ ] Alerting thresholds are defined

    **Logging:**

    * [ ] API request/response logging is enabled
    * [ ] Error logs are being captured
    * [ ] Audit trail for ad events is configured
    * [ ] Log retention policies are set
  </Accordion>
</AccordionGroup>

### Ad Labeling Guidelines

<CardGroup cols={2}>
  <Card title="Recommended Labels" icon="tag">
    Use labels that clearly indicate promotional content while avoiding ad-blocker triggers:

    * **"Featured"**
    * **"Recommended"**
    * **"Client's Choice"**
    * **"Top Pick"**

    <Warning>
      Avoid using "Sponsored" or "Ad" as these terms are commonly targeted by ad blockers.
    </Warning>
  </Card>

  <Card title="European Customers (DSA Compliance)" icon="eu">
    If operating in the European Union, the **Digital Services Act (DSA)** requires:

    * [ ] Clear labeling that content is an advertisement
    * [ ] Display of the advertiser name in ad details
    * [ ] Transparency about why the ad was shown to the user

    Work with your legal team to ensure full DSA compliance.
  </Card>
</CardGroup>

## User Acceptance Testing (UAT)

### 1. Catalog Testing

<Tabs>
  <Tab title="Sponsored Listings">
    <Card icon="box" title="Verify Product Data">
      **In Topsort Admin Panel:**

      1. Navigate to Catalog section
      2. Verify products are visible and searchable
      3. Check that product data is complete:
         * Product names, images, and prices are correct
         * Categories are properly assigned
         * Product availability status is accurate

      **Test Campaign Creation:**

      1. Create a new test campaign named `UAT-TEST-[DATE]`
      2. Try adding products to the campaign
      3. Verify product search and filtering works
      4. Confirm product selection saves correctly

      **Expected Result:** All products should be selectable when creating campaigns, with accurate and complete information.
    </Card>
  </Tab>

  <Tab title="Banner Ads (Vendor Setup)">
    <Card icon="rectangle-ad" title="Verify Vendor/Banner Setup">
      **In Topsort Admin Panel:**

      1. Navigate to Vendors/Advertisers section
      2. Verify vendors are configured correctly
      3. Verify click-through URLs are correct

      **Test Campaign Creation:**

      1. Create a new test campaign named `UAT-TEST-[DATE]`
      2. Select banner ad format
      3. Configure targeting and bid settings
      4. Activate the campaign

      **Expected Result:** Banner campaigns should be creatable with proper creative assets and targeting options.
    </Card>
  </Tab>
</Tabs>

### 2. Auctions & Events Testing

<Tabs>
  <Tab title="Sponsored Listings">
    <CardGroup cols={2}>
      <Card icon="gavel" title="Auction Testing">
        **Setup:**

        * Create `UAT-TEST` campaign with 3-5 products
        * Set high bid amount (\$10+) to ensure wins
        * Activate the campaign

        **Test Scenarios:**

        1. Verify auction request is sent
        2. Check that winning products are returned
        3. Confirm products render on page

        **Validation:**

        * Check browser network tab for API calls
        * Verify auction response contains products
        * Ensure resolvedBidId is captured for event tracking
      </Card>

      <Card icon="chart-simple" title="Event Testing">
        **Test All Event Types:**

        **Impression Events:**

        * Load page with sponsored products
        * Verify impression event fires when ad is visible
        * Check resolvedBidId is included

        **Click Events:**

        * Click on sponsored product
        * Verify click event fires immediately
        * **Note:** "Add to Cart" actions also count as clicks if configured
        * Confirm navigation/action works correctly

        **Purchase Events:**

        * Complete a purchase with sponsored product
        * Verify purchase event includes:
          * Product ID and quantity
          * Order value and order ID
          * **User ID** (required for attribution)
      </Card>
    </CardGroup>
  </Tab>

  <Tab title="Banner Ads">
    <CardGroup cols={2}>
      <Card icon="gavel" title="Auction Testing">
        **Setup:**

        * Create `UAT-TEST` banner campaign
        * Set high bid amount to ensure wins
        * Activate the campaign

        **Test Scenarios:**

        1. Load page with banner placement
        2. Verify auction request is sent
        3. Check that winning banner creative is returned
        4. Confirm banner renders correctly on page

        **Validation:**

        * Check browser network tab for API calls
        * Verify auction response contains banner data
        * Ensure resolvedBidId is captured for event tracking
      </Card>

      <Card icon="chart-simple" title="Event Testing">
        **Test All Event Types:**

        **Impression Events:**

        * Load page with banner placement
        * Verify impression event fires when banner is visible
        * Check resolvedBidId is included

        **Click Events:**

        * Click on banner
        * Verify click event fires immediately
        * Confirm click-through URL navigation works

        **Note:** Purchase events may not apply to banner-only integrations unless you're tracking downstream conversions.
      </Card>
    </CardGroup>
  </Tab>
</Tabs>

<Tip>
  **Test with Two Different Users:** Perform all tests with at least two unique user sessions to verify proper user tracking and attribution.
</Tip>

### 3. Data Validation

<Steps>
  <Step title="Capture Test Evidence">
    **For Each Test User:**

    * Take screenshots of ad placements
    * Capture network requests showing API calls
    * Document order details for purchase events (if applicable)
    * Note timestamps for each action
  </Step>

  <Step title="Submit to Topsort">
    Send the following to your Topsort contact:

    * Screenshots of ad impressions
    * Network logs showing auction and event calls
    * Test campaign name and time range
    * User identifiers used in testing
  </Step>

  <Step title="Review Data Summary">
    Topsort will provide a summary including:

    * Total auctions received
    * Impression and click counts
    * Purchase counts (for listing ad integrations)
    * Data quality score
    * Any data discrepancies or issues

    **Verify Alignment:**

    * Numbers match your test actions
    * Attribution chain is complete
    * No missing or duplicate events
  </Step>
</Steps>

## Production Deployment

### Deployment Steps

<Steps>
  <Step title="Connect Production Catalog">
    <Tabs>
      <Tab title="Sponsored Listings">
        **Option 1: Product Feed**

        * Share your production feed URL with Topsort
        * Ensure feed is accessible and updates regularly
        * Recommended update frequency: Every 15-60 minutes

        **Option 2: Catalog API**

        * Use the [Catalog API](/en/ad-server/catalog/) for real-time updates
        * Implement create, update, and delete operations
        * Set up scheduled full catalog sync

        **Verify:**

        * Product count matches expectations
        * All required fields are populated
        * Images are loading correctly
      </Tab>

      <Tab title="Banner Ads">
        **Vendor Setup:**

        * Confirm all vendors/advertisers are configured
        * Verify banner creatives are uploaded and approved
        * Check click-through URLs are production-ready

        **Verify:**

        * All active vendors are visible in admin
        * Banner creatives display correctly
        * Targeting options are configured
      </Tab>
    </Tabs>
  </Step>

  <Step title="Obtain Production Credentials">
    **Using Topsort UI:**

    1. Topsort provides admin panel credentials
    2. You receive production API URL
    3. [Generate API keys](/en/api-reference/authentication) in admin
    4. Store keys securely in production environment

    **Using Custom UI:**

    1. Receive production API URL from Topsort
    2. Receive production API key(s)
    3. Configure keys in your environment

    <Warning>
      **Never commit API keys to version control.** Use environment variables or secure secret management systems.
    </Warning>
  </Step>

  <Step title="Deploy Integration Code">
    **Pre-Deployment:**

    * Review all code changes one final time
    * Ensure sandbox credentials are parameterized
    * Confirm rollback procedure is documented
    * Schedule deployment during low-traffic period

    **Deployment Process:**

    1. Deploy code to production environment
    2. Update environment variables with production credentials
    3. Restart services to pick up new configuration
    4. Verify application starts successfully

    **Immediate Verification:**

    * Check application logs for errors
    * Test basic functionality (page loads)
    * Verify API connectivity
  </Step>
</Steps>

### Traffic Ramping Strategy

<CardGroup cols={2}>
  <Card title="Gradual Rollout" icon="gauge-high">
    **Recommended Approach:**

    **Day 1-2:** 10% of traffic

    * Monitor closely for errors
    * Validate data accuracy
    * Check performance metrics

    **Day 3-5:** 50% of traffic

    * Compare metrics with baseline
    * Ensure system stability
    * Fine-tune if needed

    **Day 6+:** 100% of traffic

    * Full production launch
    * Continue monitoring
    * Optimize performance
  </Card>

  <Card title="Feature Flags" icon="flag">
    **Use Feature Flags to Control:**

    * Which placements show ads
    * Percentage of users seeing ads
    * A/B testing configurations
    * Emergency kill switch

    **Benefits:**

    * Instant rollback without deployment
    * Gradual rollout control
    * Per-placement configuration
    * Reduced deployment risk
  </Card>
</CardGroup>

## Post-Launch Monitoring

### Critical Metrics to Monitor

<AccordionGroup>
  <Accordion title="Technical Health">
    **API Performance:**

    * Auction API response time (target: \<500ms p95)
    * Event API success rate (target: >99.5%)
    * Error rates and types
    * API timeout frequency

    **Application Performance:**

    * Page load time impact
    * Time to first ad render
    * JavaScript errors
    * Memory usage patterns

    **Action Items if Issues Detected:**

    * Response time >1s: Review timeout settings
    * Error rate >1%: Check API credentials and network
    * High JS errors: Review client-side implementation
  </Accordion>

  <Accordion title="Data Quality">
    **Event Tracking:**

    * Impression-to-click ratio (typical: 1-5%)
    * Click-to-purchase ratio (typical: 2-10%, for listing ads)
    * Event volume consistency
    * Attribution completeness

    **Data Integrity:**

    * User IDs are present and consistent
    * resolvedBidIds are captured for impressions and clicks
    * Purchase amounts are reasonable (listing ads)
    * Duplicate events are minimal

    **Dashboard Checks:**

    * Compare Topsort dashboard with your analytics
    * Verify revenue attribution matches
    * Check for data gaps or spikes
  </Accordion>

  <Accordion title="Business Metrics">
    **Campaign Performance:**

    * Total impressions delivered
    * Click-through rate (CTR)
    * Conversion rate (listing ads)
    * Return on ad spend (ROAS)

    **User Experience:**

    * Ad viewability rates
    * User engagement with ads
    * Impact on organic conversion rate
    * Page bounce rate changes

    **Revenue Impact:**

    * Incremental revenue from ads
    * Average order value changes
    * Vendor adoption rate
    * Campaign creation velocity
  </Accordion>
</AccordionGroup>

### Troubleshooting Common Issues

<Tabs>
  <Tab title="Listing Ads">
    <CardGroup cols={2}>
      <Card title="No Products Showing" icon="circle-exclamation">
        **Possible Causes:**

        * No active campaigns
        * Bid amounts too low
        * Product targeting too narrow
        * Auction API errors

        **Debugging Steps:**

        1. Check browser console for errors
        2. Verify auction API response
        3. Confirm campaigns are active
        4. Review targeting criteria
      </Card>

      <Card title="Missing Purchase Events" icon="chart-line-down">
        **Possible Causes:**

        * Event not triggered on checkout
        * Missing user ID in event payload
        * Incorrect product ID format
        * Network failures

        **Debugging Steps:**

        1. Test purchase flow manually
        2. Check event payload structure
        3. Verify user ID is included
        4. Review server logs
      </Card>
    </CardGroup>
  </Tab>

  <Tab title="Banner Ads">
    <CardGroup cols={2}>
      <Card title="No Banners Showing" icon="circle-exclamation">
        **Possible Causes:**

        * No active banner campaigns
        * Bid amounts too low
        * Banner creative not approved
        * Auction API errors

        **Debugging Steps:**

        1. Check browser console for errors
        2. Verify auction API response
        3. Confirm campaigns are active
        4. Check creative approval status
      </Card>

      <Card title="Banner Not Rendering" icon="image">
        **Possible Causes:**

        * Creative URL inaccessible
        * Image format not supported
        * CORS issues
        * Container sizing issues

        **Debugging Steps:**

        1. Check creative URL directly
        2. Verify image loads in browser
        3. Check network tab for CORS errors
        4. Review container CSS
      </Card>
    </CardGroup>
  </Tab>

  <Tab title="Common Issues">
    <CardGroup cols={2}>
      <Card title="Performance Degradation" icon="gauge">
        **Possible Causes:**

        * Slow API responses
        * Blocking auction calls
        * Large image files
        * Too many placements

        **Solutions:**

        1. Implement proper timeouts
        2. Use async/non-blocking calls
        3. Optimize image loading
        4. Cache auction responses
      </Card>

      <Card title="Data Discrepancies" icon="triangle-exclamation">
        **Possible Causes:**

        * Double-counting events
        * Missing attribution chain
        * Time zone mismatches
        * Bot traffic

        **Investigation:**

        1. Compare raw event counts
        2. Check for duplicate IDs
        3. Verify timezone handling
        4. Review user agent filtering
      </Card>
    </CardGroup>
  </Tab>
</Tabs>

## Best Practices

<CardGroup cols={2}>
  <Card title="Communication" icon="comments">
    **Internal Coordination:**

    * Notify engineering team of deployment
    * Alert customer support of new features
    * Update sales team on capabilities

    **External Communication:**

    * Coordinate with Topsort team
    * Schedule launch calls
    * Establish escalation paths
  </Card>

  <Card title="Documentation" icon="book">
    **Maintain:**

    * Deployment runbooks
    * Rollback procedures
    * API integration specs
    * Troubleshooting guides

    **Keep Updated:**

    * Configuration changes
    * Known issues and workarounds
    * Performance benchmarks
  </Card>

  <Card title="Optimization" icon="arrows-maximize">
    **Continuous Improvement:**

    * Review performance weekly
    * Optimize slow queries
    * Refine targeting
    * Test new placements

    **A/B Testing:**

    * Ad placement positions
    * Number of ads per page
    * Ad formats and styles
    * Targeting strategies
  </Card>

  <Card title="Support" icon="headset">
    **Establish:**

    * On-call rotation
    * Incident response process
    * Topsort escalation contacts
    * SLA expectations

    **Document:**

    * Common support scenarios
    * Resolution procedures
    * Contact information
  </Card>
</CardGroup>

***

Once you're live, you're ready to start optimizing. Reach out to your Topsort contact for guidance on campaign strategies, attribution tuning, and advanced configurations.

<IntegrationsCard1A />
