Eksempler på Google Publisher-tagger

I denne artikkelen presenterer vi eksempler på Google Publisher-tagger for implementering på mobile enheter og stasjonære datamaskiner. Finn ut hvordan du bruker generatoren for Google-tagger for å generere GPT-tagger automatisk.

Denne artikkelen inneholder:

Eksempel på en asynkron Google Publisher-tag

Nedenfor ser du et eksempel på den fullstendige koden du kan bruke for å opprette en asynkron Google Publisher-tag. Denne taggen illustrerer mange av de vanlige funksjonene samt syntaksen som brukes i asynkrone annonseforespørsler fra Google Publisher-tagger.

1 <html>
  • Linje 3–15 er standardtekst som asynkront laster inn – om nødvendig ved hjelp av SSL/HTTPS – JavaScript-biblioteket for GPT, som brukes av DFP. Det er her kommandokøen blir organisert. Køen håndterer listen over funksjoner (stort sett annonseanrop) som skal håndteres asynkront. Utgivere er ikke nødt til å endre elementer i denne delen av koden.

  • (Valgfritt:) Linje 16–20 angir attributter på sidenivå for annonsefelter som leverer til AdSense. Hvis disse angis her, overstyres eventuelle stilsett i DFP eller AdSense. Det er ikke vanlig å bruke disse linjene, siden du kan angi attributtene i DFP. Hvis du vil finne ut mer om hvordan du angir AdSense-parametere i GPT, kan du lese gjennom dokumentasjonen for .set()-funksjonen i brukerstøtten.

  • Linje 17, 22, 39 og 46: Hvis du bruker asynkron gjengivelse, pakker du alt av JavaScript – etter mønsteret til det innledende standardtekstskriptet – i googletag.cmd.push-funksjonen på linje 17. På denne måten legges funksjonen til i kommandokøen som skal behandles asynkront i sammenheng med sideinnlastingen. Finn ut mer om forskjellene mellom synkron og asynkron gjengivelse.

  • Linje 23: "/1234/travel/asia/food" angir nettverkskode (1234) og målrettet annonseenhet (travel/asia/food). Du kan finne nettverkskoden din i Administrator-fanen i DFP.

    728, 90 angir reklamestørrelsen til annonsefeltet. Her angir du hvilken reklamestørrelse eller hvilke reklamestørrelser som kan leveres til dette annonsefeltet. Angi flere størrelser ved hjelp av denne syntaksen (width = bredde): [[width1, height1], [width2, height2], [width3, height3]]. Alle størrelser her skal også være tilknyttet annonseenheten som er målrettet – på denne måten kan du avgrense listen basert på det spesifikke feltet. Når du bruker annonsefelter med flere størrelser, må størrelsene angis i samme rekkefølge som de vises i DFP. Finn ut mer om feltdefinisjoner og -rekkefølger.

  • Linje 23, 26, 37, 40, 44 og 47: "div-gpt-ad-123456789-0" – det er gjennom denne funksjonen vi sikrer samsvar mellom annonsefeltene som defineres i toppteksten, og annonsefeltene på siden (div-tag-ene i brødteksten (body-delen) der reklamene leveres) Disse kan navngis fritt, så lenge de stemmer overens. Tag-generatoren vår bruker imidlertid "div-gpt-ad-[random number]-0", "div-gpt-ad-[random number]-1" og så videre. Dette er bare en ryddig måte å gjøre tag-ene like på, men samtidig skille mellom dem.

    Selv om det her brukes vilkårlige tall, er ikke dette måten GPT unikt identifiserer en annonseforespørsel på. Det gjøres bak kulissene ved hjelp av GPT-biblioteket. Disse navnene kan i tillegg gjenbrukes på andre nettsider, forutsatt at det ikke finnes flere forekomster av det samme div-navnet på den samme siden.

  • Linje 25, 28, 29 og 30: Angi målretting mot nøkkelverdi-par på annonsefeltsnivå med .setTargeting()-funksjonen. Du kan knytte flere verdier til én nøkkel, som i det første eksempelet: ("key". ["value1", "value2", "value3"]). Hvis du vil målrette verdier mot flere nøkler, kaller du opp funksjonen flere ganger, som vist i det andre eksempelet (gender=male og age=20-30). Hvis du vil finne ut mer om hvordan du angir nøkkelverdi-parametere i GPT, kan du lese gjennom dokumentasjonen for .setTargeting()-funksjonen samt artikkelen om hvordan du angir målretting og størrelser ved hjelp av GPT. 

  • Linje 30: googletag.pubads().setTargeting("topic","basketball"); angir nøkkelverdi-målretting på sidenivå. Legg merke til at når tilpasset målretting konfigureres ved bruk av tilpasset målretting på sidenivå, så overføres denne tilpassede målrettingen til alle annonsefelter. På samme måte som med tilpasset målretting på annonsefeltsnivå, kan du knytte flere verdier til én nøkkel: ("key". ["value1", "value2", "value3"]). Hvis du vil finne ut mer om hvordan du angir nøkkelverdi-parametere i GPT, kan du lese dokumentasjonen for .setTargeting()-funksjonen samt artikkelen vår om hvordan du angir målretting og størrelser ved hjelp av GPT.

  • Linje 31: googletag.pubads().enableSingleRequest(); aktiverer enkeltforespørselarkitektur (SRA, Single Request Architecture). Ta med denne linjen hvis du ønsker å kalle opp alle annonsetidspunkt på siden i ett oppkall (tillater garanterte veisperringer og kan, ved konsolidering av annonser i ett oppkall, gi siden din bedre ytelse). Hvorfor velger noen å ikke bruke SRA? SRA støtter foreløpig ikke programmerbare Google-annonser (GPA).

  • Linje 37 (valgfritt): style="width: 728px; height: 90px" er størrelsen elementet har før reklamen gjengis. Hvis du bruker tagger i flere størrelser, er det best å utelate denne funksjonen (i så fall benyttes størrelsen på den valgte reklamen som størrelse for elementet, når reklamen er gjengitt). Hvis du eventuelt velger å bruke den, må du sørge for at begge dimensjonene er store nok til å inneholde den største av de kvalifiserte reklamene. For annonse-tagger i én enkelt størrelse kan imidlertid denne størrelsen brukes for å utvide beholderelementet frem til reklamen lastes inn, slik at andre sideelementer ikke forskyves når reklamen gjengis.

