Ezoic Standalone Integration

Übersicht:

Erste Schritte

Voraussetzungen

Stellen Sie sicher, dass die Platzhalter für Ihre Webseite über das Ezoic-Dashboard erstellt werden. In unserem Support-Artikel erfahren Sie mehr über Platzhalter und wie Sie diese erstellen können.

Standalone-Bibliothek laden

Laden Sie die Standalone-Bibliothek, indem Sie dieses Skript in den <head> der Seite einfügen.

<script async src="//www.ezojs.com/ezoic/sa.min.js"></script>

(HTML)

Dadurch wird das globale Objekt ezstandalone geladen und alle in der Warteschlange stehenden Funktionen ausgeführt.

Hinzufügen von Platzhaltern

Um der Seite einen Platzhalter hinzuzufügen, erstellen Sie ein div-Element, in dem die Anzeige erscheinen soll. Das id-Attribut des Elements sollte die ID des Platzhalters mit dem Präfix ezoic-pub-ad-placeholder- sein.

Fügen Sie dem eigentlichen Platzhalter div KEIN Styling hinzu!
Das Hinzufügen von Stilen oder Abständen für die Anzeige kann zu unerwünschten Ergebnissen führen (z.B. wenn ein Platzhalter nicht von unserem System mit einer Anzeige gefüllt wird, kann es sein, dass auf der Seite leerer Platz ist).

Um zum Beispiel einen Platzhalter mit der ID 103 hinzuzufügen, würde der HTML-Code etwa so aussehen.

<body>
    <div id="ezoic-pub-ad-placeholder-103">
    </div>
</body>

(HTML)

Definieren von Platzhaltern

Die definierten Platzhalter müssen in der HTML-Datei vorhanden sein.

Die Definition von Platzhaltern teilt ezstandalone mit, welche Platzhalter zur Verfügung stehen, um das optimale Setup zu bestimmen.

Übertragen Sie alle Platzhalter, die auf der Seite vorhanden sind, mit dem folgenden Code an die Funktion ezstandalone.define:

<script>
    window.ezstandalone = window.ezstandalone || {};
    ezstandalone.cmd = ezstandalone.cmd || [];
    ezstandalone.cmd.push(function() {
        ezstandalone.define(102,103,104);
    });
</script>

(HTML)

Hinweis: Das Beispiel geht davon aus, dass die Platzhalter 102, 103 und 104 bereits über das Dashboard erstellt wurden und auf der Seite vorhanden sind.

Achten Sie auf die korrekte Zuordnung von ezstandalone.

Abrufen von Anzeigen

Nachdem Sie die Platzhalter definiert haben, aktivieren Sie Standalone durch den Aufruf von ezstandalone.enable(). Dadurch werden Optimierungen von unseren Servern abgerufen.

Der Code sollte nach der Definition und Aktivierung der Platzhalter wie folgt aussehen.

<script>
    window.ezstandalone = window.ezstandalone || {};
    ezstandalone.cmd = ezstandalone.cmd || [];
    ezstandalone.cmd.push(function() {
        ezstandalone.define(102,103,104);
        ezstandalone.enable();
    });
</script>

(HTML)

Hinweis: Dadurch wird der Anzeigencode der potenziellen Platzhalter 102, 103 und 104 angefordert. Damit die Ads angezeigt werden, muss die Funktion display aufgerufen werden.

Anzeigen schalten

Um Anzeigen erscheinen zu lassen, fordern Sie ezstandalone.display() an, nachdem Sie die Platzhalter definiert und aktiviert haben.

<script>
    window.ezstandalone = window.ezstandalone || {};
    ezstandalone.cmd = ezstandalone.cmd || [];
    ezstandalone.cmd.push(function() {
        ezstandalone.define(102,103,104);
        ezstandalone.enable();
        ezstandalone.display();
    });
</script>

(HTML)

Einrichtung abschließen

Sobald diese Schritte erledigt sind, ist eine Basisversion von Ezoic Standalone eingerichtet, und die Seite ist bereit, Werbeanzeigen einzublenden!

Dynamische Inhalte

Dieser Bereich ist für Webseiten geeignet, deren Inhalte dynamisch geladen werden oder sich ändern.

Wechseln von Seiten

Beim dynamischen Umschalten zwischen Seitenansichten ist es wichtig, dieses Skript abzurufen:

ezstandalone.refresh()

(JAVASCRIPT)

ezstandalone.refresh() teilt Standalone mit, dass es einen neuen Seitenaufruf gibt und fordert neuen Anzeigencode für die definierten Platzhalter an.

Wenn die neue Seite eine andere Anordnung von Platzhaltern als die vorherige Seite enthält, sollte ezstandalone.define() mit der neuen Anordnung von Platzhaltern vor dem Aufruf von refresh aufgerufen werden.

