Widget de imagens com links deslizantes na horizontal
Devido à simplicidade do código este Widget é muito procurado mas nem sempre está adaptado para qualquer tipo de imagens com links.
Este widget corre na horizontal de seu blog da direita para esquerda e cada imagem contida terá um link para uma postagem, patrocinador e enfim o link da imagem poderá ir para onde quiser bastando liga-lo à imagem.
Widget By: Kbaus.COM
Como colocar e configurar o Widget em seu blog
O Widget pode ser colocado em qualquer lugar entre <body> e </body> em seu html, mas vamos ver como coloca-lo no Blogger.
1º – Abra o painel do blogger e clique no menu “Layout”.
2º – Clique em “Adicionar um Gadget” na parte que desejar que as imagens fiquem.
3º – Escolha a opção “HTML/JavaScript”.
4º – Copie o código abaixo e cole no campo da janela aberta.
<marquee behavior=”scroll” direction=”left” heigth=”480″ onmouseout=”this.start()” onmouseover=”this.stop()” scrollamount=”4″ widht=”480″>
<a href=”link do artigo da 1ª imagem“><img border=”0″ src=”LINK DA IMAGEM 1” /></a>
<a href=”link do artigo da 2ª imagem“><img border=”0″ src=”LINK DA IMAGEM 2” /></a>
<a href=”link do artigo da 3ª imagem“><img border=”0″ src=”LINK DA IMAGEM 3” /></a>
<a href=”link do artigo da 4ª imagem“><img border=”0″ src=”LINK DA IMAGEM 4” /></a>
<a href=”link do artigo da 5ª imagem“><img border=”0″ src=”LINK DA IMAGEM 5” /></a>
</marquee>
<center>Widget By: <a target=”_blank” href=”https://www.kbaus.com/”>www.Kbaus.COM</a></center>
5º – Agora basta substituir as partes em vermelho com os links correspondentes à imagem e link da imagem.
Alterando a largura e borda das imagens
O código interno das imagens pode ser alterado para que a imagem fique no tamanho desejado adicionando e alterando o seguinte trecho:
Width = LARGURA
Heigth = ALTURA
Border = LARGURA DA BORDA
Para adicionar, basta mudar os números em vermelho.
<a href=”link do artigo da 6ª imagem“><img width=”50“ heigth=”50“ border=”0“ src=”LINK DA IMAGEM 6” /></a>
Tendo feito as alterações acima, basta salvar o Widget e pronto.
Veja o Widget em funcionamento no blog da “Equipe Salmo 23 !”
Este artigo pertence ao Kbaus Tutoriais.
Plágio é crime e está previsto no artigo 184 do Código Penal.
Realmente este espaço em branco fica nítido, porém, a menos que usemos scripts não será possível eliminar estes espaços pois esta já é uma configuração padrão do Marques.
Boas.
Obrigado pela partilha.
Mas dá para eliminar os espaços em branco, ou seja, entre a última imagem e o começar de nova "volta" fica um espaço sem imagens… logo a seguir à última podia surgir a primeira de forma imediata..
Este comentário foi removido pelo autor.
Tem sim, basta adicionar uma linha de código para cada imagem:
< a href = ' ex etc ' > < src = etc link imagem 5 etc etc >
valeu pelo widget,
MILLER AMIGO TEM COMO COLOCAR MAIS DE 5 IMAGEM
ASSIM MEU BLOG E DE CAPAS DE FILMES EU QUERIA COLOCAR SO OS LANCAMENTOS QUERIA COLOCA UNS 10 CAPAS TEM COMO
Que bom que gostou Givanildo !
O prazer é nosso em te-lo como fan !
Abraço !
KRA VC TA DE PARABENS PROCUREI NA NET E NAO ACHEI UM DESSES IGUAL AO SEU SEMPRE ACHAVA PARA MEXE DENTRO DO MEU BLOG HTML…..
MAIS GOSTEI MESMO JA GANHOU UM FA KKKK
AGORA TEM COMO COLOCAR MAIS DE 5 IMAGEM
Olá Deusa !
Eu é que agradeço por acompanhar nosso trabalho !
Abraço !
Muitíssimo obrigada, Miller! 🙂
Vou tentar em meu blog de testes! rsrsrsrs…
Valeu mesmo!
Olá Deusa !
As imagens poderão conter links para qualquer conteúdo, mas caso haja necessidade de se exibir textos linkados também é possível.
Ainda não publiquei aqui no kbaus.com, mas utilizo no blog pessoal que estou fazendo, veja em "Miller-Alberto.Blogspot.com".
Basta substituir o código das imagem e fazer a inserção apenas do código do link:
< a href = " http : // www . seusite . com ">SEUSITE< /A >
Oi, Miller! Gostei muito do efeito, mas tem como usar também com links ao invés de imagens? Abraço!
solteiras-noivas-casadas.blogspot.com
♥
Excelente ideia de usar o código com banners de parceiros, realmente cai bem. Irei passar também um para links deslizantes sem imagens que também servirá para este e outros fins.
Pois é Herlan !
Eu entendo, os imprevístos estão sujeitos à todos, eu mesmo só estou lhe respondendo hoje e não publiquei nada ontem porque tive uns probleminhas familiares.
Essa é a Vida amigo !
Abraço
Olá Miller.
Muito bom o widget, ele é excelente para expor banners de parceiros. Muito útil este código.
Um grande abraço!
Ps: Estou voltando a ativa, fiquei um tempinho sem visitar seu blog porque meu pc queimou, mas agora sempre estarei presente aqui.
Olá Emerson !
Pelo geito parece problemas de inicialização com o Sistema operacional, tente formata-lo ( reseta-lo ), mas devo lembrar que até o que estiver no CHIP irá desaparecer.
Não mecho muito não com táblets e sistemas androide não, mas pelo que eu sei, parece ser este o problema. "Leve à um técinico" e peça um diagnostico.
Abraço !
Vc mexe com aparelhos android?
Meu galaxy Y youg
nao quer ligar
ele aparece a marca e reinicia
oque pode ser?