下面是一个用于创建 Google 发布商代码 (GPT) 以供在桌面平台和移动平台上实现的完整代码示例。使用 Google 代码生成器自动生成代码。
如果您是开发者以及需要 GPT 高级实现方案的人员，请参阅 API 参考文档和实现示例（例如延迟加载）。
Google 发布商代码示例
针对 GPT 实现的代码分为如下两部分：
- GPT 的配置在网页的
<head>中。 - 对每个具体广告位的调用在
<body>的相关部分。
此示例仅供参考，我们建议您安排个开发者在您的网站上实现该代码。
GPT 配置
以下代码示例包含调用 GPT JavaScript 库、定义广告位和键值对定位等操作。
1 |
<html> |
2 |
<HEAD> |
3 |
<script async="async" src="https://securepubads.g.doubleclick.net/tag/js/gpt.js"></script> |
4 |
<script> |
5 |
window.googletag = window.googletag || {cmd: []}; |
6 |
</script> |
|
第 3-6 行：通过 SSL/HTTPS 异步加载 Ad Manager 所使用的 GPT 库。命令队列就是在此处构建的，用于处理要同步处理的一系列函数（通常是广告调用）。您不需要修改这部分代码。 |
|
| 7 | <script> |
| 8 | googletag.cmd.push(function() { |
| 9 | googletag.defineSlot("/1234/travel/asia", [728, 90], "div-gpt-ad-123456789-0") |
|
第 9 行：
|
|
10 |
.addService(googletag.pubads()) |
11 |
.setTargeting("interests", ["sports", "music", "movies"]); |
12 |
googletag.defineSlot("/1234/travel/asia", [[468, 60], [728, 90], [300, 250]], "div-gpt-ad-123456789-1") |
13 |
.addService(googletag.pubads()) |
14 |
.setTargeting("gender", "male") |
| 15 | .setTargeting("age", "20-30"); |
|
第 11、14 和 15 行：使用 详细了解如何使用 GPT 设置定位条件和尺寸。 |
|
| 16 | googletag.pubads().setTargeting("topic","basketball"); |
|
第 16 行： 使用网页级键值对配置定位条件时，所有广告位都会沿用此定位条件。与广告位级键值对相同，您可将多个值与一个键关联：( |
|
| 17 | googletag.pubads().enableSingleRequest(); |
|
第 17 行： |
|
| 18 | googletag.enableServices(); |
| 19 | }); |
20 |
</script> |
21 |
</head> |
22 |
<body> |
23 |
<div id="div-gpt-ad-123456789-0" style="width: 728px; height: 90px"> |
|
第 23 行（可选）： 如果使用的是多尺寸代码，您最好省略这行代码（在这种情况下，元素的尺寸会采用所选广告素材呈现后的尺寸），或者确保这两个尺寸都大到足以容纳可投放的最大广告素材。对于单一尺寸广告代码，使用此参数可确保容器元素在广告素材开始加载之前一直处于展开状态，以避免其他网页元素在广告素材呈现时发生移位。 |
|
| 24 | <script> |
| 25 | googletag.cmd.push(function() { |
| 26 | googletag.display("div-gpt-ad-123456789-0"); |
| 27 | }); |
| 28 | </script> |
29 |
</div> |
30 |
<div id="div-gpt-ad-123456789-1"> |
31 |
<script> |
32 |
googletag.cmd.push(function() { |
|
第 8、25 和 32 行：函数调用会被添加到命令队列中，以便在加载网页时进行异步处理。 |
|
33 |
googletag.display("div-gpt-ad-123456789-1"); |
|
第 9、12、23、26、30 和 33 行： 虽然此处使用的是随机数，但 GPT 并不以这种方式唯一标识广告请求。这是通过 GPT 库在后台完成的。此外，只要同一网页上不会多次出现同一 div 名称，就可以在各个网页上使用相同的此类名称。 要详细了解 Ad Manager 广告资源结构、广告单元层次结构以及广告单元如何沿用定位条件，请参阅广告资源概览。 |
|
| 34 | }); |
| 35 | </script> |
| 36 | </div> |
| 37 | </body> |
| 38 | </html> |
如果您无法修改网页的标头
您可以在不修改网站的 <header> 的情况下使用 GPT。
方法 1：内嵌 GPT
使用内嵌代码（而不是网页标头）来定义广告单元在网页上的显示位置。借助内嵌代码，整个 GPT 广告位定义和请求（包括加载 GPT 库）都会包含在单个 <script> 标签中。
由于广告代码使用的是 GPT JavaScript 库，因此您必须先添加用于加载该库的代码，然后再添加广告代码。
这些内嵌 GPT 示例不支持 SRA。
调用 GPT JavaScript 库
<script async="async" src="https://securepubads.g.doubleclick.net/tag/js/gpt.js"></script>
<script>
window.googletag = window.googletag || {cmd: []};
</script>
内嵌广告代码示例
<div id="div-gpt-ad-1234567891234-0">
<script>
googletag.cmd.push(function() {
googletag.defineSlot('/1234/sports/football', [728, 90],'div-gpt-ad-1234567891234-0')
.addService(googletag.pubads())
.setTargeting("Gender", "Male");
googletag.enableServices();
googletag.display('div-gpt-ad-1234567891234-0');
});
</script>
</div>
方法 2：将所有代码放在网页正文中
使用传统 GPT 实现方案，但将广告位定义放在 HTML 的主体（而非标头）中。
您必须先调用加载该库和定义广告位的代码，然后才能为这些广告位请求广告。由于此代码未细分到网页的标头和主体中，因此您必须管理代码的序列。该方法会复杂一些，但给您带来了 SRA 的灵活性。
不使用 JavaScript 创建无代码请求
您可以使用无代码请求代替广告代码，以请求在 Ad Manager 中进行投放管理的原始广告素材代码。在需要自定义解析和显示时（例如机顶盒或其他没有 Google 代码或 SDK 支持的环境），通常会使用无代码请求。