<script>
    ezstandalone.cmd.push(function() {
        // define new placeholders and call refresh
        ezstandalone.define(104, 105, 106);
        ezstandalone.refresh();
    });
</script>

(HTML)

Der Aufruf von define überschreibt den vorherigen Satz von Platzhaltern, also fügen Sie in der Funktion alle Platzhalter hinzu, die auf dieser Seite neu hinzugekommen sind.

Wenn die Platzhalter 103 und 104 auf der Seite beispiel.com/seite1 vorhanden sind und der Benutzer dynamisch zur Seite beispiel.com/seite2 wechselt, auf der die Platzhalter 104 und 105 vorhanden sind, muss der Platzhalter 105 in den define-Aufruf aufgenommen werden.

Neue Inhalte

Für zusätzliche Platzhalter innerhalb der gleichen Seitenansicht gibt es die Funktion ezstandalone.displayMore.

Wenn ein Benutzer auf der Seite nach unten scrollt, neue Inhalte geladen werden und die Platzhalter 104 und 105 hinzugefügt werden, sollte ezstandalone.displayMore verwendet werden, um sie anzuzeigen.

<script>
    ezstandalone.cmd.push(function() {
        // call new placeholders
        ezstandalone.displayMore(104, 105);
    });
</script>

(HTML)

Änderung der Inhalte

Wenn sich der Inhalt innerhalb desselben Seitenaufrufs ändert und ein Platzhalter nicht mehr benötigt wird oder nicht mehr sichtbar ist, muss der Platzhalter mit ezstandalone.destroyPlaceholders ordnungsgemäß bereinigt werden. Dadurch kann der Platzhalter bei Bedarf über ezstandalone.displayMore erneut geladen werden.

<script>
    window.ezstandalone.cmd.push(function() {
        // destroy placeholders
        ezstandalone.destroyPlaceholders(104, 105);
    });
</script>

(HTML)

Infinite Scroll

Für Webseiten, die Infinite Scroll implementiert haben, kann eine Kombination aus dem Aufruf von ezstandalone.destroyPlaceholders gefolgt von ezstandalone.displayMore notwendig sein, um Platzhalter wiederzuverwenden, wenn sie sich innerhalb derselben Seitenansicht befinden.

Es wird empfohlen, für Infinite Scroll eine Reihe von spezifischen in-content-Platzhaltern zu erstellen.

Beispiel

Das folgende Beispiel zeigt, wie der Ablauf für Infinite Scroll auf einer Webseite mit mehreren Artikeln aussehen würde.

Rufen Sie zunächst den Platzhalter für den ersten Artikel beim Laden der Seite auf.

<script>
    window.ezstandalone = window.ezstandalone || {};
    ezstandalone.cmd = ezstandalone.cmd || [];
    ezstandalone.cmd.push(function() {
        ezstandalone.define(102, 103, 104);
        ezstandalone.enable();
        ezstandalone.display();
    });
</script>

(HTML)

Der Nutzer scrollt dann zum nächsten Artikel, so dass der nächste Satz von Anzeigen geladen wird.

<script>
    window.ezstandalone.cmd.push(function() {
        // call new placeholders
        ezstandalone.displayMore(105, 106);
    });
</script>

(HTML)

Der Benutzer scrollt dann zum dritten Artikel, und die Platzhalter des ersten Artikels sollen wieder verwendet werden.

<script>
    window.ezstandalone.cmd.push(function() {
        // destroy initial placeholders
        ezstandalone.destroyPlaceholders(102, 103, 104);
        // call new placeholders
        ezstandalone.displayMore(102, 103, 104);
    });
</script>

(HTML)

Alle Platzhalter entfernen

Entfernen Sie alle Platzhalter auf der Seite, indem Sie die Funktion destroyAll verwenden.

<script>
    window.ezstandalone.cmd.push(function() {
        ezstandalone.destroyAll();
    });
</script>

(HTML)

Anchor Ads

Standardmäßig zeigt Standalone von Ezoic Anchor Ads an, wenn diese im Dashboard unter Ezoic Ads aktiviert sind.

standalone anchor ads

Anchor Ads ausschalten

Um die Anchor Ad für eine bestimmte Seite auszuschalten, kann die Funktion ezstandalone.setEzoicAnchorAd verwendet werden.

Damit diese Funktion funktioniert, muss sie vor der Funktion ezstandalone.enable() aufgerufen werden.

<script >
    window.ezstandalone = window.ezstandalone || {};
    ezstandalone.cmd = ezstandalone.cmd || [];
    ezstandalone.cmd.push(function() {
        ezstandalone.setEzoicAnchorAd(false);
        ezstandalone.define(101, 102, 103);
        ezstandalone.enable();
        ezstandalone.display();
    });
