Come cambiare un banner pubblicitario ad ogni refresh con javascript

Nell’articolo di oggi vediamo come cambiare un banner pubblicitario ad ogni refresh della pagina con javascript, utile per i nostri advertising e per dare un senso di “novità” ad ogni accesso.

Come tutti ormai ben saprete la pubblicità è diventata la vera anima del business sul web. Con l’aumento esponenziale di advertising i designer e developer sono sempre alla ricerca di nuovi modi per rendere gli adv sempre meno “invasivi” cercando di sacrificare al minimo l’usabilità del proprio sito. Molte testate o grossi portali di settore (non facciamo nomi..) tuttavia hanno dimenticato un concetto molto significativo: è giusto guadagnare ma siete davvero sicuri di sacrificare così tanto l’usabilità del vostro sito? Nell’articolo di oggi voglio proporvi una soluzione alternativa, per far ruotare due (o più) banner ad ogni refresh.

Demo

Creazione del plugin trgAdRotator()

Fatta questa doverosa premessa, vediamo come fare “ruotare” due banner pubblicitari ad ogni refresh della pagina.

Struttura Html

<script>
adRotator();
</script>

Motore Javascript

Ecco la funzione adRotator:

a) Selezionare l’adv da visualizzare a partire da una lista

b) Comporre l’html dell’adv che apparirà nel punto esatto in cui andrete a posizionare la funzione di richiamo adRotator() (Vedi paragrafo “struttura html”).

function adRotator(){

var n_ads =  2;
var now = new Date();
var sec = now.getSeconds();
var ad = sec % n_ads
ad+=1;

if(ad == 1){

var url = "#link";
var alt = "Alt";
var banner = "banner1.jpg";
var width = "728";
var height = "90";

} else if(ad == 2) {

var url = "#link2";
var alt = "Alt2";
var banner = "banner2.jpg";
var width = "728";
var height = "90";

} else {

var url = "#link";
var alt = "Alt";
var banner = "banner1.jpg";
var width = "728";
var height = "90";

}//Else AD

//Creo il banner con link all'interno dell'html dove viene richiamata la funzione
document.write('<a href=\"' +url+ '\" target=\"_blank\">');
document.write('<img src=\"'+banner+'\" width=\"');
document.write(width+'\" height=\"'+height+'\"');
document.write('alt=\"'+alt+'\" border=0></a>');

}//AdRotator

Demo e Download

Demo


Targetweb ti è utile? Offrimi un Caffè e sostieni questo progetto!

Non vuoi donare niente? 🙁 Scarica comunque condividendo questo articolo sui tuoi social preferiti:

Per scaricare il file completo devi condividere l'articolo su un social network.


Questo articolo ti è stato utile? Fammi sapere cosa ne pensi nei commenti !

Lascia la tua opinione

×