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

# Algolia

> Auktionsergebnisse mit einem bestehenden Algolia-Index integrieren

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>
    </>;
};

Diese Anleitung zeigt, wie Sie Topsort-Auktionsergebnisse mit Ihrem bestehenden Algolia-Index integrieren, sodass organische und beworbene Produkte im selben Ablauf aufgelistet werden können.

Algolia ist eine leistungsstarke Suchmaschine, die schnelle und relevante Ergebnisse für die Navigation in Katalogen liefert. Durch die Integration von Algolia mit Topsort können wir Ihren Katalog direkt mit Topsort synchronisieren, ohne zusätzliche Katalogintegrationen zu benötigen. Die Integration ermöglicht es Ihnen auch, beworbene Produkte in den von Algolia zurückgegebenen organischen Ergebnissen zu priorisieren. Weitere Details finden Sie in der Proxy-Integration von Topsort.

## Funktionsweise

<Steps>
  <Step title="Voraussetzungen">
    Um Topsort mit Algolia zu integrieren, stellen Sie sicher, dass Sie diese Voraussetzungen erfüllen:

    * Ihr Produktkatalog ist in einem Algolia-Index gespeichert.
    * Sie fragen Algolia mit dem Algolia SDK ab.
  </Step>

  <Step title="API Key erstellen">
    Erstellen Sie einen Algolia API Key mit den folgenden Berechtigungen: search, browse, listIndexes (zusätzliche Berechtigungen wie addObject und deleteObject können je nach Verwaltung Ihrer Index-Updates erforderlich sein).

    * Die browse-Berechtigung ermöglicht das Herunterladen Ihres gesamten Katalogs.
    * Die listIndexes-Berechtigung ermöglicht es Topsort, das letzte Änderungsdatum des Index zu überprüfen, um unnötige Updates zu vermeiden.
  </Step>

  <Step title="Index-Details teilen">
    Kontaktieren Sie den Topsort-Support und teilen Sie Ihren Algolia-Indexnamen mit. Dies ermöglicht es Topsort, Ihren Katalog zu konfigurieren und mit dem Import zu beginnen.
  </Step>

  <Step title="Topsort Proxy konfigurieren">
    Aktualisieren Sie Ihre Algolia SDK-Konfiguration, um auf den Proxy von Topsort zu verweisen. Dies ermöglicht es Topsort, beworbene Produkte in den von Algolia zurückgegebenen organischen Ergebnissen zu priorisieren.

    ```javascript theme={null}
    import algoliasearch from 'algoliasearch/lite';

    const client = algoliasearch('YourApplicationID', 'YourWriteAPIKey', {
      hosts: [{ url: 'myslug-sandbox.topsort.workers.dev' }],
    });
    const index = client.initIndex('your_index_name');
    ```
  </Step>
</Steps>

## Auktionsergebnisse und Ereignisverfolgung

Die beworbenen Produkte, die in der Antwort des Topsort-Proxy priorisiert werden, haben einen resolvedBidId-Parameter, der die Auktion dieses Produkts eindeutig identifiziert. Sie können ihn verwenden, um das Produkt für den Endbenutzer visuell als "Beworben" zu kennzeichnen.

Die resolvedBidId wird auch benötigt, um den Auktionsgewinner beim Melden von Ereignissen (Impressionen, Klicks, Käufe) zu identifizieren. Weitere Details finden Sie in unserer Dokumentation zur Ereignisverfolgung.

<IntegrationsCard1ADe />