Einführung in das Google Publisher-Tag

Das Google Publisher-Tag (GPT) ist eine Google Ad Manager.

Sie können GPT verwenden, um dynamisch Anzeigenanfragen zu erstellen. GPT übernimmt wichtige Details wie Anzeigenblockcode, Anzeigengröße und benutzerdefiniertes Targeting, erstellt die Anfrage und zeigt die Anzeige auf Webseiten an.

Weitere Informationen zu GPTs finden Sie in der Ad Manager-Hilfe

Hier sind einige Beispiele, die Ihnen den Einstieg in GPT erleichtern. Wenn Wenn Sie weitere Hilfe zu GPT benötigen, lesen Sie den Support Optionen.

Testanzeige einblenden

Das folgende Beispiel führt Sie durch die Erstellung einer Testseite, die verwendet GPT, um eine generische Anzeige aus dem Testnetzwerk von Google zu laden.

Den vollständigen Code für dieses Beispiel finden Sie auf der Beispielseite für die Testanzeige

  1. Einfaches HTML-Dokument erstellen

    Erstellen Sie in einem Texteditor ein einfaches HTML-Dokument namens hello-gpt.html.

    <!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="description" content="Display a fixed-sized test ad." />
    <title>Display a test ad</title>
    <style></style>
  </head>
  <body>
  </body>
</html>

  2. GPT-Bibliothek laden

    Laden Sie die GPT-Bibliothek, indem Sie Folgendes zum <head> des HTML-Dokuments.

    Mit diesem Code wird die GPT-Bibliothek aus https://securepubads.g.doubleclick.net/tag/js/gpt.js. Sobald die Bibliothek werden alle Befehle in der Warteschlange googletag-Objekt.

    <head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1" />
  <meta name="description" content="Display a fixed-sized test ad." />
  <title>Display a test ad</title>
  <script
    async
    src="https://securepubads.g.doubleclick.net/tag/js/gpt.js"
    crossorigin="anonymous"
  ></script>
  <style></style>
</head>

  3. Anzeigenfläche definieren

    Definieren Sie eine Anzeigenfläche und initialisieren Sie GPT mithilfe der googletag.enableServices()-Methode.

    Mit diesem Code wird zuerst sichergestellt, dass das googletag-Objekt verfügbar ist, und anschließend ein -Befehl, mit dem eine Anzeigenfläche erstellt und GPT aktiviert wird.

    Die Anzeigenfläche in diesem Beispiel lädt eine Anzeige der Größe 300x250 aus der Anzeige Einheit wird durch den Pfad /6355419/Travel/Europe/France/Paris angegeben. Die Anzeige wird in einem <div id="banner-ad">-Element im Textkörper der Seite angezeigt, wird als Nächstes hinzugefügt.

    <ph type="x-smartling-placeholder">

    <head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1" />
  <meta name="description" content="Display a fixed-sized test ad." />
  <title>Display a test ad</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 an ad slot for div with id "banner-ad".
      googletag
        .defineSlot("/6355419/Travel/Europe/France/Paris", [300, 250], "banner-ad")
        .addService(googletag.pubads());

      // Enable the PubAdsService.
      googletag.enableServices();
    });
  </script>
  <style></style>
</head>

  4. Geben Sie an, wo die Anzeige erscheinen soll.

    Geben Sie an, wo die Anzeige auf der Seite erscheinen soll, indem Sie den folgenden Code zu Die <body> des HTML-Dokuments.

    Beachten Sie, dass die ID von <div> mit der ID übereinstimmt, die beim Definieren des Anzeigenfläche.

    <body>
  <div id="banner-ad" style="width: 300px; height: 250px"></div>
  <script>
    googletag.cmd.push(() => {
      // Request and render an ad for the "banner-ad" slot.
      googletag.display("banner-ad");
    });
  </script>
</body>

  5. Vorschau der Testseite anzeigen

    Speichern Sie die Datei hello-gpt.html und öffnen Sie sie in einem Webbrowser. Nach dem Laden auf der Seite eine Testanzeige im Textkörper der Webseite angezeigt wird.

Eigene Anzeige schalten

Wenn Sie Ihre eigene Anzeige präsentieren möchten, verwenden Sie die Datei hello-gpt.html aus dem Artikel Einen Test anzeigen Anzeige und ersetzen Sie den Code im Header durch einen Code, der angibt, Ihres eigenen Ad Manager-Netzwerks.

  1. Generieren Sie ein Anzeigen-Tag für den Anzeigenblock, den Sie präsentieren möchten. Weitere Informationen über das Generieren von Anzeigen-Tags in der Ad Manager-Hilfe

  2. Kopieren Sie den Code des Anzeigen-Tags, der im Abschnitt Kopfzeile des Dokuments angegeben ist, und verwenden Sie ihn. um den entsprechenden Code im <head>-Element Ihres HTML-Dokuments zu ersetzen.

    <head>
  <meta charset="utf-8">
  <title>Hello GPT</title>
  <script src="https://securepubads.g.doubleclick.net/tag/js/gpt.js" crossorigin="anonymous" async></script>
  <script>
    window.googletag = window.googletag || {cmd: []};
    googletag.cmd.push(function() {
      googletag
          .defineSlot("ad-unit-path", [width, height], "div-id")
          .addService(googletag.pubads());
      googletag.enableServices();
    });
  </script>
</head>

  3. Speichern Sie die aktualisierte hello-gpt.html-Datei und öffnen Sie sie in einem Webbrowser.

Weiter
Grundlagen