2 <head>
3 <script type="text/javascript">
4   var googletag = googletag || {};
5   googletag.cmd = googletag.cmd || [];
6   (function() {
7     var gads = document.createElement("script");
8     gads.async = true;
9     gads.type = "text/javascript";
10     var useSSL = "https:" == document.location.protocol;
11     gads.src = (useSSL ? "https:" : "http:") + "//www.googletagservices.com/tag/js/gpt.js";
12     var node =document.getElementsByTagName("script")[0];
13     node.parentNode.insertBefore(gads, node);
14    })();
15 </script>
16 <script type="text/javascript">
17   googletag.cmd.push(function() {
18     googletag.pubads().set("adsense_background_color", "FFFFFF");
19   });
20 </script>
21 <script>
22   googletag.cmd.push(function() {
23     googletag.defineSlot("/1234/travel/asia/food", [728, 90], "div-gpt-ad-123456789-0")
24       .addService(googletag.pubads())
25       .setTargeting("interests", ["sports", "music", "movies"]);
26     googletag.defineSlot("/1234/travel/asia/food", [[468, 60], [728, 90], [300, 250]], "div-gpt-ad-123456789-1")
27       .addService(googletag.pubads())
28       .setTargeting("gender", "male")
29       .setTargeting("age", "20-30");
30     googletag.pubads().setTargeting("topic","basketball");
31     googletag.pubads().enableSingleRequest();
32     googletag.enableServices();
33   });
34 </script>
35 </head>
36 <body>
37   <div id="div-gpt-ad-123456789-0" style="width: 728px; height: 90px">
38     <script type="text/javascript">
39       googletag.cmd.push(function() {
40       googletag.display("div-gpt-ad-123456789-0");
41       });
42     </script>
43   </div>
44     <div id="div-gpt-ad-123456789-1">
45     <script type="text/javascript">
46       googletag.cmd.push(function() {
47          googletag.display("div-gpt-ad-123456789-1");
48       });
49     </script>
50   </div>
51 </body>
52 </html>
 

Eksempel på en synkron Google Publisher-tag

Nedenfor ser du et eksempel på den fullstendig koden du må bruke for å opprette en synkron Google Publisher-tag. Denne taggen illustrerer mange av de vanlige funksjonene samt syntaksen som brukes i synkrone annonseforespørsler fra Google Publisher-tagger.

