Polite Load in HTML5 einrichten (optional) – Studio-Hilfe [gg-richmedia-de]

Erstellungsanleitung für HTML5-Banner

Polite Load in HTML5 einrichten (optional)

Weiter: Stellen Sie sicher, dass Ihre Anzeige auf dem Bildschirm zu sehen ist (nur Kampagnen für mobile Apps)

Was ist Polite Loading?

Polite Loading verzögert das Laden von Creative-Assets (wie Bildern), bis das Laden der übergeordneten Seite abgeschlossen ist.

1. Seite ist zu 20 % geladen: In der Anzeigenplatzierung wird ein Polite Load-Bild angezeigt.
2. Seite ist zu 50 % geladen: Auf der Seite wird mehr Inhalt angezeigt. Polite Load-Bild wird weiterhin angezeigt.
3. Seite ist zu 100 % geladen: Alle Seiteninhalte geladen. Das Polite Load-Bild wird ausgeblendet und der Rest des Anzeigeninhalts wird angezeigt.

Wenn Sie diese Funktion verwenden, können Sie Ihr Creative mit einem anfänglich vorab geladenen Bild gestalten, warten, bis die Seite fertig geladen ist, und dann zusätzliche Assets (z. B. Bilder, Animationen oder Videos) laden. Studio erfordert nicht, dass Ihre Dateien Polite Load verwenden, aber Publisher-Spezifikationen können dies erfordern.

Richten Sie Polite Loading in Google Web Designer ein

Wenn Sie Creatives in Google Web Designer entwerfen, müssen Sie keinen Code hinzufügen. Aktivieren Sie beim Veröffentlichen Ihrer Datei (entweder lokal oder direkt in Studio) das Kontrollkästchen „ Polite Loading " im Abschnitt „Einstellungen" des Dialogfelds „Veröffentlichen":

Verwenden Sie ein vorab geladenes Image

Wenn Sie ein Anfangsbild anzeigen möchten, während Sie auf das Laden der Seite warten, verwenden Sie den handleAdInitialized Handler. Mehr erfahren

Polite Loading mit JavaScript einrichten

Fügen Sie Ihrer JavaScript-Datei nach dem Enabler-Initialisierungscode den folgenden Code hinzu . Dieser Code prüft, ob die Seite mit der isPageLoaded -Methode des Enablers geladen wird, die true oder false zurückgibt. Rufen Sie bei „true" eine benutzerdefinierte Funktion auf, die Ihr Creative lädt (in diesem Beispiel heißt die benutzerdefinierte Funktion politeInit ). Wenn falsch, warten Sie auf das PAGE_LOADED -Ereignis des Enablers, bevor Sie politeInit aufrufen.

Laden Sie ein Polite Loading-Beispiel-Creative herunter und öffnen Sie dann DCRM_HTML5_inPage_Polite_300x600.html , um den erforderlichen Enabler-Code anzuzeigen.

Höfliches Ladecode-Snippet

  if (Enabler.isInitialized()) { init(); } else { Enabler.addEventListener(studio.events.StudioEvent.INIT, init); } // Runs when Enabler is ready. function init() { if (Enabler.isPageLoaded()) { politeInit(); } else { Enabler.addEventListener(studio.events.StudioEvent.PAGE_LOADED, politeInit); } }; // Runs when the page is completely loaded. function politeInit(){ // Add your code to hide any loading image or animation and load creative // assets or begin creative animation. };  if (Enabler.isInitialized()) { init(); } else { Enabler.addEventListener(studio.events.StudioEvent.INIT, init); } // Runs when Enabler is ready. function init() { if (Enabler.isPageLoaded()) { politeInit(); } else { Enabler.addEventListener(studio.events.StudioEvent.PAGE_LOADED, politeInit); } }; // Runs when the page is completely loaded. function politeInit(){ // Add your code to hide any loading image or animation and load creative // assets or begin creative animation. };

Verwenden Sie ein vorab geladenes Image

Wenn Sie ein Anfangsbild anzeigen möchten, während Sie auf das Laden der Seite warten, können Sie das vorab geladene Bild laden und es dann ausblenden, wenn das Ereignis PAGE_LOADED wird. In den Beispieldateien heißt das Ladebild „loading.gif" und seine div-Element-ID lautet „loading_image_dc".

Weiter: Stellen Sie sicher, dass Ihre Anzeige auf dem Bildschirm zu sehen ist (nur Kampagnen für mobile Apps)