terça-feira, 24 de setembro de 2013

Saber Blogger| Pôr um banner rotativo


Para aqueles que trabalham no blogger: como pôr um banner rotativo (com os parceiros por exemplo, ou com anúncios) 


1) Entre na sua conta Blogger (http://www.blogger.com/)
2) Seleccione o seu blog ou o blog em que pretende trabalhar
3) Vá a Esquema, ou Layout.
4) Clique em "Adicionar uma mini-aplicação (miniaplicação)" 
5) Encontre "HTML/Javascript" e clique no + .
6) Em título escreva Parcerias, Apoios, nada ou o que desejar.
7) Em "Conteúdo" ponha o seguinte:

<marquee direction="up" height="300" on="" onmouseout="this.start()" onmouseover="this.stop()" scrollamount="4" with="200">
<a href="LINK DO SITE PARCEIRO" target="_blank"><img border="10" src="LINK DA IMAGEM DO PARCEIRO" style="height: 90px; width: 200px;" /></a>

<a href="LINK DO SITE PARCEIRO" target="_blank"><img border="0" src="IMAGEM DO PARCEIRO" style="height: 90px; width: 200px;" /></a>

<a href="LINK DO SITE PARCEIRO" target="_blank"><img border="10" src="LINK DA IMAGEM DO PARCEIRO" style="height: 90px; width: 200px;" /></a>

<a href="LINK DO SITE PARCEIRO" target="_blank"><img border="0" src="IMAGEM DO PARCEIRO" style="height: 90px; width: 200px;" /></a>

</marquee></div>



Em:
Link do site do parceiro - cole o URL do site, página ou blog que pretende adicionar
Link da imagem do parceiro/imagem do parceiro - cole o URL da imagem que pretende adicionar.

Note que:

  • As imagens serão reduzidas/ampliadas a um tamanho de 90px de altura por 200px de largura, se desejar alterar este valor, mude os números a seguir a "height" para a altura, e "width" para a largura.
  • Se quiser adicionar mais links adicione o código abaixo com um parágrafo de distância dos outros ou de </marquee></div>:


<a href="LINK DO SITE PARCEIRO" target="_blank"><img border="0" src="IMAGEM DO PARCEIRO" style="height: 90px; width: 200px;" /></a>

  • Se quiser alterar a velocidade da demonstração aumente o número para ir mais rápido ou diminua para ir mais lento:  " scrollamount="4"
  • Se tencionar pôr a demonstração para baixo -escreva down - para a esquerda - left - para a direita - right - alterando a parte sublinhada: <marquee direction="up"



Demonstração:
No caso do Carpe Diem (as imagens apenas ficam com rebordo branco se forem postas numa mensagem):



























Sem comentários:

Enviar um comentário

Sem comentários:

Enviar um comentário