Hvis du vil finne ut mer om hvordan du genererer Google Publisher-tagger, kan du lese gjennom artikkelen om generering av tagger i DFP.

1 <html>
  • Linje 3–10 er standardtekst som asynkront laster inn – om nødvendig ved hjelp av SSL/HTTPS – JavaScript-biblioteket for GPT, som brukes av DFP. Det er her kommandokøen blir organisert. Køen håndterer listen over funksjoner (stort sett annonseanrop) som skal håndteres asynkront. Utgivere er ikke nødt til å endre elementer i denne delen av koden.

  • (Valgfritt:) Linje 11–13 angir attributter på sidenivå for annonsefelter som leverer til AdSense. Hvis disse angis her, overstyres eventuelle stilsett i DFP eller AdSense. Det er ikke vanlig å bruke disse linjene, siden du kan angi attributtene i DFP. Hvis du vil finne ut mer om hvordan du angir AdSense-parametere i GPT, kan du lese gjennom dokumentasjonen for .set()-funksjonen i brukerstøtten.

  • Linje 15 og 18: "/1234/travel/asia/food" angir nettverkskode (1234) og målrettet annonseenhet (travel/asia/food). Du kan finne nettverkskoden din i Administrator-fanen i DFP.

    728, 90 angir reklamestørrelsen til annonsefeltet. Her angir du hvilken reklamestørrelse eller hvilke reklamestørrelser som kan leveres til dette annonsefeltet. Angi flere størrelser ved hjelp av denne syntaksen (width = bredde): [[width1, height1], [width2, height2], [width3, height3]]. Alle størrelser her skal også være tilknyttet annonseenheten som er målrettet – på denne måten kan du avgrense listen basert på det spesifikke feltet. Når du bruker annonsefelter med flere størrelser, må størrelsene angis i samme rekkefølge som de vises i DFP. Finn ut mer om feltdefinisjoner og -rekkefølger.

    Linje 15, 18, 29, 31, 34 og 36: "div-gpt-ad-123456789-0" – det er gjennom denne funksjonen vi sikrer samsvar mellom annonsefeltene som defineres i toppteksten, og annonsefeltene på siden (div-tag-ene i brødteksten (body-delen) der reklamene leveres). Disse kan navngis fritt, så lenge de stemmer overens. Tag-generatoren vår bruker imidlertid "div-gpt-ad-[random number]-0", "div-gpt-ad-[random number]-1" og så videre. Dette er bare en ryddig måte å gjøre tag-ene like på, men samtidig skille mellom dem.

    Selv om det her brukes vilkårlige tall, er ikke dette måten GPT unikt identifiserer en annonseforespørsel på. Det gjøres bak kulissene ved hjelp av GPT-biblioteket. Disse navnene kan i tillegg gjenbrukes på andre nettsider, forutsatt at det ikke finnes flere forekomster av det samme div-navnet på den samme siden.

  • Linje 17, 20, 21 og 22 (valgfritt): Angi målretting mot nøkkelverdi-par på annonsefeltsnivå med .setTargeting()-funksjonen. Du kan knytte flere verdier til én nøkkel, som i det første eksempelet: ("key". ["value1", "value2", "value3"]). Hvis du vil målrette verdier mot flere nøkler, kaller du opp funksjonen flere ganger, som vist i det andre eksempelet (gender=male og age=20-30). Hvis du vil finne ut mer om hvordan du angir nøkkelverdi-parametere i GPT, kan du lese gjennom dokumentasjonen for .setTargeting()-funksjonen samt artikkelen om hvordan du angir målretting og størrelser ved hjelp av GPT. 

  • Linje 22: googletag.pubads().setTargeting("topic","basketball"); angir nøkkelverdi-målretting på sidenivå. Legg merke til at når tilpasset målretting konfigureres ved bruk av tilpasset målretting på sidenivå, så overføres denne tilpassede målrettingen til alle annonsefelter. På samme måte som med tilpasset målretting på annonsefeltsnivå, kan du knytte flere verdier til én nøkkel: ("key". ["value1", "value2", "value3"]). Hvis du vil finne ut mer om hvordan du angir nøkkelverdi-parametere i GPT, kan du lese dokumentasjonen for .setTargeting()-funksjonen samt artikkelen vår om hvordan du angir målretting og størrelser ved hjelp av GPT.

  • Linje 23: googletag.pubads().enableSingleRequest(); aktiverer enkeltforespørselarkitektur (SRA, Single Request Architecture). Ta med denne linjen hvis du ønsker å kalle opp alle annonsetidspunkt på siden i ett oppkall (tillater garanterte veisperringer og kan gi siden din bedre ytelse, ved hjelp av konsolidering av annonser i ett oppkall). Hvorfor velger noen å ikke bruke SRA? SRA støtter foreløpig ikke programmerbare Google-annonser (GPA).

  • Linje 24: Du kan få gjengitt reklamer synkront ved å legge til googletag.pubads().enableSyncRendering();. Dette ber tjenesten om å vente på at hver enkelt annonseforespørsel skal fullføres før siden gjengis videre.

  • Linje 29 (valgfritt): style="width: 728px; height: 90px" er størrelsen elementet har før reklamen gjengis. Hvis du bruker tagger i flere størrelser, er det best å utelate denne funksjonen (i så fall benyttes størrelsen på den valgte reklamen som størrelse for elementet, når reklamen er gjengitt). Hvis du eventuelt velger å bruke den, må du sørge for at begge dimensjonene er store nok til å inneholde den største av de kvalifiserte reklamene. For annonse-tagger i én enkelt størrelse kan imidlertid denne størrelsen brukes for å utvide beholderelementet frem til reklamen lastes inn, slik at andre sideelementer ikke forskyves når reklamen gjengis.

