quinta-feira, 6 de setembro de 2012

Coloque widget voltar ao topo flutuante do blog

Galera, sabe aqueles templates legais que tem um botão para o usuário voltar ao topo do blog que fica flutuando quando mexemos na barra de rolagem? Vários novatos já me pediram para disponibilizar um tutorial ensinado a colocar este recurso no blog, então hoje trago duas coisas, um widget hack que insere isto automaticamente, só copiar e colar e um tutorial completo para você montar o seu com suas próprias imagens. Vamos lá!

Primeiro o widget altomático Flutuante!
1 - Selecione e copie todo o código do widget:

<a style="display:scroll;position:fixed;bottom:72px;right:50px;" href="#" title="VOLTAR AO TOPO (do blog DicaDeDica)"><img src="http://lh4.ggpht.com/_eZ4RDyPwpoA/SagWzGVD6mI/AAAAAAAAAw4/LivJ__3Qot0/s144/TOPO_FLUTUANTE_DICADEDICA.png"/></a> <a href=""> <span >Voltar ao topo flutuante Dicadedica</span></a> </span>

2 - No painel de controle do Blogger (Blogspot) acesse:

Layout
Adicionar um widget
HTML/JavaScript

3 - Cole o código e salve o widget

Pronto seu widget estará configurado da forma automática.
(Funciona nos templates do novo blogger)

Agora o tutorial extensivo!

Tutorial Widget Hack Botão Voltar ao Topo Flutuante

1 - Primeiro o que faz cada tag:

title=" xxxx " = o comando title com é o texto que a parece quando passamos o mouse.

EX: topo

img src="iiiiiii.gif" = A tag img é responsável pela visalização da imagem

EX: http://lh4.ggpht.com/_eZ4RDyPwpoA/SagWzGVD6mI/AAAAAAAAAw4/LivJ__3Qot0/s144/TOPO_FLUTUANTE_DICADEDICA.png

a href="#" = Esta é responsável pelo link para o topo da página
style="display: scroll = Este comando desabilita a barra de rolagem dando a aparência de flutuar na tela.
position: fixed = Fala que a imagem ficará em uma posição fixa
right: XXpx = Alinhamento da imagem a direita e com XX de tamanho em pixels.

EX: 72px

bottom: YYpx = Faz a imagem aparecer a XX pixels da parte de baixo da tela do navegador.

EX: 50 px2 - Agora que já sabe o que faz cada comando substitua no codigo abaixo o que lhe for do agrado e cole no html da pagina do blogger imediatamente antes da tag </dody>

<a style="display:scroll;position:fixed;bottom:XXpx;right:YYpx;" href="#" title="xxxx"><img src="iiiiiii.gif"/></a>

0 comentários:

Postar um comentário

Implante obrigatório do CHIP em humanos nos EUA REFORMA SANITÃRIA a marca da besta de apocalipse 13

apocalipse 13

13. E faz grandes sinais, de maneira que até fogo faz descer do céu à terra, à vista dos homens.
14. E engana os que habitam na terra com sinais que lhe foi permitido que fizesse em presença da besta, dizendo aos que habitam na terra que fizessem uma imagem à besta que recebera a ferida da espada e vivia.
15. E foi-lhe concedido que desse espírito à imagem da besta, para que também a imagem da besta falasse, e fizesse que fossem mortos todos os que não adorassem a imagem da besta.
16. E faz que a todos, pequenos e grandes, ricos e pobres, livres e servos, lhes seja posto um sinal na sua mão direita, ou nas suas testas,
17. Para que ninguém possa comprar ou vender, senão aquele que tiver o sinal, ou o nome da besta, ou o número do seu nome.
18. Aqui há sabedoria. Aquele que tem entendimento, calcule o número da besta; porque é o número de um homem, e o seu número é seiscentos e sessenta e seis.

Apocalipse14: 9-10

E seguiu-os o terceiro anjo, dizendo com grande voz: Se alguém adorar a besta, e a sua imagem, e receber o sinal na sua testa, ou na sua mão,
Também este beberá do vinho da ira de Deus, que se deitou, não misturado, no cálice da sua ira; e será atormentado com fogo e enxofre diante dos santos anjos e diante do Cordeiro.
Apocalipse 14:9-10