ADMAN Interstitial Creatives

Transcript

1 ADMAN Interstitial Creatives

2 ADMAN Interstitial Creatives Βασικές οδηγίες 2 Μέτρηση clicks Κατασκευή με Tumult Hype Πολλαπλά URLs Preloader Μέτρηση Interactions Interstitial creatives 4

3 Σελίδα 2 Βασικές οδηγίες Για την υλοποίηση ενός HTML5 δημιουργικού μπορείτε να χρησιμοποιήσετε το επιθυμητό javascript framework. Το τελικό δημιουργικό πρέπει να είναι συμβατό με mobile συσκευές, καθώς και να υποστηρίζεται από Internet Explorer 9 και πάνω. Το user experience ή animations δεν είναι απαραίτητο να είναι κοινά σε όλους τους browsers, αλλά να παρέχεται ένα βασικό fallback experience. Παραδιδόμενα υλικά: μία html σελίδα και όλα τα απαραίτητα assets του δημιουργικού (πχ css, images, js). Εισάγετε το adman.js script στο head τμήμα της σελίδας σε κάθε τύπο δημιουργικού για την ορθή διασύνδεση με την υπηρεσία ADMAN: <script src= ></script> Μέτρηση clicks Για την καταμέτρηση των clicks από τον ADMAN κάθε click πρέπει να οδηγεί στην διεύθυνση που θα ληφθεί από την εντολή Adman.html5API.get( click'). Παράδειγμα με window.open: window.open(adman.html5api.get('click')); Παράδειγμα με click event σε element: <div onclick="window.open(adman.html5api.get('click'))"></div> Κατασκευή με Tumult Hype window.open(decodeuri(adman.html5api.get('click')));

4 Σελίδα 3 Πολλαπλά URLs Σε περίπτωση που το δημιουργικό έχει πολλαπλά links/buttons με διαφορετικά URL, θα πρέπει σε καθένα από αυτά να κατευθύνετε τον χρήστη στο επιθυμητό URL και ταύτοχρονα να εκτελείται η εντολή του ADMAN για την καταγραφή του click, όπως στο παρακάτω παράδειγμα: <a href=" target= _blank" onclick="window.open(adman.html5api.get('click'))"></a> Preloader Σε creatives με preloader, που φορτώνουν δεύτερη html σελίδα έπειτα από ενέργεια του χρήστη, δηλώστε στο URL της νέας σελίδας το τρέχον location.search ως εξής: window.open("video.html" + window.location.search, "_self"); Μέτρηση Interactions Τα interactions αναφέρονται στην ανίχνευση των αλληλεπιδράσεων του χρήστη με το δημιουργικό. Για την καταμέτρηση ενεργειών του χρήστη από τον ADMAN, πρέπει να προστεθεί, εκτός από το adman.js στο head (βλ. Βασικές Οδηγίες παραπάνω), επιπλέον javascript κλήση με όρισμα το όνομα του εκάστοτε interaction. Ενημερώστε τον διαχειριστή του ADMAN για το όνομα του interaction που χρησιμοποιήσατε. Adman.track(Adman.html5API.get('interaction_name')); Παράδειγμα: var interactclickhandler = function () { console.log( interaction_name'); //usefull for traffickers Adman.track(Adman.html5API.get('interaction_name')); } Κατεβάστε demo αρχεία

5 Σελίδα 4 Interstitial creatives Απαραίτητo adman.js στο head τμήμα του html αρχείου (βλ. Βασικές Οδηγίες) Μία interstitial page πρέπει να έχει τον παρακάτω βασικό κώδικα: <script src= <script> // Don't change this var matches = document.location.search.split(' '), url = matches[0] && decodeuricomponent(matches[0].match(/adman=(.*)/)[1]), go = matches[1] && decodeuricomponent(matches[1]), done = function () { top.location = url; // redirects user back to site }; window.admanpa = matches[2] && [JSON.parse(decodeURIComponent(matches[2]))]; </script> Για το redirection στο site μετά από μερικά δευτερόλεπτα, εκτελέστε την εντολή done με χρήση timeout: settimeout(done, 10000) Αντίστοιχα αν υπάρχει κάποιο link για την επιστροφή στο site, καλέστε την εντολή done όπως παρακάτω: <a href="#" onclick="done();" class="back">επιστροφή στο site</a> Για την καταμέτρηση clicks ορίστε με click event και καλέστε την εντολή window.open(go): <div id="banner" onclick="window.open(go)"></div> Για την καταμέτρηση viewability ορίστε την παρακάτω εντολή δίνοντας ως πρώτο όρισμα το σωστό element προς μέτρηση: <script> // if you need viewability give the correct element id new Adman.Viewable(document.getElementById('banner')).enable(); </script> Κατεβάστε demo σελίδα