> ## 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.

# Fallback und A/B-Tests

> Führen Sie Topsort neben bestehenden Werbeservern mit Fallback-Logik aus

export const IntegrationsCard1ADe = () => {
  return <>
      <style>{`
        .integrations-card-1a-de {
          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-de:hover {
          box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
          border-color: rgba(0, 0, 0, 0.12);
        }

        .dark .integrations-card-1a-de {
          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-de:hover {
          box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
          border-color: rgba(255, 255, 255, 0.12);
        }

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

        .integrations-card-1a-de-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-de-avatar {
          border-color: #25253b;
          box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
        }

        .integrations-card-1a-de 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-de h2 {
          color: #f9fafb;
        }

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

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

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

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

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

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

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

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

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

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

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

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

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

        <h2>Brauchen Sie Hilfe bei Ihrer Topsort-Integration?</h2>

        <p className="integrations-card-1a-de-subtitle">
          Sprechen Sie mit uns, dem Integrations-Engineering-Team.
        </p>

        <p>
          Erreichen Sie uns über <strong>Ihren dedizierten Nachrichtenkanal</strong> oder unter{" "}
          <a href="mailto:support@topsort.com">support@topsort.com</a>.
        </p>

        <p>
          Falls Sie noch kein Kunde sind,{" "}
          <a href="https://www.topsort.com/book-a-demo">buchen Sie eine Demo</a> mit unserem
          Vertriebsteam.
        </p>
      </div>
    </>;
};

Wenn der Einzelhändler bereits Werbung mit einem Werbeserver schaltet, ist es möglich, ihn neben Topsort mit Fallback-Logik zu betreiben. Dies ermöglicht es Einzelhändlern, die Leistung von Werbeservern zu vergleichen und Füllraten zu erhöhen.

## Anwendungsfälle

<CardGroup cols={2}>
  <Card title="Fallback-Logik" icon="arrow-down">
    Verwenden Sie einen sekundären Werbeserver, wenn Topsort keine Gewinner zurückgibt, um maximale
    Füllrate zu gewährleisten
  </Card>

  <Card title="A/B-Tests" icon="vials">
    Vergleichen Sie die Leistung von Werbeservern unter Verwendung von Zielgruppensegmenten oder Traffic-Aufteilungen
  </Card>
</CardGroup>

## Wie es funktioniert

Wenn beispielsweise der Einzelhändler Werbebanner über GAM (Google Ad Manager) verwendet, kann er Topsort als primären Werbeserver festlegen, um sicherzustellen, dass seine direkt verkauften Kampagnen Vorrang vor der Nachfrage von GAM haben.

Werbeanfragen und Interaktionen von Anzeigen, die nicht von Topsort geschaltet wurden, können an Topsort gemeldet werden, um Metriken an einem Ort zu sehen und zu vergleichen.

<Steps>
  <Step title="Mit Topsort integrieren">
    Richten Sie Topsort als Ihren primären Werbeserver mit einer der Integrationsmethoden
    (API, SDK oder Low-Code) ein.
  </Step>

  <Step title="Zuerst Topsort-Anzeige anfordern">
    Fordern Sie in Ihrer Anzeigenschaltungslogik immer zuerst eine Anzeige von Topsort an.
  </Step>

  <Step title="Gewinner prüfen">
    Wenn Topsort Gewinner zurückgibt, zeigen Sie die Topsort-Anzeige an.
  </Step>

  <Step title="Zum sekundären wechseln">
    Wenn keine Gewinner zurückgegeben werden, fordern Sie eine Anzeige von Ihrem sekundären Werbeserver an.
  </Step>
</Steps>

## Beispielimplementierung

```javascript theme={null}
async function displayAd() {
  try {
    const response = await fetch("https://api.topsort.com/v2/auctions", {
      method: "POST",
      headers: { "Content-Type": "application/json" },
      body: JSON.stringify({
        // Ihre Auktionsanfrage-Parameter
      }),
    });
    const auctionData = await response.json();

    if (auctionData?.results?.winners) {
      console.log("Topsort-Anzeige angezeigt.");
      return; // Frühzeitiger Ausstieg - Topsort-Anzeige wird angezeigt
    } else {
      console.log("Keine Topsort-Anzeige verfügbar.");
    }
  } catch (error) {
    console.error("Fehler beim Abrufen der Topsort-Anzeige:", error);
  }

  // Zum sekundären Netzwerk wechseln
  if (secondaryNetwork) {
    // Anzeige vom sekundären Netzwerk anzeigen
    console.log("Sekundäre Anzeige anzeigen.");
  } else {
    console.warn("Kein sekundäres Werbenetzwerk konfiguriert.");
  }
}

displayAd();
```

## A/B-Test-Ansatz

Für A/B-Tests ändern Sie die Auswahllogik unter Verwendung von:

* **Zielgruppensegmente** - Leiten Sie spezifische Benutzersegmente zu verschiedenen Werbeservern
* **Traffic-Aufteilung** - Weisen Sie zufällig einen Prozentsatz des Traffics jedem Werbeserver zu

<Note>
  Melden Sie alle Anzeigeninteraktionen (einschließlich von sekundären Werbeservern) an Topsort, um
  Metriken in einem einheitlichen Dashboard zu vergleichen.
</Note>

<IntegrationsCard1ADe />