2 <head>
3 <script type="text/javascript">
4   (function() {
5   var useSSL = 'https:' == document.location.protocol;
6   var src = (useSSL ? 'https:' : 'http:') +
7 '//www.googletagservices.com/tag/js/gpt.js';
8   document.write('<scr' + 'ipt src="' + src + '"></scr' + 'ipt>');
9   })();
10 </script>
11 <script type="text/javascript">
12     googletag.pubads().set("adsense_background_color", "FFFFFF");
13 </script>
14 <script>
15     googletag.defineSlot("/1234/travel/asia/food", [728, 90], "div-gpt-ad-123456789-0")
16       .addService(googletag.pubads())
17       .setTargeting("interests", ["sports", "music", "movies"]);
18     googletag.defineSlot("/1234/travel/asia/food", [[468, 60], [728, 90], [300, 250]], "div-gpt-ad-123456789-1")
19       .addService(googletag.pubads())
20       .setTargeting("gender", "male")
21       .setTargeting("age", "20-30");
22     googletag.pubads().setTargeting("topic","basketball");
23     googletag.pubads().enableSingleRequest();
24     googletag.pubads().enableSyncRendering();
25     googletag.enableServices();
26 </script>
27 </head>
28 <body>
29   <div id="div-gpt-ad-123456789-0" style="width: 728px; height: 90px">
30     <script type="text/javascript">
31       googletag.display("div-gpt-ad-123456789-0");
32     </script>
33   </div>
34   <div id="div-gpt-ad-123456789-1">
35     <script type="text/javascript">
36       googletag.display("div-gpt-ad-123456789-1");
37     </script>
38   </div>
39 </body>
40 </html>
 

Hvis du ikke får til å redigere overskriftene på nettsidene dine

Du kan bruke GPT uten å endre toppteksten (head-delen) på nettsidene dine ved å definere annonseenhetene på selve siden der de vises, i stedet for å gjøre dette i toppteksten på siden. For dynamisk genererte sider kan det være nyttig å sette inn annonseenhetsdefinisjoner på selve siden etter hvert som delene genereres.

Siden annonse-taggen bruker JavaScript-biblioteket til GPT, må du sørge for at du tar med koden som laster inn biblioteket, før du inkluderer koden for annonse-taggen. Koden som laster inn biblioteket, er tatt med i eksempelet nedenfor.

Vi anbefaler at du plasserer GPT-koden i toppteksten (head-delen) på nettsidene dine, der dette er mulig, siden det gjør implementeringen enklere. Fremgangsmåten som beskrives i denne delen, bør bare brukes hvis du ikke har mulighet til å redigere toppteksten (head-delen).

Hvis du vil at et annonsefelt skal defineres mens siden lastes inn, kan du bruke følgende eksempler:

Eksempel på en asynkron GPT

Anrop til JavaScript-biblioteket for GPT

<script type="text/javascript">
 var googletag = googletag || {};
 googletag.cmd = googletag.cmd || [];
 (function() {
   var gads = document.createElement("script");
   gads.async = true;
   gads.type = "text/javascript";
   var useSSL = "https:" == document.location.protocol;
   gads.src = (useSSL ? "https:" : "http:") + "//www.googletagservices.com/tag/js/gpt.js";
   var node =document.getElementsByTagName("script")[0];
   node.parentNode.insertBefore(gads, node);
  })();
