Olá pessoal,
Você já se perguntou sobre como adicionar aqueles botões que normalmente ficam posicionados nos rodapés de sites que tem a função ”volta ao topo” mas de repente acha que não é possível acrescentar esta função no seu projeto desenvolvido no Web Acappella?
Hoje estaremos apresentando um breve tutorial sobre como acrescentar esta funcionalidade no seu projeto.
Vamos lá!
A função é baseada em apenas um simples código:
|
1
|
<span style=’font-size:130%;’><a href=# style=’display:croll_top;position:fixed;bottom:5px;right:5px;’><img alt=’Voltar ao Topo da Página’ src=http://img826.imageshack.us/img826/6442/voltaraotopo.png height=’23′ width=’23′ title='Voltar ao topo' /> |
Neste exemplo o nosso botão é ”flutuante” ou seja não importa que que parte da página o visitante esteja, ele sempre vai ter à disposição o botão volta ao topo caso necessite.
Para adicionar o código ao seu Web Acappella faça download do código aqui ou copie o código acima e vá até o seu Web Acappella > Clique em Código HTML > e cole o código na janela Propriedades do código HTML. Caso queira mais visualizar o botão clique na opção Activar a pre-visualização.
Sugerimos que utilize este código em uma matriz principal das páginas do seu site, assim fica mais fácil de disponibilizar o botão de volta ao topo em todas as páginas do seu site.
Personalização:
- Caso você queira alterar a posição que o seu botão será exibido em seu site edite o seguinte trecho:
|
1
|
bottom:5px;right:5px; |
Em bottom:5px; você altera a altura do botão ficará posicionado e em right:5px; a distância em relação ao lado direito do seu site.
- Caso queira alterar a imagem exibida basta alterar o seguinte trecho:
Substituindo http://img826.imageshack.us/img826/6442/voltaraotopo.png pelo endereço da sua imagem.
