Δείγμα κώδικα Ετικέτας του Google Publisher

Παρακάτω θα βρείτε ένα δείγμα του πλήρους κώδικα για τη δημιουργία μιας Ετικέτας του Google Publisher (GPT) που μπορεί να εφαρμοστεί σε υπολογιστές και κινητές συσκευές. Χρησιμοποιήστε το Πρόγραμμα δημιουργίας ετικετών Google για αυτόματη δημιουργία ετικετών.

Οι προγραμματιστές και όσοι χρειάζονται σύνθετες υλοποιήσεις GPT, μπορούν να ανατρέξουν στην τεκμηρίωση API και στα δείγματα υλοποιήσεων (όπως η αργή φόρτωση).

Προβολή σύνθετων δειγμάτων GPT

Παράδειγμα κώδικα Ετικέτας του Google Publisher

Υπάρχουν δύο τμήματα κώδικα που έχουν υλοποιηθεί για το 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 που χρησιμοποιείται από το Ad Manager, χρησιμοποιώντας SSL/HTTPS. Σε αυτό το σημείο δημιουργείται η ουρά των εντολών η οποία διαχειρίζεται τη λίστα των λειτουργιών (γενικά, κλήσεις διαφημίσεων), των οποίων η διαχείριση γίνεται ασύγχρονα. Δεν χρειάζεται να επεξεργαστείτε αυτή την ενότητα κώδικα.
7	`<script>`
8	`googletag.cmd.push(function() {`
9	`googletag.defineSlot("/1234/travel/asia", [728, 90], "div-gpt-ad-123456789-0")`
Γραμμή 9: Το `"/1234/travel/asia"` καθορίζει τον κωδικού δικτύου (`1234`) και το στοχευμένο στοιχείο διαφημίσεων (`travel/asia`). Βρείτε τον κωδικό του δικτύου σας Ad Manager στην ενότητα Διαχειριστής Καθολικές ρυθμίσεις Κωδικός δικτύου. Το `[728, 90]` ορίζει το μέγεθος δημιουργικού της υποδοχής διαφήμισης. Υποδείξτε πολλά μεγέθη με τη χρήση της σύνταξης: `[[width1, height1], [width2, height2], [width3, height3]]`. Συσχετίστε όλα τα μεγέθη που βρίσκονται εδώ με το στοχευμένο στοιχείο διαφημίσεων, περιορίζοντας έτσι τη λίστα βάσει της συγκεκριμένης υποδοχής. Όταν χρησιμοποιείτε υποδοχές διαφημίσεων πολλών μεγεθών, δηλώστε τα μεγέθη των υποδοχών με την ίδια σειρά που εμφανίζονται στο Ad Manager. Μάθετε περισσότερα σχετικά με τον ορισμό της θέσης υποδοχής και τη διαδοχικότητα.
`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: Ορίζουν στόχευση κλειδιού-τιμής σε επίπεδο υποδοχής με το `.setTargeting()`. Μπορείτε να συσχετίσετε πολλές τιμές με ένα κλειδί, όπως στο πρώτο παράδειγμα: `("key", ["value1", "value2", "value3"])`. Για να στοχεύσετε πολλά κλειδιά, καλέστε τη συνάρτηση πολλές φορές, όπως στη δεύτερη περίπτωση: (`gender=male` και `age=20-30`). Μάθετε περισσότερα σχετικά με τη ρύθμιση στόχευσης και μεγεθών με το GPT.
16	`googletag.pubads().setTargeting("topic","basketball");`
Γραμμή 16: Το `googletag.pubads().setTargeting("topic","basketball");` ορίζει στόχευση κλειδιού-τιμής σε επίπεδο σελίδας. Κατά τη διαμόρφωση της στόχευσης με κλειδιά-τιμές σε επίπεδο σελίδας, όλες οι υποδοχές διαφημίσεων υιοθετούν αυτή τη στόχευση. Όπως και στα κλειδιά-τιμές σε επίπεδο υποδοχής, μπορείτε να συσχετίσετε πολλές τιμές με ένα κλειδί: (`"key", ["value1", "value2", "value3"]`).
17	`googletag.pubads().enableSingleRequest();`
Γραμμή 17: Το `googletag.pubads().enableSingleRequest();` ενεργοποιεί την Αρχιτεκτονική ενός αιτήματος (SRA). Συμπεριλάβετε αυτή τη γραμμή για να καλέσετε όλες τις υποδοχές διαφημίσεων στη σελίδα σε μία κλήση, κάτι που διασφαλίζει ότι όλες οι υποδοχές διαφημίσεων στη σελίδα λαμβάνονται υπόψη κατά την αξιολόγηση ταυτόχρονων εμφανίσεων και ανταγωνιστικών εξαιρέσεων.
18	`googletag.enableServices();`
19	`});`
`20`	`</script>`
`21`	`</head>`
`22`	`<body>`
`23`	`<div id="div-gpt-ad-123456789-0" style="width: 728px; height: 90px">`
Γραμμή 23 (προαιρετικό): Το `style="width: 728px;height: 90px"` είναι το αρχικό μέγεθος που έχει οριστεί στον χώρο δέσμευσης div πριν από την απόδοση του δημιουργικού. Εάν χρησιμοποιείτε ετικέτες πολλαπλών μεγεθών, συνιστούμε είτε να παραλείψετε αυτή την ενέργεια (σε αυτή την περίπτωση, το μέγεθος του στοιχείου αποκτά το μέγεθος του επιλεγμένου δημιουργικού κατά την απόδοση) είτε να κάνετε και τις δύο διαστάσεις αρκετά μεγάλες ώστε να περιέχουν το μεγαλύτερο κατάλληλο δημιουργικό. Για τις ετικέτες διαφημίσεων ενός μεγέθους, χρησιμοποιήστε αυτή την παράμετρο για την επέκταση του στοιχείου του κοντέινερ μέχρι τη φόρτωση του δημιουργικού, έτσι ώστε να μην αλλάζουν άλλα στοιχεία σελίδας κατά την απόδοση του δημιουργικού.
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: Με το `"div-gpt-ad-123456789-0"` γίνεται η αντιστοίχιση των υποδοχών διαφημίσεων που προσδιορίζονται στην κεφαλίδα με τις υποδοχές διαφημίσεων της σελίδας (οι ετικέτες div στο κυρίως σώμα όπου εμφανίζονται τα δημιουργικά). Μπορεί να τους δοθεί οποιοδήποτε όνομα, αρκεί να αντιστοιχούν, αλλά το πρόγραμμα δημιουργίας ετικετών χρησιμοποιεί τη μέθοδο ονοματοδοσίας `"div-gpt-ad-[random number]-0"`, `"div-gpt-ad-[random number]-1"` κ.ο.κ. Χρησιμοποιήστε το ίδιο αναγνωριστικό `<div>` με συνέπεια για μια δεδομένη θέση σε μια σελίδα καθώς χρησιμοποιείται για τη βελτιστοποίηση ενός μεγάλου εύρους περιοχών. Ενώ εδώ χρησιμοποιούνται τυχαίοι αριθμοί, η βιβλιοθήκη GPT δεν προσδιορίζει μοναδικά ένα αίτημα για διαφήμιση με αυτόν τον τρόπο. Αυτό γίνεται στο παρασκήνιο με τη βιβλιοθήκη GPT. Επιπλέον, αυτά τα ονόματα ενδέχεται να είναι τα ίδια από σελίδα σε σελίδα, εφόσον δεν υπάρχουν πολλές παρουσίες του ίδιου ονόματος div στην ίδια σελίδα. Μάθετε περισσότερα σχετικά με τη δομή αποθέματος του Ad Manager, την ιεραρχία στοιχείων διαφημίσεων και τον τρόπο μεταβίβασης της στόχευσης στα στοιχεία διαφημίσεων στην επισκόπηση αποθέματος.
34	`});`
35	`</script>`
36	`</div>`
37	`</body>`
38	`</html>`

Προβολή σύνθετων δειγμάτων GPT

Εάν δεν μπορείτε να επεξεργαστείτε την κεφαλίδα των ιστοσελίδων σας

Μπορείτε να χρησιμοποιήσετε τη βιβλιοθήκη GPT χωρίς να τροποποιήσετε την ετικέτα <header> του ιστοτόπου σας.

Επιλογή 1: Ενσωματωμένη βιβλιοθήκη GPT

Αντί να χρησιμοποιήσετε την κεφαλίδα της σελίδας, χρησιμοποιήστε μια ενσωματωμένη ετικέτα για να ορίσετε σε ποιο σημείο της σελίδας θα εμφανίζεται το στοιχείο διαφημίσεων. Με μια ενσωματωμένη ετικέτα, ολόκληρος ο ορισμός και το αίτημα της υποδοχής διαφήμισης GPT, συμπεριλαμβανομένης της φόρτωσης της βιβλιοθήκης GPT, περιέχεται σε μία μόνο ετικέτα <script>.

Επειδή η ετικέτα διαφήμισης χρησιμοποιεί τη βιβλιοθήκη JavaScript GPT, θα πρέπει να συμπεριλάβετε τον κώδικα που φορτώνει τη βιβλιοθήκη προτού συμπεριλάβετε τον κώδικα ετικέτας διαφήμισης.

Παράδειγμα ενσωματωμένης βιβλιοθήκης GPT

Αυτά τα παραδείγματα ενσωματωμένης βιβλιοθήκης GPT δεν υποστηρίζουν SRA.

Κλήση της βιβλιοθήκης JavaScript GPT

<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. Σε γενικές γραμμές, τα Αιτήματα χωρίς ετικέτα χρησιμοποιούνται όταν απαιτείται προσαρμοσμένη ανάλυση και προβολή, όπως σε αποκωδικοποιητές ή άλλα περιβάλλοντα χωρίς προσθήκη ετικετών ή υποστήριξη SDK Google.

Σας βοήθησε αυτό;

Με ποιον τρόπο μπορούμε να το βελτιώσουμε;