Tag Google Publisher (GPT) adalah library pemberian tag iklan untuk Google Ad Manager.
Anda dapat menggunakan GPT untuk membuat permintaan iklan secara dinamis. GPT mengambil detail penting seperti kode unit iklan, ukuran iklan, dan penargetan kustom, membuat permintaan, serta menampilkan iklan di halaman web.
Untuk mengetahui detail selengkapnya tentang GPT, lihat pusat bantuan Ad Manager.
Berikut beberapa contoh yang dapat Anda gunakan untuk memulai GPT. Jika Anda memerlukan bantuan lebih lanjut terkait GPT, lihat opsi dukungan.
Menampilkan iklan percobaan
Contoh berikut akan memandu Anda dalam membuat halaman pengujian yang menggunakan GPT untuk memuat iklan generik dari jaringan pengujian Google.
Kode lengkap untuk contoh ini dapat ditemukan di halaman contoh tampilkan iklan pengujian.
Membuat dokumen HTML dasar
Di editor teks, buat dokumen HTML biasa yang bernama
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> <script> googletag.cmd.push(() => { // Request and render an ad for the "banner-ad" slot. googletag.display("banner-ad"); }); </script> </body> </html>
Memuat library GPT
Muat library GPT dengan menambahkan hal berikut ke
<head>
dokumen HTML.Kode ini memuat library GPT dari https://securepubads.g.doubleclick.net/tag/js/gpt.js. Setelah dimuat sepenuhnya, library akan memproses perintah dalam antrean di objek
googletag
.<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"></script> <style></style> </head>
Menentukan slot iklan
Tentukan slot iklan dan inisialisasi GPT menggunakan metode
googletag.enableServices()
.Kode ini memastikan terlebih dahulu objek googletag tersedia, lalu mengantrekan perintah yang membuat slot iklan dan mengaktifkan GPT.
Slot iklan dalam contoh ini akan memuat iklan berukuran
300x250
dari unit iklan yang ditentukan oleh jalur/6355419/Travel/Europe/France/Paris
. Iklan akan ditampilkan dalam elemen<div id="banner-ad">
di isi halaman, yang akan ditambahkan berikutnya.<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"></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>
Tentukan tempat iklan akan muncul
Tentukan tempat iklan akan muncul di halaman dengan menambahkan kode berikut ke
<body>
pada dokumen HTML.Perhatikan bahwa ID
<div>
ini cocok dengan ID yang ditentukan saat menentukan slot iklan.<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>
Melihat pratinjau halaman pengujian
Simpan file
hello-gpt.html
dan buka di browser web. Setelah dimuat, halaman akan menampilkan iklan percobaan dalam isi halaman web.
Tampilkan iklan Anda sendiri
Untuk menampilkan iklan Anda sendiri, gunakan file hello-gpt.html
dari Tampilkan iklan
pengujian, lalu ganti kode di header dengan kode yang menentukan
inventaris dari jaringan Ad Manager Anda sendiri.
Buat tag iklan untuk unit iklan yang ingin Anda tampilkan. Pelajari lebih lanjut cara membuat tag iklan di pusat bantuan Ad Manager.
Salin kode tag iklan yang diberikan di bagian Header dokumen dan gunakan untuk mengganti kode yang sesuai di
<head>
dokumen HTML Anda.<head> <meta charset="utf-8"> <title>Hello GPT</title> <script async src="https://securepubads.g.doubleclick.net/tag/js/gpt.js"></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>
Simpan file
hello-gpt.html
yang diperbarui dan buka di browser web.