</script>

Annonse-tag, eksempel 1: asynkron integrert tag

<div id="div-gpt-ad-1234567891234-0">
  <script type='text/javascript'>
    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>

Annonse-tag, eksempel 2: asynkron og komprimert integrert tag (denne metoden støtter ikke målretting på annonsefeltsnivå)

<div id='div-gpt-ad-1234567891234-0'>
  <script type='text/javascript'>
    googletag.cmd.push(function() {
      googletag.pubads().display('/1234/sports/football', [728, 90], 'div-gpt-ad-1234567891234-0');
    });
  </script>
</div>
Eksempel på en synkron GPT

Anrop til JavaScript-biblioteket for GPT

<script type="text/javascript">
 (function() {
   var useSSL = 'https:' == document.location.protocol;
   var src = (useSSL ? 'https:' : 'http:') + '//www.googletagservices.com/tag/js/gpt.js';
   document.write('<scr' + 'ipt src="' + src + '"></scr' + 'ipt>');
 })();
</script>

Annonse-tag, eksempel 1: synkron integrert tag

<div id='div-gpt-ad-1234567891234-0'>
  <script type='text/javascript'>
    googletag.defineSlot('/1234/sports/football', [728, 90],'div-gpt-ad-1234567891234-0')
      .addService(googletag.pubads())
      .setTargeting("Gender", "Male");
    googletag.pubads().enableSyncRendering();
    googletag.enableServices();googletag.display('div-gpt-ad-1234567891234-0');
  </script>
</div>

Annonse-tag, eksempel 2: integrerte tagger, komprimert format (denne metoden støtter ikke målretting på annonsefeltsnivå)

<div id='div-gpt-ad-1234567891234-0'>
  <script type='text/javascript'>
    googletag.pubads().enableSyncRendering().display('/1234/sports/football', [728, 90], 'div-gpt-ad-1234567891234-0');
  </script>
</div>

Overstyring av AdSense-formatering på sidenivå (valgfritt)

I de fleste tilfeller har du alt angitt formatering for AdSense-annonsene dine i DFP eller AdSense. Hvis du ønsker å overstyre denne formateringen på det individuelle sidenivået, må du imidlertid sette inn den følgende koden i taggene dine.

For asynkrone tagger:

<script>
  googletag.cmd.push(function() {
    googletag.pubads().set("adsense_background_color", "FFFFFF");
  });
</script>

For synkrone tagger:

<script>
  googletag.pubads().set("adsense_background_color", "FFFFFF");
</script>

Bruk av Google Publisher-tagger uten JavaScript for å opprette sporingspiksler i formatet 1 x 1

Slik oppretter du en visningssporer med GPT:

  1. Opprett en ny eller ta i bruk en eksisterende annonseenhet, og bruk denne til å spore visningstellingen.

  2. Opprett en ordrelinje i formatet 1 x 1, og legg til en transparent pikseltilpasset eller tredjeparts reklame i den.

  3. Ordrelinjen på 1 x 1 målretter du så mot annonseenheten du bruker for sporing.

  4. Opprett en Google Publisher-tag uten JavaScript, som kaller opp visningspikselen.

    Nedenfor kan du se et eksempel på koden du må legge til i reklamekoden for å opprette en visningssporer i formatet 1 x 1 ved hjelp av tagformatet uten JavaScript.

    <img src='http://pubads.g.doubleclick.net/gampad/ad?iu=/1234/ad_unit&sz=1x1&t=&c=12345678'/>
  5. Bruk visningspiksel-taggen på én av to måter:

    • Legg til taggen i en tilpasset reklame eller tredjepartsreklame som skal leveres på siden. I reklamens Innstillinger-fane legger du til taggen øverst i Kodebit-feltet.

    • Legg til taggen direkte på nettsiden.

Hvis du vil finne ut mer om hvordan du genererer nettadresser som ikke er basert på JavaScript, kan du lese gjennom artikkelen om levering av annonser til miljøer uten JavaScript.

Hvor nyttig er denne artikkelen for deg:

Tilbakemeldingen er registrert. Takk skal du ha.
  • Svært unyttig
  • Ikke særlig nyttig
  • Litt nyttig
  • Svært nyttig
  • Ekstremt nyttig