Ora navigando per il Web ho trovato parecchie soluzioni, le ho tutte testate, ma la maggior parte su blogger non funzionano.
Questa che vi propongo fà al caso nostro e funziona!
E' molto semplice, il codice da inserire è poco e si possono aggiungere parecchie immagini con i rispettivi Link.
Il motivo per cui diventa molto utile un Banner con la rotazione è che un possessore di un Blog vorrebbe far visualizzare un sacco di immagini ma lo spazio del layout è risicato, soprattutto se il Blog in questione dà molta importanza al reparto grafico! Per esempio un Blog che parla di Giochi, Musica o Film.
Ora vediamo come procedere:
Andate in "Modello", poi "Modifica HTML", cercate <body> e sostituitelo con <body onload='setTimeout('ruota()', 10000)'> poi salvate.
Antate ora in "Layout", cliccate su "Aggiungi un gadget" e scegliete "HTML/JavaScript". Incollate nello spazio apposito il seguente codice:
<script language="javascript">
<!--
var cur = 0;
var img = new Array;
var coll = new Array();
img[0] = new Image();
img[0].src = "http://latuaImmagine1.jpg";
coll[0] = "http://www.iltuoLink1.it";
img[1] = new Image();
img[1].src = "http://latuaImmagine2.jpg";
coll[1] = "http://iltuoLink2.it";
function ruota()
{
cur++;
if (cur >= img.length)
cur = 0;
document.images["banner"].src = img[cur].src;
setTimeout("ruota()", 10000);
}
function click()
{
window.open(coll[cur]);
}
-->
</script>
<a href='javascript:click()'>
<img alt='Sponsor' border='0' height='60' name='banner' src='http://latuaImmagine1.jpg' width='468'/>
</a>
Potete aggiungere più immagini inserendo porzioni di codice come questo sotto, che comprende sia l'URL dell'immagine che l'URL del Link:
img[2] = new Image();
img[2].src = "http://latuaImmagine3.jpg";
coll[2] = "http://iltuoLink3.it";
height='60' e width='468' determinano le dimensioni del banner che volete inserire, ovvio che le immagini che compongono il banner devo essere grandi uguali.
setTimeout("ruota()", 10000); Determina il tempo tra un'immagine ed un'altra! 10000 è uguale a 10 secondi.
Un ultimo appunto, per hostare le immagini potete usare Picasa o Dropbox, è un programma veramente utile!
Fonte del codice: Sviluppo Software e Dintorni
Spero di esservi stata d'aiuto!
Se ti è piaciuto l'articolo, iscriviti al feed per tenerti sempre aggiornato sui nuovi contenuti del blog! Per maggiori informazioni sui feed, clicca qui! |
1 commenti:
ruoto!
Posta un commento
Scrivi le tue opinioni!