Inserire immagini random come annunci pubblicitari nella sidebar

Nella maggior parte dei blog che ospitano annunci pubblicitari vi sarà capitato di vedere i banner che cambiano ad ogni aggiornamento di pagina. Ti sei mai chiesto come mostrare banner pubblicitari casuali in Blogger?

Nel tutorial di oggi ti spiegherò come creare un Banner Random Widget per Blogger che mostrerà i banner pubblicitari in sequanza casuale quando un visitatore visita una nuova pagina sul tuo blog.

Questo widget è possibile aggiungerlo in qualsiasi posizione all'interno del tuo bloge il risultato sarà simile a quello in questa immagine



Come installarla:

1- Vai su Design --> Elementi pagina

2- Aggiungi un elemento HTML/Javascript

3- Incolla il codice che trovi qui sotto
<div align="center">
    <table border="0"  cellpadding="2" cellspacing="6" width="265" bgcolor="#ffffff">
    <tbody><tr>
    <td><center>

    <!--  BANNER#1  -->

    <script language="JavaScript">
    images = new Array(2);

    images[0] = "<a href = 'URL OF ADVERTISER' rel='nofollow' ><img src='URL OF BANNER’S IMAGE-1' border='0' height='125' width='125' alt='AD DESCRIPTION'></a>";

    images[1] = "<a href = 'URL OF ADVERTISER' rel='nofollow' ><img src='URL OF BANNER’S IMAGE-2' border='0' height='125' width='125' alt='AD DESCRIPTION'></a>";

    index = Math.floor(Math.random() * images.length);
    document.write(images[index]);
    </script>

    </center></td>

    <td><center>

    <!--  BANNER#2  -->

    <script language="JavaScript">
    images = new Array(2);

    images[0] = "<a href = 'URL OF ADVERTISER' rel='nofollow' ><img src='URL OF BANNER’S IMAGE-1' border='0' height='125' width='125' alt='AD DESCRIPTION'></a>";

    images[1] = "<a href = 'URL OF ADVERTISER' rel='nofollow' ><img src='URL OF BANNER’S IMAGE-2' border='0' height='125' width='125' alt='AD DESCRIPTION'></a>";

    index = Math.floor(Math.random() * images.length);
    document.write(images[index]);
    </script>

    </center></td>
    </tr>
    <tr>

    <td><center>

    <!--  BANNER#3  -->

    <script language="JavaScript">
    images = new Array(2);

    images[0] = "<a href = 'URL OF ADVERTISER' rel='nofollow' ><img src='URL OF BANNER’S IMAGE-1' border='0' height='125' width='125' alt='AD DESCRIPTION'></a>";

    images[1] = "<a href = 'URL OF ADVERTISER' rel='nofollow' ><img src='URL OF BANNER’S IMAGE-2' border='0' height='125' width='125' alt='AD DESCRIPTION'></a>";

    index = Math.floor(Math.random() * images.length);
    document.write(images[index]);
    </script>

    </center></td>

    <td><center>

    <!--  BANNER#4  -->

    <script language="JavaScript">
    images = new Array(2);

    images[0] = "<a href = 'URL OF ADVERTISER' rel='nofollow' ><img src='URL OF BANNER’S IMAGE-1' border='0' height='125' width='125' alt='AD DESCRIPTION'></a>";

    images[1] = "<a href = 'URL OF ADVERTISER' rel='nofollow' ><img src='URL OF BANNER’S IMAGE-2' border='0' height='125' width='125' alt='AD DESCRIPTION'></a>";

    index = Math.floor(Math.random() * images.length);
    document.write(images[index]);
    </script>

    </td></center>

    </tr>

    </tbody></table>

    <table border="0" bordercolor="#0084ce" cellpadding="2" cellspacing="6" width="265" bgcolor="#ffffff">
    <tbody>
          <tr>
           <td><center><a href="URL OF ADVERTISER" rel="nofollow"><img width="265" height="37" border="0" alt="Advertise Now!" src="file:///C:/Documents%20and%20Settings/Mohammad/Desktop/ADVERTISE-HERE.gif" /></a></center></td>
          </tr>

        </tbody></table>

    </div>

4- Fai le seguenti modifiche:

URL OF ADVERTISER: sostituiscili con i link delle tue pubblicità

URL OF BANNER’S IMAGE-1: sostituiscili con i link delle immagini dei banner relativi alla pubblicità

AD DESCRIPTION: sostituisci con le parole che vuoi far apparire in caso l'immagine non venga visualizzata

width="265: modificala per cambiare la distanza tra gli annunci.

5- Salva

Altri articoli simili:



0 commenti: