Los códigos AjaxV4 permiten la aplicación de funciones de estilos. En el siguiente articulo se detallan los pasos para implementarlos.
Las funciones Custom son un conjunto de variables de estilos aplicables a los códigos V4, los cuales están programados para que el usuario pueda activarlos y asignarle distintos valores según se requiera. Con estas variables es posible asignar múltiples atributos a los anuncios, tales como, bordes, colores, distribución de la información, tipografías, tamaños, imágenes de fondo, links, etc.
1. La función de Estilos se puede generar fácilmente ingresando a Inventario / Espacios / Previsualizador de Funciones Custom tal como muestra la imagen:
Una vez que se haya seleccionado el estilo y realizado la customización deseada, debe extraer el código correspondiente que insertará dentro del tag V4
2. Agregado de Función de Estilos al Código AjaxV4
AjaxV4 Múltiple (Sección)
La función se inserta antes del código de la siguiente manera:
| <script language='JavaScript' type='text/javascript'><!--
Función custom
// -->
</script>
Código Ajax
<script type='text/javascript'>llamada al espacio;</script>
|
Ejemplo de tag con Función Custom
| <script language='JavaScript' type='text/javascript'><!-- function eplCustomShow(adsArray) {
var r=''; pad=''; a1=false;
// Variables para personalizar:
var cols_per_row = 1;
var imgFloat = 'left';
var code_header = 'ANUNCIOS E-PLANNING';
var style_header = 'text-align:left;font-family:Arial, Helvetica, sans-serif;color:#000000;font-size:10px;font-weight:normal;background-color:#FFFFFF;';
var code_footer = '<a href='http://www.e-planning.net' style='font-family:Arial, Helvetica, sans-serif;color:#0D53B2;font-size:10px;font-weight:normal;text-decoration:none;' target='_blank'>Publica tu anuncio</a>';
var style_footer = 'text-align:right;background-color:#FFFFFF;';
var style_table = 'border:1px solid #CCCCCC;height:110px;width:180px;background-color:#DDDDDD;';
var style_cell = 'border:1px solid #AAAAAA;height:85px;width:167px;background-color:#FFFFFF;padding:0px;text-align:left;';
var style_title = 'font-family:Arial, Helvetica, sans-serif;color:#000000;font-size:11px;font-weight:bold;text-decoration:none;';
var style_desc = 'font-family:Arial, Helvetica, sans-serif;color:#000000;font-size:10px;font-weight:normal;text-decoration:none;';
var style_url = 'font-family:Arial, Helvetica, sans-serif;color:#000000;font-size:10px;font-weight:normal;text-decoration:none;';
var adsStretch = false;
var dirStretch = 2;
var image_small_wh = [ 67 , 67 ];
var image_large_wh = [ 100 , 100 ];
// fin variables personalizables
var coln = 0;
for (var i=0; i<adsArray.length; i++) {
var ad = adsArray[i];
if (!ad.shown && (1==ad.t||2==ad.t||7==ad.t||8==ad.t||41==ad.t) && !(7==ad.e||8==ad.e)) {
if (!a1) {
r+= '<table style=''+ style_table +''>';
if (code_header) r+= '<tr><th style=''+style_header+''>'+code_header+'</th></tr>';
r+= '<tr><td><table border='0'>';
a1 = true;
} else {
pad = 'padding-left:10px';
}
if (0===coln) {
r+= '<tr>';
coln++;
}
r+= '<td style=''+ style_cell +''>';
if (41==ad.t) { // link de texto
r+= '<a target='_blank' href=''+ ad.lU +'' style=''+ style_title +''>'+ ad.tit +'</a>';
if (ad.desc) r+= '<br/><span style=''+ style_desc +''>'+ ad.desc +'</span>';
if (ad.urlv) r+= '<br/><a target='_blank' href=''+ ad.lU +'' style=''+ style_url +''>'+ ad.urlv +'</a>';
} else if (!ad.e) { // flash o imagen sin efecto
r+= ad.getBaseTag();
} else { // imagen+texto
if (33!=ad.e) r+= '<a target='_blank' href=''+ ad.lU +'' style=''+ style_title +''>'+ ad.tit +'</a><br/>';
r+= '<div'+(imgFloat?' style='float:'+imgFloat+';':'')+' position:relative;'+(adsStretch?' width:'+image_small_wh[0]+'px; height:'+image_small_wh[1]+'px;'':'')+''>';
r+= '<div'+(adsStretch?' style='position:absolute;'':'')+'>';
r+= '<a target='_blank' href=''+ ad.lU +''>';
r+= '<img src=''+ ad.getURL() +'' border=0 style='width:'+image_small_wh[0]+'px; height:'+image_small_wh[1]+'px;' '+(adsStretch?'onmouseover='javascript:eplCustomStretch(this,'+image_large_wh[0]+','+image_large_wh [1]+','+dirStretch+')' onmouseout='javascript:eplCustomStretch(this,'+image_small_wh[0]+','+image_small_wh[1]+','+dirStretch+') '':'')+' />';
r+= '</a></div></div>';
if (34==ad.e || 35==ad.e) r+= '<br/>';
r+= '<span style=''+ style_desc +''>'+ ad.desc +'</span>';
if (ad.urlv) r+= '<br/><a target='_blank' href=''+ ad.lU +'' style=''+ style_url +''>'+ ad.urlv +'</a>';
}
r+= '</td>';
if (coln >= cols_per_row) {
r+='</tr>'; coln=0;
} else {
coln++;
}
ad.shown = true;
}
}
if (a1) {
if (0!==coln) {
while (coln <= cols_per_row) {
r+= '<td style='display:none;'></td>';
coln++;
}
r+= '</tr>';
}
r+= '</table></td></tr>';
if (code_footer) r+= '<tr><th style=''+style_footer+''>'+code_footer+'</th></tr>';
r+= '</table>';
}
return r;
}
function eplCustomStretch(obj,w,h,dir) {
obj.style.width = obj.parentNode.parentNode.style.width = w+'px';
obj.style.height = obj.parentNode.parentNode.style.height = h+'px';
var bW = parseInt(obj.parentNode.parentNode.parentNode.style.width,10);
var bH = parseInt(obj.parentNode.parentNode.parentNode.style.height,10);
if (dir == 0) { obj.parentNode.parentNode.parentNode.style.top = (bH-h)+'px'; obj.parentNode.parentNode.parentNode.style.left = 0+'px'; }
if (dir == 1) { obj.parentNode.parentNode.parentNode.style.top = (bH-h)+'px'; obj.parentNode.parentNode.parentNode.style.right = (w-bW)+'px'; }
if (dir == 2) { obj.parentNode.parentNode.parentNode.style.top = 0+'px'; obj.parentNode.parentNode.parentNode.style.left = 0+'px'; }
if (dir == 3) { obj.parentNode.parentNode.parentNode.style.top = 0+'px'; obj.parentNode.parentNode.parentNode.style.right = (w-bW)+'px'; }
if (dir == 4) { obj.parentNode.parentNode.parentNode.style.top = ((bH-h)/2)+'px'; obj.parentNode.parentNode.parentNode.style.left = ((bW-w)/2)+'px'; }
} // -->
</script> <script language='JavaScript' type='text/javascript'><!--
var eplDoc = document; var eplLL = false;
var eS1 = 'us.img.e-planning.net';var eplArgs = { iIF:1,sV:'http://ads.eu.e-planning.net/',vV:'4',sI:'455',sec:'Deportes',eIs:['Header'] };
function eplCheckStart() {
if (document.epl) {
var e = document.epl;
if (e.eplReady()) {
return true;
} else {
e.eplInit(eplArgs);
if (eplArgs.custom) {
for (var s in eplArgs.custom) {
document.epl.setCustomAdShow(s, eplArgs.custom[s]);
}
}
return e.eplReady();
}
} else {
if (eplLL) return false;
if (!document.body) return false; var eS2; var dc = document.cookie; var ci = dc.indexOf('EPLSERVER=');
if (ci != -1) {
ci += 10; var ce = dc.indexOf(';', ci);
if (ce == -1) ce = dc.length;
eS2 = dc.substring(ci, ce);
}
var eIF = document.createElement('IFRAME');
eIF.src = 'about:blank'; eIF.id = 'epl4iframe'; eIF.name = 'epl4iframe';
eIF.width=0; eIF.height=0; eIF.style.width='0px'; eIF.style.height='0px';
eIF.style.display='none'; document.body.appendChild(eIF);
var eIFD = eIF.contentDocument ? eIF.contentDocument : eIF.document;
eIFD.open();eIFD.write('<html><head><title>e-planning</title></head><bo'+'dy></bo'+'dy></html>');eIFD.close();
var s = eIFD.createElement('SCRIPT'); s.src = 'http://' + (eS2?eS2:eS1) +'/layers/epl-41.js';
eIFD.body.appendChild(s);
if (!eS2) {
var ss = eIFD.createElement('SCRIPT');
ss.src = 'http://ads.eu.e-planning.net/egc/4/b';
eIFD.body.appendChild(ss);
}
eplLL = true;
return false;
}
}
eplCheckStart();
function eplSetAdM(eID,custF) {
if (eplCheckStart()) {
if (custF) { document.epl.setCustomAdShow(eID,eplArgs.custom[eID]); }
document.epl.showSpace(eID);
} else {
var efu = 'eplSetAdM(''+eID+'', '+ (custF?'true':'false') +');';
setTimeout(efu, 250);
}
}
function eplAD4M(eID,custF) {
document.write('<div id='eplAdDiv'+eID+''></div>');
if (custF) {
if (!eplArgs.custom) { eplArgs.custom = {}; }
eplArgs.custom[eID] = custF;
}
eplSetAdM(eID, custF?true:false);
}
function eplSetAd(eID) {
if (eplCheckStart()) {
var opts = (eplArgs.sOpts && eplArgs.sOpts[eID]) ? eplArgs.sOpts[eID] : {};
if (opts.custF) { document.epl.setCustomAdShow(eID,opts.custF); }
document.epl.setSpace(eID, opts);
} else {
setTimeout('eplSetAd(''+eID+'');', 250);
}
}
function eplAD4(eID, opts) {
document.write('<div id='eplAdDiv'+eID+''></div>');
if (!opts) opts = {t:1};
if (!eplArgs.sOpts) { eplArgs.sOpts = {}; }
eplArgs.sOpts[eID] = opts;
eplSetAd(eID);
}
//--></script>
|
Indicar en la llamada al espacio después del nombre del espacio, la función de estilos correspondiente.
Se pueden seleccionar uno, algunos o todos los espacios de la página al que se aplicarán los estilos.
<script type='text/javascript'>eplAD4M('Header',eplCustomShow);</script>
Más de un anuncio por espacio
Agregar la cantidad máxima de anuncios, al lado de cada espacio, según corresponda.
Ejemplo: 3 Anuncios
<script language='JavaScript' type='text/javascript'><!--
var eplDoc = document; var eplLL = false;
var eS1 = 'us.img.e-planning.net';var eplArgs = { iIF:1,sV:'http://ads.eu.e-planning.net/',vV:'4',sI:'455',sec:'Deportes',eIs:['Header:3'] };
function eplCheckStart() { |
Resultado:
AjaxV4 Espacio
Si se implementa la Función Custom en un Ajax V4 de Espacio, la implementación es la siguiente:
| <script language='JavaScript' type='text/javascript'><!--
Función custom
// -->
</script>
Código Ajax de espacio
|
Quedaría de la siguiente manera:
| <script language='JavaScript' type='text/javascript'><!-- function eplCustomShow(adsArray) {
var r=''; pad=''; a1=false;
// Variables para personalizar:
var cols_per_row = 1;
var imgFloat = 'left';
var code_header = 'ANUNCIOS E-PLANNING';
var style_header = 'text-align:left;font-family:Arial, Helvetica, sans-serif;color:#000000;font-size:10px;font-weight:normal;background-color:#FFFFFF;';
var code_footer = '<a href='http://www.e-planning.net' style='font-family:Arial, Helvetica, sans-serif;color:#0D53B2;font-size:10px;font-weight:normal;text-decoration:none;' target='_blank'>Publica tu anuncio</a>';
var style_footer = 'text-align:right;background-color:#FFFFFF;';
var style_table = 'border:1px solid #CCCCCC;height:110px;width:180px;background-color:#DDDDDD;';
var style_cell = 'border:1px solid #AAAAAA;height:85px;width:167px;background-color:#FFFFFF;padding:0px;text-align:left;';
var style_title = 'font-family:Arial, Helvetica, sans-serif;color:#000000;font-size:11px;font-weight:bold;text-decoration:none;';
var style_desc = 'font-family:Arial, Helvetica, sans-serif;color:#000000;font-size:10px;font-weight:normal;text-decoration:none;';
var style_url = 'font-family:Arial, Helvetica, sans-serif;color:#000000;font-size:10px;font-weight:normal;text-decoration:none;';
var adsStretch = false;
var dirStretch = 2;
var image_small_wh = [ 67 , 67 ];
var image_large_wh = [ 100 , 100 ];
// fin variables personalizables
var coln = 0;
for (var i=0; i<adsArray.length; i++) {
var ad = adsArray[i];
if (!ad.shown && (1==ad.t||2==ad.t||7==ad.t||8==ad.t||41==ad.t) && !(7==ad.e||8==ad.e)) {
if (!a1) {
r+= '<table style=''+ style_table +''>';
if (code_header) r+= '<tr><th style=''+style_header+''>'+code_header+'</th></tr>';
r+= '<tr><td><table border='0'>';
a1 = true;
} else {
pad = 'padding-left:10px';
}
if (0===coln) {
r+= '<tr>';
coln++;
}
r+= '<td style=''+ style_cell +''>';
if (41==ad.t) { // link de texto
r+= '<a target='_blank' href=''+ ad.lU +'' style=''+ style_title +''>'+ ad.tit +'</a>';
if (ad.desc) r+= '<br/><span style=''+ style_desc +''>'+ ad.desc +'</span>';
if (ad.urlv) r+= '<br/><a target='_blank' href=''+ ad.lU +'' style=''+ style_url +''>'+ ad.urlv +'</a>';
} else if (!ad.e) { // flash o imagen sin efecto
r+= ad.getBaseTag();
} else { // imagen+texto
if (33!=ad.e) r+= '<a target='_blank' href=''+ ad.lU +'' style=''+ style_title +''>'+ ad.tit +'</a><br/>';
r+= '<div'+(imgFloat?' style='float:'+imgFloat+';':'')+' position:relative;'+(adsStretch?' width:'+image_small_wh[0]+'px; height:'+image_small_wh[1]+'px;'':'')+''>';
r+= '<div'+(adsStretch?' style='position:absolute;'':'')+'>';
r+= '<a target='_blank' href=''+ ad.lU +''>';
r+= '<img src=''+ ad.getURL() +'' border=0 style='width:'+image_small_wh[0]+'px; height:'+image_small_wh[1]+'px;' '+(adsStretch?'onmouseover='javascript:eplCustomStretch(this,'+image_large_wh[0]+','+image_large_wh [1]+','+dirStretch+')' onmouseout='javascript:eplCustomStretch(this,'+image_small_wh[0]+','+image_small_wh[1]+','+dirStretch+') '':'')+' />';
r+= '</a></div></div>';
if (34==ad.e || 35==ad.e) r+= '<br/>';
r+= '<span style=''+ style_desc +''>'+ ad.desc +'</span>';
if (ad.urlv) r+= '<br/><a target='_blank' href=''+ ad.lU +'' style=''+ style_url +''>'+ ad.urlv +'</a>';
}
r+= '</td>';
if (coln >= cols_per_row) {
r+='</tr>'; coln=0;
} else {
coln++;
}
ad.shown = true;
}
}
if (a1) {
if (0!==coln) {
while (coln <= cols_per_row) {
r+= '<td style='display:none;'></td>';
coln++;
}
r+= '</tr>';
}
r+= '</table></td></tr>';
if (code_footer) r+= '<tr><th style=''+style_footer+''>'+code_footer+'</th></tr>';
r+= '</table>';
}
return r;
}
function eplCustomStretch(obj,w,h,dir) {
obj.style.width = obj.parentNode.parentNode.style.width = w+'px';
obj.style.height = obj.parentNode.parentNode.style.height = h+'px';
var bW = parseInt(obj.parentNode.parentNode.parentNode.style.width,10);
var bH = parseInt(obj.parentNode.parentNode.parentNode.style.height,10);
if (dir == 0) { obj.parentNode.parentNode.parentNode.style.top = (bH-h)+'px'; obj.parentNode.parentNode.parentNode.style.left = 0+'px'; }
if (dir == 1) { obj.parentNode.parentNode.parentNode.style.top = (bH-h)+'px'; obj.parentNode.parentNode.parentNode.style.right = (w-bW)+'px'; }
if (dir == 2) { obj.parentNode.parentNode.parentNode.style.top = 0+'px'; obj.parentNode.parentNode.parentNode.style.left = 0+'px'; }
if (dir == 3) { obj.parentNode.parentNode.parentNode.style.top = 0+'px'; obj.parentNode.parentNode.parentNode.style.right = (w-bW)+'px'; }
if (dir == 4) { obj.parentNode.parentNode.parentNode.style.top = ((bH-h)/2)+'px'; obj.parentNode.parentNode.parentNode.style.left = ((bW-w)/2)+'px'; }
} // -->
</script> <!-- e-planning v4 - Comienzo espacio Header _ home _ blogmundial -->
<script language='JavaScript' type='text/javascript'><!--
var eplDoc = document; var eplLL = false;
var eS1 = 'us.img.e-planning.net';var eplArgs = { iIF:1,sV:'http://ads.e-planning.net/',vV:'4',sI:'8fa2',kVs:{}};
function eplCheckStart() {
if (document.epl) {
var e = document.epl;
if (e.eplReady()) {
return true;
} else {
e.eplInit(eplArgs);
if (eplArgs.custom) {
for (var s in eplArgs.custom) {
document.epl.setCustomAdShow(s, eplArgs.custom[s]);
}
}
return e.eplReady();
}
} else {
if (eplLL) return false;
if (!document.body) return false; var eS2; var dc = document.cookie; var ci = dc.indexOf('EPLSERVER=');
if (ci != -1) {
ci += 10; var ce = dc.indexOf(';', ci);
if (ce == -1) ce = dc.length;
eS2 = dc.substring(ci, ce);
}
var eIF = document.createElement('IFRAME');
eIF.src = 'about:blank'; eIF.id = 'epl4iframe'; eIF.name = 'epl4iframe';
eIF.width=0; eIF.height=0; eIF.style.width='0px'; eIF.style.height='0px';
eIF.style.display='none'; document.body.appendChild(eIF);
var eIFD = eIF.contentDocument ? eIF.contentDocument : eIF.document;
eIFD.open();eIFD.write('<html><head><title>e-planning</title></head><bo'+'dy></bo'+'dy></html>');eIFD.close();
var s = eIFD.createElement('SCRIPT'); s.src = 'http://' + (eS2?eS2:eS1) +'/layers/epl-41.js';
eIFD.body.appendChild(s);
if (!eS2) {
var ss = eIFD.createElement('SCRIPT');
ss.src = 'http://ads.e-planning.net/egc/4/40a4';
eIFD.body.appendChild(ss);
}
eplLL = true;
return false;
}
}
eplCheckStart();
function eplSetAd(eID) {
if (eplCheckStart()) {
var opts = (eplArgs.sOpts && eplArgs.sOpts[eID]) ? eplArgs.sOpts[eID] : {};
if (opts.custF) { document.epl.setCustomAdShow(eID,opts.custF); }
document.epl.setSpace(eID, opts);
} else {
setTimeout('eplSetAd(''+eID+'');', 250);
}
}
function eplAD4(eID, opts) {
document.write('<div id='eplAdDiv'+eID+''></div>');
if (!opts) opts = {t:1};
if (!eplArgs.sOpts) { eplArgs.sOpts = {}; }
eplArgs.sOpts[eID] = opts;
eplSetAd(eID);
}
//--></script>
<script>eplAD4('c1ba1469f7b01a17',{t:1,timeout:0,ma:1,custF:eplCustomShow,sd:'8fa2!!http://ads.e-planning.net/!!'});</script>
<!-- e-planning v4 - Fin espacio Header _ home _ blogmundial-->
|
Si se quiere mostrar más de un anuncio en el espacio, indicar la cantidad en el parámetro: ma (o ya setear la cantidad deseada a la hora de extraer el tag desde el sistema)
<script>eplAD4('c1ba1469f7b01a17',{t:1,timeout:0,ma:3,custF:eplCustomShow,sd:'8fa2!!http://ads.e-planning.net/!!'});</script>
Si tiene dudas sobre como extraer códigos Ajax V4 en la interfaz, consultar el documento 'Cómo extraer los códigos Ajax V4 (de espacio y de sección)'
| Importante! No se puede aplicar Estilos a espacios que tengan asociados Tags de otro Adserver. Si se detecta un tag, no se mostrará el anuncio y aparecerá un error de consola: 
|