31/08/2021

Como criar banners rotativos - Texto com movimento na horizontal

Como criar banners rotativos - Texto com movimento na horizontal
 
Como criar banners rotativos no blogger
Um código muito interessante é este para colocar banners movendo-se de um lado para outro em uma linha horizontal. Para isso nós utilizamos o fabuloso MARQUEE que tem esta propriedade.


Nem sempre temos espaço para colocar vários banners no blog e, com esse código podemos resolver a situação de uma forma simples.

Na verdade, Marquee também funciona com textos. Você escreve uma palavra ou frase que irá se movimentar de um lado para outro. Vamos mostrar primeiro como funciona com textos.

Esse código é muito bom para levar uma mensagem ao visitante. O texto fica andando na horizontal em apenas uma linha, por isso não ocupa muito espaço.

Para coloca-lo em seu blog é só copiar o código abaixo e colar em um gadget html(java) do blogger ou no editor de postagens, na área html.

Veja como fica.

Muito obrigado por entrar nesse blog! Não deixe de comentar!

Aqui está o código. É só copiar.

-----------------------------------------------------------------
<marquee scrolldelay="91" scrollamount="7">Muito obrigado por entrar nesse blog! Não deixe de comentar!</marquee>
-----------------------------------------------------------------

Mude o texto substituindo a parte vermelho.

Lembre-se de colocar o código em um gadget que ocupe toda a medida do blog para que o efeito
Fique bem legal.

Como criar banners rotativos no blogger


Agora vamos mostrar como funciona com banners.

Veja um exemplo de como deverá ficar o gadget abaixo. Aqui ele está estático mas o código gera um movimento da direita para a esquerda.



Para inserir este código em seu blog siga as instruções abaixo:

1---Prepare os banners que serão colocados que deverão ter o mesmo tamanho. O ideal são os banners 120 X 60.

2---Copie o código abaixo e cole em seu gadget html - java, colocando-o em uma posição de destaque no blog.

-------------------------------------------------
<marquee onmouseover="javascript:this.stop()"
onmouseout="javascript:this.start()" scrolldelay="33" bgcolor="#000000"
width="100%"><a href="ENDEREÇO DO SITE 1"><img src="ENDEREÇO DA IMAGEM SITE 1"/></a><a href="ENDEREÇO DO SITE 2"><img src="ENDEREÇO DA IMAGEM SITE 2"/></a></marquee>
------------------------------------------------

3---Na área "ENDEREÇO DO SITE 1 E ENDEREÇO DO SITE 2" coloque os respectivos endereços. Na área "ENDEREÇO DA IMAGEM DO SITE 1 E 2" coloque o endereço das imagens dos banner.

Para colocar mais banner basta repetir a operação com outros banners.

Um detalhe importante que deve ser colocado é que, enquanto os banners se movimentam, basta passar o mouse por cima de um deles para que o movimento pare e você possa clicar na imagem para ser direcionado ao endereço respectivo.

Este efeito é criado pelo comando "onmouseover".

Espero que gostem do código e até a próxima...

Há! Já ia me esquecendo! Faça um comentário!

Walter Matheus é um profissional de Marketing e tem sido associado a várias publicações online, incluindo este blog,

Ele também tem um vasto programa de treinamento para pessoas interessadas em adquirir conhecimentos profundos sobre o assunto tratado aqui. Você pode verificar na página localizada em: JORNADA DO AFILIADO.

Um comentário:

Faça comentários somente sobre o assunto do Post.
Não use palavras impróprias.

Veja também