</script>

(HTML)

Prüfen, ob eine Anchor-Ad abgeschlossen wurde

Um zu sehen, ob die Anchor Ad für die Session eines Nutzers geschlossen wurde, verwenden Sie die Funktion hasAnchorAdBeenClosed.

Hier ein Beispiel für die Verwendung der Funktion zur Bestimmung, ob die Anchor Ad weiterhin angezeigt werden soll

<script >
    window.ezstandalone = window.ezstandalone || {};
    ezstandalone.cmd = ezstandalone.cmd || [];
    ezstandalone.cmd.push(function() {
        let anchorHasBeenClosed = ezstandalone.hasAnchorAdBeenClosed();
        ezstandalone.setEzoicAnchorAd(anchorHasBeenClosed);
        ezstandalone.define(101, 102, 103);
        ezstandalone.enable();
        ezstandalone.display();
    });
</script>

(HTML)

Datenschutz

DSGVO

Um die Einhaltung der DSGVO zu gewährleisten, gibt es zwei Möglichkeiten:

  1. Verwendung der kostenlosen, von Google zertifizierten, Ezoic TCF 2.0-Plattform für das Consent Management (empfohlen)
  2. Verknüpfung mit einer bestehenden TCF 2.0 Consent Management Plattform, welche die Richtlinien zur Einwilligung der Nutzer in der EU einhält (Notwendig ab 16.01.2024).

Wenn Sie mehr darüber erfahren möchten, wie Ezoic Publishern bei der Einhaltung der Datenschutzgrundverordnung (DSGVO) hilft, besuchen Sie diese Seite!

Verwendung des Ezoic CMPs (empfohlen)

  1. Fügen Sie das folgende Skript in die Kopfzeile Ihrer Webseite ein, und zwar vor jeglichem Anzeigen-/Tracking-Code.
<script src="https://the.gatekeeperconsent.com/cmp.min.js" data-cfasync="false"></script>

(HTML)

Achtung! Dieser Code darf nicht verzögert/nachträglich geladen werden, da sonst personenbezogene Daten verarbeitet werden könnten, bevor die Zustimmung des Nutzers erteilt wurde.

Anpassung des Ezoic CMPs

Die CMP von Ezoic kann über den Bereich Datenschutz im Ezoic-Dashboard unter den Einstellungen angepasst werden.

Verwendung eines CMPs von Drittanbietern

Die Handhabung der DSGVO-Einstellungen durch Drittanbieter erfordert etwas zusätzlichen Code. Viele CMPs haben in ihrer Dokumentation eigene Rückrufe definiert, die aufgerufen werden, wenn die Zustimmung erteilt wird, und es wird empfohlen, die von der CMP empfohlene Methode zum Abfragen von Zustimmungen zu verwenden.

In erster Linie muss Standalone wissen, ob personalisierte Anzeigen erlaubt sind und ob personalisierte Statistiken verwendet werden können (festgelegt durch ezstandalone.setDisablePersonalizedStatistics und ezstandalone.setDisablePersonalizedAds).

Im folgenden Code zeigen wir, wie man Standalone-Code unter Verwendung der TCF-V2-API des IAB für die DSGVO in ein CMP integriert:

Für das CMP eines Drittanbieters, welches die TCF V2 API des IAB verwendet, verwenden Sie die Funktion ezstandalone.enableConsent(), bevor Sie enable und display aufrufen. Die enableConsent-Funktion muss für ezstandalone nur einmal aufgerufen werden. Mit anderen Worten: Wenn Sie zusätzliche Platzhalter über displayMore oder refresh anzeigen, muss enableConsent nicht erneut aufgerufen werden.

Nur verwenden, wenn ein CMP auf Ihrer Seite vorhanden ist!

<script>
    var ezstandalone = window.ezstandalone || {};
    ezstandalone.cmd = ezstandalone.cmd || [];
    ezstandalone.cmd.push(function() {
        ezstandalone.enableConsent();
        ezstandalone.define(101, 102);
        ezstandalone.enable();
        ezstandalone.display();
    });
</script>

(HTML)

Traffic splitten

Im Gegensatz zu unseren anderen Integrationsmethoden erfolgt der Traffic-Split bei Standalone client-seitig.

Mit der Funktion ezstandalone.isEzoicUser können Sie den Ezoic-Traffic auf einen bestimmten Prozentsatz Ihres Traffics aufteilen.

Wie bei dem Traffic-Split in unserer Standard-Integration basiert auch die isEzoicUser-Funktion auf der Session eines Nutzers, nicht auf den Pageviews.

Beispiel

