Como criar banner Aleatório / Rotativo

Por | Atualizado em 2014-01-16

Se deseja criar um banner aleatório / rotativo que modifica sempre que alguém recarrega a sua página, execute os seguintes procedimentos:

Criar banner aleatório / rotativo

Para gerar um banner aleatório será necessário utilizar um script. Se você ainda não possui os banners, poderá consultar o nosso artigo: Como criar um Banner (animado e estático).

Dica: É aconselhável utilizar banners com as mesmas dimensões.

Agora, copie o seguinte script para um editor de texto (por exemplo, o Word):

<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>

Proceda às seguintes alterações:


Link: Digite o link de destino.

Banner: Digite o link direto da sua imagem. Faça o upload dos seus banners (usando o Tinypic ou Imageshack, por exemplo).

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

Por fim, instale a script no seu blog ou site. Por exemplo, se deseja instalar o seu banner aleatório na barra lateral do seu Blogger, basta aceder ao Menu “Esquema” – Adicionar uma miniaplicação – HTML/Javascript e colar a sua script.

Como criar banner Aleatório / Rotativo

Deixe uma resposta

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *