Como adicionar botão “Voltar ao topo” no Blog




                A criação de um blog é feita pensando nas facilidades e ferramentas que serão disponibilizadas para seus leitores, assim os internautas que acessarem a página poderão visualizar os conteúdos inseridos de forma rápida e com determinados botões que podem auxiliar na navegação.
                O Blogger oferece uma variedade de opções para a inserção em blogs e personalização dos mesmos, principalmente com a possibilidade de alteração do código HTML e inclusão de gadgets, assim como o botão “Volta ao topo”.



Botão topo para blog




Funcionalidade do botão “Voltar ao topo”

                O botão “Voltar ao topo” é uma facilidade que podemos disponibilizar para os leitores do blog que podem voltar diretamente ao começo do site em cada uma das postagens, sem a necessidade de rolar a barra até chegar ao início.
                Ao final de cada post é exibido o botão “Voltar ao topo”, assim em todos os conteúdos o mecanismo estará disponível para os internautas.


Baixe botão Topo de graça (Modelos de botão Voltar ao Topo Aqui  e Aqui) você terá acesso a várias imagens que o Blog Universo das Dicas disponibiliza para você, caso utilize alguma dessas imagens, deixe um comentário para me incentivar a cada vez mais disponibilizar acessórios para você de graça! Não deixe de comentar por favor, afinal é só isso que peço ao você utilizar uma das minhas imagens (é proibido redistribuir essas imagens)


 Como adicionar botão “Voltar ao topo”

                A ferramenta para inserção do botão “Voltar ao topo” é o gadget que pode ser inserido rapidamente no Blogger, com a inclusão do código HTML específico para determinada ação, alterando o layout.

Para inserir o botão “Voltar ao topo” é necessário:


1.       Acessar o Blogger: Entre com seu login e senha para realizar as alterações no blog de sua escolha, optando-o pelo título da página.


2.       Entre em Layout: Acesse, na menu lateral do blog, a opção “Layout” e, em seguida, “Adicionar um Gadget”, selecionando o complemento desejado que, neste caso é o “HTML/JavaScript"




3.       Cole o código: O HTML que deve ser inserido na caixa do gadget indicado é: 



CÓDIGO IMAGEM VOLTAR AO TOPO COPIE AQUI



<div style="position:fixed; bottom:0px; right:0px;"><a href="#"><img src="LINK DA IMAGEM" border="0" /></a></div>







4.    Acrescente a imagem: É possível inserir uma imagem descrita como “Voltar ao topo” com animações ou estáticas, personalizando ainda mais seu blog. Para isto é necessário hospedar a imagem em algum site para obter seu link, veja o post onde hospedar imagens na internet ou como hospedar imagens no próprio Blogger substituindo  a frase LINK DA IMAGEM no HTML pelo link da sua imagem. Você também pode conferir em nossa galeria de imagens voltar ao topo se tem alguma que te agrade. Imagens Voltar Ao topo Para Blog




Além do botão “Voltar ao topo” simples, que redireciona o usuário diretamente para o início da página, também é possível inserir uma opção  de botão deslizante, ou seja, que percorre o site inteiro antes de chegar ao começo dos conteúdos.
Para inserir o botão “Voltar ao topo” deslizante é necessário seguir os dois primeiros passos citados acima, colando este código em vez do outro código acima:


CÓDIGO IMAGEM VOLTAR AO TOPO DESLIZANTE COPIE AQUI









        Com este código também é possível inserir uma imagem, procurando, em meio ao código, a frase “LINK DA IMAGEM”, Veja algumas das imagens que temos disponível para você utilizar AQUI
e AQUI
Obrigada por sua visita!
Universo das Dicas - Anna Vlis

9 comentários