Como rotacionar banners no seu blog

Rotacionando banners

Uma maneira bem legal para reduzir espaços do seu blog é rotacionando a exibição de imagens ou banners. Assim, quando o leitor abrir ou atualizar uma página do blog, será exibido aleatoriamente um banner diferente a cada vez…

Desta forma, além de reduzir espaços e deixar o visual do seu blog mais limpo, o banner rotativo pode dar também um aspecto de mudança ou novidade, pois algo sempre estará diferente…

Para publicidade o banner rotativo é ótimo, pois você poderá focar um lugar privilegiado no blog para vários anunciantes, e todos terão as mesmas chances de aparecer.

Código JavaScript

Para inserir no blog, copie o código abaixo…

<script language="JavaScript">

var how_many_ads = 2;

var now = new Date()

var sec = now.getSeconds()

var ad = sec % how_many_ads;

ad +=1;

if (ad==1) {

txt="";

url="link para redirecionar quando o banner for clicado";

alt="texto quando passar o mouse sobre o banner";

banner="url da imagem que deve estar hospeda";

width="largura do banner em px";

height="altura do banner em px";

}

if (ad==2) {

txt="";

url="link para redirecionar quando o banner for clicado";

alt="texto quando passar o mouse sobre o banner";

banner="url da imagem que deve estar hospeda";

width="largura do banner em px";

height="altura do banner em px";

}

document.write('<center>');

document.write('<a href=\"' + url + '\" target=\"_blank\">');

document.write('<img src=\"' + banner + '\" width=')

document.write(width + ' height=' + height + ' ');

document.write('alt=\"' + alt + '\" border=0><br>');

document.write('<small>' + txt + '</small></a>');

document.write('</center>');

// End -->

</script>

Agora cole no seu blog e substitua o que aparece em vermelho, sendo:

1) url = link para redirecionar quando o banner for clicado

Exemplo: url = “http://visualdicas.blogspot.com.br”;

2) alt = texto alternativo para aparecer quando passar o mouse sobre o banner

Exemplo: alt = “Visual Dicas – a sua fonte de informação!”;

3) banner = url da imagem hospedada em algum site (Para hospedar imagens gratuitamente, leia Como hospedar imagens e gif animados gratuitamente)

Exemplo: banner = “http://visualdicas.com.br/images/stories/logovisualmusicas.gif”;

4) width = largura do banner em px (Exemplo: widht = 300”;)

5) height = altura do banner em px (Exemplo: height = 250”;)

6) txt = texto para legenda da imagem. Se não desejar legenda, mantenha txt=””;

Para acrescentar o código em um gadget do Blogger, leia: Como instalar um Widget no seu Blog -(Blogger)

Para acrescentar o código em um widget do Wordpress, leia: Como inserir Widgets no Wordpress sem a instalação de plugins

Acrescentando mais banners

Altere a linha abaixo, que aparece no início do script. Substitua o valor de X com o número de banners que você irá utilizar no script..

var how_many_ads = X;

Acrescente o código abaixo após a chave “}” no final do último banner inserido. Não esqueça de mudar o número que aparece depois de ad== , que deverá ser incrementado a cada novo banner inserido, ou seja: o primeiro é (add==1), o segundo (ad==2) o terceiro (ad==3) e assim sucessivamente.

if (ad==3) {

txt="";

url="link para redirecionar quando o banner for clicado";

alt="texto quando passar o mouse sobre o banner";

banner="url da imagem que deve estar hospeda";

width="largura do banner em px";

height="altura do banner em px";

}

Para testarmos o script, coloquei um banner rotativo do nosso patrocinador na lateral do nosso blog. Atualize a página (tecle [F5]) algumas vezes e observe que o banner mudará aleatoriamente a cada vez que você visualizar a página…

ou

byALF 

Fonte: Ganhar dinheiro web