Ниже приведен пример полного кода, который можно использовать при создании тега Google Publisher Tag (GPT) для показа рекламы на компьютерах и мобильных устройствах. Чтобы создать тег автоматически, воспользуйтесь генератором тегов Google.
Сложные варианты применения тега GPT представлены в документации по API и в примерах практического использования, например отложенной загрузки.
Посмотреть сложные примеры тега GPT
Пример кода тега Google Publisher Tag
Код GPT состоит из двух частей:
- Настройки GPT представлены в разделе
<head>
веб-страни��ы. - Вызовы для каждого конкретного рекламного места размещаются в соответствующих частях раздела
<body>
.
Этот пример предоставлен исключительно в информационных целях. Для добавления кода на сайт рекомендуем обратиться к разработчику.
Настройки кода GPT
Пример кода ниже содержит вызов библиотеки JavaScript тега GPT, определение рекламных мест, таргетинг на пары "ключ-значение" и другие параметры.
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. Выполняется асинхронная загрузка библиотеки GPT для Менеджера рекламы с использованием SSL/HTTPS. Именно этот фрагмент создает очередь команд, обрабатывающих список асинхронно выполняемых функций (как правило, это запросы объявлений). Издателям не нужно изменять эту часть кода. |
|
7 | <script> |
8 | googletag.cmd.push(function() { |
9 | googletag.defineSlot("/1234/путешествия/азия", [728, 90], "div-gpt-ad-123456789-0") |
Строка 9. Элемент Параметр |
|
10 |
.addService(googletag.pubads()); |
11 |
.setTargeting("interests", ["спорт", "музыка", "кино"]); |
12 |
googletag.defineSlot("/1234/путешествия/азия", [[468, 60], [728, 90], [300, 250]], "div-gpt-ad-123456789-1") |
13 |
.addService(googletag.pubads()); |
14 |
.setTargeting("пол", "мужской") |
15 | .setTargeting("возраст", "20-30"); |
Строки 11, 14 и 15. Здесь задаются настройки таргетинга на пары "ключ-значение" на уровне рекламного места при помощи функции Подробнее о настройке таргетинга и размеров объявлений с помощью тегов GPT… |
|
16 | googletag.pubads().setTargeting("тема","баскетбол"); |
Строка 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, не повторяется в пределах одной страницы. Ознакомьтесь со статьей в нашем Справочном центре, которая посвящена структуре инвентаря в Менеджере рекламы, иерархии рекламных блоков и наследованию параметров таргетинга. |
|
34 | }); |
35 | </script> |
36 | </div> |
37 | </body> |
38 | </html> |
Посмотреть сложные примеры тега GPT
Если вы не можете редактировать заголовки своих веб-страниц
Теги GPT можно использовать, не изменяя раздел страницы <header>
.
Вариант 1: встроенный тег GPT
С помощью встроенных тегов объявляйте рекламные блоки в тех местах, где они располагаются на странице, а не в заголовке. Для встроенных тегов всё определение рекламного места GPT и запрос, в том числе загрузка библиотеки GPT, содержатся в одном теге <script>
.
Поскольку в теге объявления используется библиотека JavaScript тега GPT, перед кодом тега не забудьте вставить код, загружающий эту библиотеку.
В этом примере встроенного тега GPT не поддерживается режим единого запроса.
Вызов библиотеки JavaScript тега Google Publisher Tag
<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/спорт/футбол', [728, 90],'div-gpt-ad-1234567891234-0')
.addService(googletag.pubads())
.setTargeting("пол", "мужской");
googletag.enableServices();
googletag.display('div-gpt-ad-1234567891234-0');
});
</script>
</div>
Вариант 2: весь код размещен в основной части веб-страницы
Используйте традиционную реализацию тега GPT, но размещайте определения рекламных мест не в заголовке HTML, а на самой странице (в разделе body).
Код загрузки библиотеки и определения рекламных мест должен вызываться перед запросом объявлений для этих мест. Поскольку код не распределен между разделами head и body вашей страницы и нужно управлять последовательностью его выполнения, этот подход сложнее в реализации, однако при этом можно использовать режим единого запроса.
Как создать запрос без тегов, не используя JavaScript
Запрос без тегов можно использовать вмест�� тега объявления, чтобы получить исходный код креатива, показ которого выполняется в Менеджере рекламы. Такие запросы обычно создаются, если необходимо выполнять специальную обработку и показ, например при размещении рекламы на телеприставках и прочих платформах, не поддерживающих теги или SDK Google.