Bom hoje nesse artigo vou mostrar como adicionar um link em movimento no seu blog que dá a opção ao visitante de retornar ao inicio da página. É "Super fácil" confira!
O Processo para adicionar o link no seu blog requer dois (2) simples passos:
Primeiramente escolha a imagem/ícone que vai utilizar e copie a URL dela.Essa do globo e da setinha roxa foi a que utilizei no meu blog Beat Acelerado.
1- Adicionar link: vá em DESIGN , clique para adicionar um gadget, escolha a opção HTML/JavaScript, e coloque esse código:
- Para imagem/link->
<div style="position:fixed; bottom:0px; right:0px;"><a href="#"><img src="URL DA IMAGEM"title="Início da Página" border="0"></a></div>
- Somente Texto->
<a href="#topo">TEXTO</a>
2-Adicionar Marcador HTML: vá em DESIGN na opção ditar HTML, Selecione expandir HTML , dê F3, aparecerá uma janelinha no topo da pagina digite <body>, irá aparecer ela destacada no HTML. copie esse código :
<a name="topo"></a>
OBS: coloque logo após a Tang <body>
FICARÁ ASSIM NA SUA PÁGINA NO CANTO DIREITO EM BAIXO,MAS SEMPRE ACOMPANHADO.
AO CLICAR NA NO LINK ELE RÁPIDAMENTE FARÁ QUE A PÁGINA SUBA RETORNANDO AO TOPO.
Confira no Blog: http://beat-acelerado.blogspot.com/
Podemos modificar sim o lado do link, basta trocar essas partes marcadas:
<div style="position:fixed; bottom:0px; right:0px;"><a href="#"><img src="URL DA IMAGEM" border="0"></a></div>
DIREITO-> right:0px
ESQUERDO->left:0px;
EM BAIXO->bottom:0px;
EM CIMA->top:0px;
OBS: Além disso podemos escolher se ficará encostado nas margens da página ou deixaremos uma pequena distância só alterar os valores 0px para o número que desejar.
Podemos também utilizar esse link para direcionar para outros partes da blog, não apenas o topo.
Você escolhe, como post mais visitados, parcerias, seus links para contato.Basta, apenas , ao invés de inseri no HTML diretamente, inseri o mesmo marcador-> código: <a name="topo"></a> junto ao Gadget que você quer direcionado .
Só lembre-se de modificar o name-> <a name="topo"></a> quando for inserir mais de duas vezes .para não haver problemas no direcionamento. pode ser modificado para qualquer nome
.
EX¹:<a name="parcerias"></a>
EX²: <a name="meus links"></a>
Bom espero que tenha ajudado! qualquer dúvida entre contato conosco, deixe um comentário. Fiquem com Deus
Eu não consegui colocar o topo na página, a imagem foi, mas qdo clica na imagem, não sobe ao topo, aparece a caixa html...
ResponderExcluir