Kód pro nasazení jako richmedia je tvořen vlastním HTML kódem, který bude do stránky vložen ve značce iframe. Případné externí soubory, jako obrázky, jsou dodány společně s kódem a v kódu jsou odkazované s relativní cestou a bez podadresářů.


Prokliky z banneru


Prokliky v HTML banneru definujeme v těle banneru pomocí <a> s atributem href a target. Odkaz do href můžeme dát libovolný – bude změněn na dynamickou proměnnou při nasazení banneru do reklamního systému.


U cíle odkazu (html atribut target), který také může být změněn při vložení do reklamního systému, vložíme hodnotu _top případně _blank (otevře v prohlížeči v původním okně i kdyby byl banner vložen přes iframe).


V rámci iBB Ad Server vkládáme následující kód mezi <script></script> tagy do hlavičky HTML dokumentu. (Zajistí předávání proměnné a počítání kliknutí v Ad Server systému a zároveň nahradí hodnoty href atributu za odpovídající REDIRECT proměnnou.)


 


HTML


<script>
function getQueryParam(paramName) { 
  
var qs=location.search; 
qs=qs.substr(qs.indexOf("?")+1); 
allParams=qs.split("&"); 
for (i=0;i<allParams.length;i++) { 
keyVal=allParams[i].split("="); 
if (keyVal[0]==paramName){ 
return unescape(keyVal[1]); 
} 
} 
return null; 
} 
 
document.addEventListener("DOMContentLoaded", function(event) {  
var aredir = document.getElementsByTagName('a'); 
for ( i=0; i<aredir.length; i++){ 
  aredir[i].href= getQueryParam('redir'); 
  aredir[i].target= getQueryParam('bbtarget'); 
} 
});  
</script>

 

Před odevzdáním


Před odevzdáním banneru otestujeme ve všech aktuálních prohlížečích - minimálně v trojici Explorer (10+), Firefox, Chrome. Ideálně i v mobilních verzích prohlížečů.


Otestování chování banner ve standardních i mobilních prohlížečích je plně v režii výrobce/dodavatele kreativy.


Pomocné nástroje


Online konverze SWF do HTML5 - https://developers.google.com/swiffy/


Komprese PNG - https://tinypng.com/


WYSIWYG editor HTML5, CSS3 animací - http://html5maker.com/apphttps://www.google.com/webdesigner/


Základní úprava obrázku - http://www.irfanview.com/http://www.xnview.com/en/


Nástroje pro HTML5: http://html5maker.comhttp://www.webdesignerdepot.com/2012/04/15-great-html5-and-css3-generators/