In den Beispielen für den Einstieg und die grundlegenden Konzepte wird die Methode display() der Google Publisher-Tag-Bibliothek (GPT) verwendet, um einen Anzeigen-Slot zu registrieren und anzuzeigen. Es kann jedoch vorkommen, dass es besser oder sogar notwendig ist, diese Aktionen zu trennen, um das Laden von Anzeigeninhalten genauer zu steuern. Das ist beispielsweise der Fall, wenn Sie mit einer Plattform zur Einwilligungsverwaltung arbeiten oder Anzeigeninhalte als Folge einer Nutzeraktion anfordern.
In diesem Leitfaden betrachten wir die Mechanismen, die GPT zur Verfügung stellt, das Laden von Anzeigeninhalten zu steuern und bei Bedarf neue Anzeigeninhalte abzurufen. Den vollständigen Code für dieses Beispiel finden Sie auf der Beispielseite Ereignisbasierte Anfragen.
Anzeigenladevorgang steuern
Standardmäßig verhält sich die Methode display() wie folgt:
Anzeigeninhalte auf einer Anzeigenfläche registrieren, anfordern und rendern. Das automatische Anfordern und Rendern von Anzeigeninhalten kann mit der Methode PubAdsService.disableInitialLoad() deaktiviert werden.
Ist das anfängliche Laden deaktiviert, wird bei display()-Aufrufen nur die Anzeigenfläche registriert.
Anzeigeninhalte werden erst geladen, wenn eine zweite Aktion ausgeführt wird. So können Sie genau steuern, wann Anzeigenanfragen erfolgen.
Um unbeabsichtigte Anzeigenanfragen zu vermeiden, muss disableInitialLoad() aufgerufen werden, bevor der Dienst aktiviert und display() aufgerufen wird.
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="description" content="Request GPT ads based on events." />
<title>Event-based ad requests</title>
<script
async
src="https://securepubads.g.doubleclick.net/tag/js/gpt.js"
crossorigin="anonymous"
></script>
<script>
window.googletag = window.googletag || { cmd: [] };
googletag.cmd.push(() => {
// Define the ad slot.
googletag
.defineSlot("/6355419/Travel", [728, 90], "div-for-slot")
.setTargeting("test", "event")
.addService(googletag.pubads());
// Disable initial load.
// This prevents GPT from automatically fetching ads when display is called.
googletag.pubads().disableInitialLoad();
googletag.enableServices();
});
</script>
<style></style>
</head>
<body>
<div id="div-for-slot" style="width: 300px; height: 250px"></div>
<script>
googletag.cmd.push(() => {
// Register the ad slot.
// An ad will not be fetched until refresh is called.
googletag.display("div-for-slot");
});
</script>
</body>
</html>In diesem Beispiel ist der anfängliche Ladevorgang deaktiviert, sodass keine Anzeigenanfrage gesendet wird.
und kein Anzeigeninhalt gerendert wird, wenn display() aufgerufen wird. Der Anzeigenblock ist bereit, eine Anzeige zu akzeptieren und zu schalten. Eine Anzeigenanfrage wird jedoch erst gesendet, wenn der Anzeigenblock aktualisiert wird.
Aktualisieren
Mit der Methode PubAdsService.refresh() werden ein oder mehrere Slots mit neuen Anzeigeninhalten gefüllt. Diese Methode kann für Slots verwendet werden, in denen noch keine Inhalte geladen wurden (aufgrund von disableInitialLoad()), oder um den Inhalt eines bereits belegten Slots zu ersetzen. Allerdings können nur Anzeigenflächen,
die durch den Aufruf von display() registriert wurden, können aktualisiert werden.
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="description" content="Request GPT ads based on events." />
<title>Event-based ad requests</title>
<script
async
src="https://securepubads.g.doubleclick.net/tag/js/gpt.js"
crossorigin="anonymous"
></script>
<script>
window.googletag = window.googletag || { cmd: [] };
googletag.cmd.push(() => {
// Define the ad slot.
googletag
.defineSlot("/6355419/Travel", [728, 90], "div-for-slot")
.setTargeting("test", "event")
.addService(googletag.pubads());
// Disable initial load.
// This prevents GPT from automatically fetching ads when display is called.
googletag.pubads().disableInitialLoad();
googletag.enableServices();
});
</script>
<style></style>
</head>
<body>
<div id="div-for-slot" style="width: 300px; height: 250px"></div>
<button id="showAdButton">Show/Refresh Ad</button>
<script>
googletag.cmd.push(() => {
// Register the ad slot.
// An ad will not be fetched until refresh is called.
googletag.display("div-for-slot");
// Register click event handler.
document.getElementById("showAdButton").addEventListener("click", () => {
googletag.cmd.push(() => {
googletag.pubads().refresh();
});
});
});
</script>
</body>
</html>In diesem modifizierten Beispiel wird die Methode refresh() aufgerufen, wenn ein Nutzer auf die Schaltfläche „Anzeige anzeigen/aktualisieren“ klickt. Dadurch wird eine Anfrage zum Abrufen neuer Anzeigeninhalte ausgelöst, die dann in die registrierte Anzeigenfläche geladen werden. Vorher vorhandene Inhalte werden dabei überschrieben.
Im vorherigen Beispiel wird die Methode refresh() ohne Parameter aufgerufen. Dadurch werden alle registrierten Anzeigenslots aktualisiert.
Sie können bestimmte Anzeigenflächen auch aktualisieren, indem Sie ein Array
Slots für die Methode refresh(). Weitere Informationen finden Sie im Abschnitt Anzeigenflächen aktualisieren.
Beispiel für ein solches Beispiel.
Best Practices
Bei der Arbeit mit refresh() gibt es einige Best Practices, die beachtet werden sollten.
Aktualisieren Sie die Seite nicht zu oft.
Werden Anzeigenflächen zu schnell aktualisiert, können Ihre Anzeigenanfragen gedrosselt werden. Aktualisieren Sie Slots daher nicht häufiger als alle 30 Sekunden.
clear()nicht unnötig anrufenRufen Sie beim Aktualisieren einer Anzeigenfläche
PubAdsService.clear(). Das ist nicht nötig, darefresh()den Inhalt des angegebenen Slots ersetzt, unabhängig davon, ob zuvor Anzeigeninhalte geladen wurden.clear()wird sofort angerufen vor dem Aufruf vonrefresh()die Zeit nur um ein leeres Slot-Feld für den Nutzer sichtbar ist.Nur sichtbare Anzeigenflächen aktualisieren
Wenn Sie
refresh()verwenden, um den Inhalt von Anzeigenflächen zu ersetzen, die nie sichtbar sind, kann das Ihre ActiveView-Rate erheblich senken. Mit dem Ereignis ImpressionViewableEvent lässt sich ermitteln, wann ein Anzeigenblock sichtbar wurde, wie im folgenden Beispiel gezeigt:googletag.cmd.push(function() { var REFRESH_KEY = 'refresh'; var REFRESH_VALUE = 'true'; googletag.defineSlot('/6355419/Travel',[728, 90], 'div-for-slot') .setTargeting(REFRESH_KEY, REFRESH_VALUE) .setTargeting('test', 'event') .addService(googletag.pubads()); // Number of seconds to wait after the slot becomes viewable. var SECONDS_TO_WAIT_AFTER_VIEWABILITY = 60; googletag.pubads().addEventListener('impressionViewable', function(event) { var slot = event.slot; if (slot.getTargeting(REFRESH_KEY).indexOf(REFRESH_VALUE) > -1) { setTimeout(function() { googletag.pubads().refresh([slot]); }, SECONDS_TO_WAIT_AFTER_VIEWABILITY * 1000); } }); googletag.enableServices(); });