Im Folgenden finden Sie ein Beispiel für die Verteilung von 50 Prozent Ihres Traffics an Ezoic.

<script type="text/javascript">
    ezstandalone.cmd = ezstandalone.cmd || [];
    ezstandalone.cmd.push(function() {
        var percentageToRunEzoic = 50;
        if(ezstandalone.isEzoicUser(percentageToRunEzoic)) {
            ezstandalone.define(100,101);
            ezstandalone.enable();
            ezstandalone.display();
        } else {
            // Normal ad code execution
        }
    });
</script>

(HTML)

Hybrid-Integration

Für komplexere Webseiten mit einer Mischung aus statischen und dynamischen Inhalten, die alle Funktionen von Ezoic nutzen möchten, gibt es die Hybrid-Integration.

Was ist die Hybrid-Integration?

Von hybrider Integration spricht man, wenn eine Webseite über Names-Server oder CloudFlare integriert wird, während sie für den Aufruf von Anzeigen Standalone verwendet.
Der Vorteil der Hybrid-Integration ist, dass Publisher Zugriff auf Ezoic-Produkte wie Leap, NicheIQ, Humix, etc. erhalten, während die Anzeigen dynamisch geladen werden.

Voraussetzungen

Stellen Sie sicher, dass die Platzhalter für Ihre Webseite über das Ezoic-Dashboard erstellt werden. In unserem Support-Artikel erfahren Sie mehr über Platzhalter und wie Sie diese erstellen können.

Laden Sie die Standalone-Bibliothek, indem Sie dieses Skript in den <head> der Seite einfügen. Einige Ezoic-Funktionen erfordern, dass der HTML-Code statisch definiert ist und nicht über Javascript geladen wird.

<script async src="https://www.ezojs.com/ezoic/sa.min.js"></script>

(HTML)

Platzhalter dynamisch hinzufügen

Um der Webseite einen Platzhalter hinzuzufügen, erstellen Sie ein div-Element an der Stelle, an der die Anzeige erscheinen soll. Das id-Attribut des Elements sollte die ID des Platzhalters mit dem Präfix ezoic-pub-ad-placeholder- sein.

Um zum Beispiel Platzhalter mit der ID 103 und 104 hinzuzufügen, würde der HTML-Code etwa so aussehen:

<body>
    <div id="ezoic-pub-ad-placeholder-103">
    </div>
    <!-- Content -->
    <div id="ezoic-pub-ad-placeholder-104">
    </div>
</body>

(HTML)

Abrufen von Anzeigen

Sobald die Platzhalter in den HTML-Code eingefügt wurden, rufen Sie den Ezoic-Anzeigencode mit ezstandalone.displayMore() auf.

<script type="text/javascript">
    window.ezstandalone = window.ezstandalone || {};
    ezstandalone.cmd = ezstandalone.cmd || [];
    ezstandalone.cmd.push(function() {
        ezstandalone.displayMore(103, 104);
    });
</script>

(HTML)

Ausnahmefälle

Für integrierte Webseiten ohne statische Platzhalter, die alle Platzhalter dynamisch mit Standalone laden möchten, verwenden Sie bitte stattdessen die folgende Anleitung: Erste Schritte mit Standalone.

Statische Platzhalter sind Platzhalter, die der HTML-Datei hinzugefügt werden, wenn diese unseren Proxy durchläuft, und nicht über JavaScript.

Traffic splitten

Der Traffic-Split wird über die Einstellungen im Ezoic Dashboard unter EzoicAds > Split Testing festgelegt.

Ähnlich wie bei der Aufteilung des Traffics auf einer eigenständigen Webseite, fügen Sie die gleiche Funktion, jedoch ohne die Angabe jeglicher Parameter hinzu.

<script type="text/javascript">
    ezstandalone.cmd = ezstandalone.cmd || [];
    ezstandalone.cmd.push(function() {
        if(ezstandalone.isEzoicUser()) {
            ezstandalone.define(100,101);
            ezstandalone.enable();
            ezstandalone.display();
        } else {
            // Normal ad code execution
        }
    });
</script>

(HTML)

Ads.txt

Befolgen Sie zum Setup der ads.txt-Datei die Anweisungen im Ezoic Dashboard.

Wie Sie beginnen

Die Einrichtung ist einfach, sicher und schnell.

1. Ein Konto erstellen

Keine Kreditkarte, kein Vertrag. Beginnt immer mit 30 Tagen kostenloser Testphase.

2. Webseite integrieren

Mehrere Integrationsoptionen & echte Menschen, die 24/7 für Sie da sind.

3. Setup konfigurieren

Hier können Sie mit den Einstellungen und den erweiterten Tests von Ezoic experimentieren.