CPT - Centro de Produções Técnicas

Banner aleatório / rotativo para blog


Se você trabalha com programas de afiliados, gosta de usar aqueles banners que as lojas disponibilizam para divulgar os produtos, essa é uma ótima opção para poder divulgar vários banners, sem ocupar tanto as laterais do seu blog.


É simples, é só usar este script:

<script type="text/javascript">
var imagens = [],
index = 0;
imagens[0] = "<a href = 'link 1'><img src='Banner 1' alt=''></a>";
imagens[1] = "<a href = 'link 2'><img src='banner 2' alt=''></a>";
imagens[2] = "<a href = 'link 3'><img src='banner 3' alt=''></a>";
imagens[3] = "<a href = 'link 4'><img src='banner 4' alt=''></a>";
index = Math.floor(Math.random() * imagens.length);
document.write(imagens[index]);
</script> 

Coloque o script primeiro, em um bloco de notas para fazer as modificações.

Link: Digite o link de destino.

Banner: NÃO é possível colocar os códigos prontos dos banners da loja, você terá que criar o seu. Faça o upload dos seus banners (usando o Tinypic ou Imageshack, por exemplo). Copie e cole o link da imagem.
Dica: É aconselhável utilizar banners com as mesmas dimensões.

Alt: Você poderá alterar o campo “Alt” das suas imagens, adicionando um texto alternativo, caso o carregamento do seu banner falhe.

Depois vá em layout, adicionar gadget, HTML/Javascript e cole o código.

Se não souber criar banners, procure imagens do produto, para alguns são criados imagens de divulgação, como de perfumes, por exemplo.

Use o Photoshop ou um outro editor de imagens e apenas modifique o tamanho da imagem, deixe todas no mesmo tamanho para garantir que o script irá funcionar, mas se quiser tentar usar formatos de imagem diferentes, faça o teste.