1 / 29

Custom Scripts and Ad Customization

Custom Scripts and Ad Customization. Michael Denton | Publisher Formats Engineer Tia Koehler | Tier 2 Engineer November 2011. Agenda. Existing Mediamind Platform Formats Customization Examples Certification Process Q&A/Discussion. Existing Mediamind Platform Formats.

marv
Download Presentation

Custom Scripts and Ad Customization

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Custom Scripts and Ad Customization Michael Denton | Publisher Formats Engineer Tia Koehler | Tier 2 EngineerNovember 2011

  2. Agenda • Existing Mediamind Platform Formats • Customization • Examples • Certification Process • Q&A/Discussion

  3. Existing Mediamind Platform Formats

  4. List of Existing Formats • In Banner • Standard Banner / Enhanced Standard Banner • Polite Banner • Expandable Banner / Standard Expandable • Single Expandable / Expandable Strip • Popup Banner • Pushdown • Out Of Banner • Commercial Break, Floating Ad (w/ reminder or without), Wallpaper Ad, Window Ad, Standard Floating Ad • Mobile • Other (Vast/InStream)

  5. Platform List of Display Ad Formats

  6. Customization

  7. How does customization work? • Sometimes just creative execution utilizing existing format • Can require much more • If a one-off, would go to the Custom Projects queue • If a template for multiple ads, would go to PIT (Product Innovation Team), formerly the Publisher Formats team • If an issue (something is broken), would go to Tier 1 by emailing (support@mediamind.com). The issue then may be resolved with custom script patch by Tier 1 or, when necessary, they may escalate to Tier 2 or Tier 3 to develop.

  8. Type of customization via javascript • Injection Points (triggered by delivery scripts) via javascript to modify an ads behavior • Modify CSS (including animation) • Event-driven actions • Javascript/Flash communcation • Flash/Flash communication via javscript • Communcation with parent page (pause existing videos, collapse visible divs, etc)

  9. Injection Points • onClientScriptsLoaded • onBeforeAddRes • onBeforeAddPanelRes • onHandleInteraction • onBefore(After)DefaultBannerShow • onBefore(After)RichFlashShow • onBefore(After)PanelShow(Hide) • onBefore(After)AdClose • onBefore(After)IntroShow (Hide) • onBefore(After)RemShow (Hide) • onBefore(after)MiniSiteShow (Hide)

  10. Injection Points • onClientScriptsLoaded - Fires when all the JavaScript files have been loaded (except for the Positioning file for OOB). Can overwrite client code functions here • onBeforeAddRes/onBeforeAddPanelRes - Use when you need to modify something (possibly position or dimension) in the banner / panel assets which you need to save permanently in the banner/panel object. • onHandleInteraction - Custom Interactions, Unique Dwell, Above The Fold, Clickthroughs, etc. • onBefore(After)DefaultBannerShow and onBefore(After)RichFlashShow - Change CSS

  11. Custom Script Template • http://ds.serving-sys.com/BurstingRes/CustomScripts/CustomScript_Template.js

  12. When to Fire the Script (On Ad Preload)

  13. When to Fire the Script (On Ad Download)

  14. When to Fire the Script (On Ad Play)

  15. Tokens • [%tp_adid%] • [%tp_flightid%] OR [%tp_PlacementID%] • [%tp_CampaignID%] • [%tp_PlacementBannerSize%]

  16. Other Abilities • Can handle (and filter) browser version/type and OS detection • Create event handlers (mouseover/out, scroll, resize, etc) • Communicate with flash assets via javscript (and vice versa) • Calculate viewable size of screen and adjust swfs accordingly (positioning/dimension) • Implement non-standard Brand Awareness / Surveys which do not fire properly in the system as is

  17. Uploading Custom Scripts

  18. Uploading Custom Scripts • Naming Convention: • PL_ScriptName_PublisherName.js • OAD_ScriptName_PublisherName.js • OAP_ScriptName_PublisherName.js • Akamai Purge URL: http://10.2.0.110:8080/Default.aspx

  19. Examples

  20. Windows Live Click to Share • http://demo.mediamind.com/PublisherFormats/MS/WL_ClickToShare_300x250_Expandable_Demo.html • Using OnAfterPanelShow • Constantly checks for loss of focus of the panel swf, upon loss of focus, collapse panel

  21. MSN Filmstrip • http://demo.mediamind.com/PublisherFormats/MS/WL_Filmstrip_300x600_Demo.html • Only using injection points to get a reference to the SWF and attach an onScroll event • Listening for scroll of page, then sends message to SWF notifying SWF to advance the scene to the next

  22. New York Times Sidekick With Ears • http://demo.mediamind.com/PublisherFormats/NYTimes/NYTimes_SidekickWithEars_AS3_Demo.html • Modified version of "Sidekick" format (which is available as a block, a modified version of the expandable banner) • Using many different functions to achieve cross-swf communcation and expansion of the sidekicked panel. • 3 separate ads on the page, all communicating together • Script allows positioning of the "sidekick" panel is relative to another div on the page, not to the banner (which is more typical)

  23. Windows Live SmartServe API Header • http://demo.mediamind.com/PublisherFormats/MS/WLHM_SmartServeAPI_ExpandableHeader_Demo.html • Ad served in unfriendly Iframe and communicates with a publisher API • API allows expansion of iframes and creation of header iframe • Header and Banner communicate via javascript with one another for changing states • Overrides the collapsing of all panels on clickthrough, as this would break functionality and leave header expanded.

  24. NetEase China Pushdown With Reminder • http://demo.mediamind.com/PublisherFormats/NetEaseChina/NetEaseChina_Pushdown_Demo.html • Ad is served out of a 1x1 • Pushdown swf and reminder swf are all panels • Reminders sit along bottom of screen and don't scroll • Pushdown rhas smooth animation and receives events from javascript for ending of animation for expansion and beginning of animation for collapse • Pushdown is injected into DOM via javscript

  25. Generic Script • http://ds.serving-sys.com/BurstingRes/CustomScripts/SetDivsStyles_Event_BrowserVer_RB_OOB_Relative_Class_Rules.js • This script allows us to modify any css rules of any div or style on the page, triggered by any event supported, and filterable by browser type and version. • Able to use one script and pass parameters to that script to handle the CSS change • Prior to development of this script, would need css changes hard-coded into script, now is more dynamic and script is reusable

  26. Certification Process

  27. Why do we certify formats? • All publisher pages are different (Layout, JS, CSS) • Many publishers have different specifications for their ads • Ensure an ad format we currently offer runs correctly on the publisher’s site • Ensure a newly created format we do not currently offer is developed to spec and runs smoothly/correctly on publisher’s site • Provide templates and build guides to creative shops for easier/smoother execution • Cut down on required escalated support by eliminating bugs before campaigns go live

  28. Q&A / Discussion

  29. Thank you!

More Related