Page jumping (atalhos de página), também conhecidos como links de âncora ou links de atalho, são links que direcionam o usuário a uma seção anterior ou posterior de uma página longa assim que são clicados. O sumário abaixo é um exemplo de atalhos de página.
Neste guia
Um atalho de página é uma ótima maneira de vincular a uma seção de uma página. Os visitantes do seu site podem clicar para ir de uma parte de uma página longa para outra parte da mesma página.
Por exemplo, suponha que você tenha uma lista com os nomes das seções na parte superior de uma página. É possível vincular cada nome a uma seção relevante embaixo na página para que os visitantes possam ir para essa seção com informações específicas em que estão interessados. Em seguida, você pode direcionar os leitores de volta à lista completa de seções no início da página.
💡
Você também pode usar o bloco Tabela de conteúdo para automaticamente criar atalhos de página a partir de todos os títulos em seu post/página e um bloco Notas de rodapé para formatar automaticamente notas de rodapé em seu texto.
Este vídeo está em inglês.
O YouTube oferece recursos de tradução automática para que você possa assisti-lo no seu idioma:
Para ativar legendas com tradução automática:
- Reproduza o vídeo.
- Clique no ícone ⚙️ Configurações (no canto inferior direito do vídeo).
- Selecione Legendas/CC.
- Escolha Tradução automática.
- Selecione o idioma de sua preferência.
Para ouvir com dublagem automática (experimental):
- Clique no ícone ⚙️ Configurações.
- Selecione Faixa de áudio.
- Escolha o idioma em que deseja ouvir o vídeo.
ℹ️ As traduções e dublagens são geradas automaticamente pelo Google, podem não ser perfeitas e a dublagem automática ainda está em fase de testes, podendo não estar disponível em todos os idiomas.
A primeira etapa é selecionar a seção que os leitores acessarão quando clicarem no atalho de página. Para fazer isso, podemos criar o que é conhecido como uma “âncora” no bloco para o qual você deseja ir.
- Clique no bloco ao qual deseja adicionar a âncora. Muitos blocos comuns são compatíveis com âncoras, incluindo Parágrafo, Cabeçalho, Imagem, Colunas e Botões.
- Veja as configurações do bloco na barra lateral à direita. Se você não estiver vendo a barra lateral à direita, clique no ícone Configurações no canto superior direito para exibi-las. Esse ícone se parece com um quadrado com duas colunas irregulares:
- Na parte inferior das configurações do bloco, clique em Avançado.
- Digite uma palavra na caixa Âncora de HTML. Isso se tornará sua âncora. Use uma palavra exclusiva que ainda não esteja sendo usada como âncora em outro lugar da página. Se você quiser usar mais de uma palavra, um hífen (-) será inserido automaticamente entre elas, assim:
duas-palavras:
A seguir, vamos criar o próprio link de atalho de página. Seus visitantes clicarão nisso para chegar à seção criada na Etapa 1.
- Digite um texto ou adicione uma imagem, botão ou item do menu de navegação para seus leitores clicarem.
- Selecione o item do menu/imagem/botão/texto e clique na opção de link na barra de ferramentas do bloco. A opção de link é um ícone que se parece com o link real de uma cadeia, como destacado aqui:
- Digite a âncora de HTML criada na Etapa 1, iniciada pelo símbolo de jogo da velha (#). Por exemplo, se você criou uma âncora chamada
criar-um-atalho-de-pagina, o link deve ser#criar-um-atalho-de-pagina. - Clique em Salvar/Atualizar/Publicar no canto superior direito do editor para salvar suas alterações.
É isso! Agora você pode testar seu link na página pública para ter certeza de que o link criado na Etapa 2 o levará à âncora criada na Etapa 1. Os links de atalho de página não funcionarão quando você visualizar uma página ou post, então teste a versão publicada.
Você pode criar atalhos de página a partir do seu menu de navegação que direcionam para uma parte específica de uma página. Isso é comum para sites que têm uma página inicial com rolagem longa. Os atalhos de página facilitam a visualização da seção da página inicial que os visitantes desejam.
- O primeiro passo é criar uma âncora como o local para onde o usuário será direcionado.
- No seu menu, adicione um novo item que seja um link personalizado.
- No campo Texto, escreva o nome que deseja dar ao item de menu. Isso não afetará o atalho de página.
- No campo da URL, escreva sua âncora com um símbolo de hashtag (#) na frente.
Lembre-se de que um atalho de página como #minha-âncora só funcionará na mesma página em que a âncora estiver. Se você quiser ir para uma seção de uma página diferente, consulte a próxima seção deste guia.
Atalhos de página não precisam ser usados apenas para direcionar visitantes para seções na mesma página. Você pode usá-los para acessar uma área específica em outra página.
A diferença é que, em vez de vincular apenas à âncora, como fizemos no link #criar-um-atalho-de-página no passo 2 acima, vamos usar a URL completa da página seguida da âncora.
Por exemplo, se sua página tiver a seguinte URL:
https://yourgroovydomain.com/example/
e você criar uma âncora chamada unique-identifier nessa página, então o link de atalho completo seria:
https://yourgroovydomain.com/example/#unique-identifier
Para criar um link de atalho de retorno ao topo da página:
- Adicione uma âncora a um bloco no início da página.
- Na parte inferior da página, digite um texto como “voltar ao topo” ou “pular para o início”.
- Vincule esse texto à sua âncora.
Suporte 