Como adicionar links de âncora na Página Índice

Na versão 7.0, as Páginas Índice empilhadas têm uma estrutura de URL exclusiva que você pode usar para criar links de âncora (ou "puladas de página") sem código personalizado. Esses links de âncora levam você a lugares específicos na página Índice. 

Por exemplo: ao se clicar no botão Veja nossos trabalhos no site demo do template Hayden, ele rola a página até a seção "Moreau".

Este guia é para as Páginas de Índice na versão 7.0. Para adicionar links âncora na versão 7.1 ou em outros tipos de páginas na versão 7.0, acesse criação de links âncora.

Templates suportados

Os links de âncora da página índice funcionam melhor em templates com a página índice empilhada. Nas seguintes famílias de templates, um clique no link de âncora leva para essa seção na página índice.

• Bedford
• Brine - o carregamento do Ajax pode entrar em conflito com o comportamento do link de âncora. Uma alternativa é usar a navegação integrada do índice.
• Pacífico — você precisa adicionar -seção ao fim do link. A etapa 3 abaixo dá mais informações.

Dica: alguns índices em grade aceitam um recurso semelhante. Você também pode usar um código personalizado para adicionar links de âncora simples em qualquer template.

Step 1 - Encontre o slug

No painel Páginas, passe o mouse sobre a seção do Índice para a qual o link será criado. Clique em para abrir as Configurações de Página dessa seção.

Copie o slug do campo Slug do URL. Use esse slug para criar um link de âncora.

Dica: o slug pode aparecer na barra do browser quando visitantes acessam essa seção. Para alterar o slug, digite um novo texto no campo.

Step 2 - Crie o link

Adicione o link no qual o visitante deve clicar. Estas etapas usam um link de texto como exemplo, mas pode ser de qualquer tipo. No bloco de texto, destaque o texto e clique no ícone do Link, na barra de ferramentas do bloco de texto.

Dica: o índice de cada template tem opções exclusivas. Para saber mais, veja o guia da família do seu template: Bedford, Brine ou Pacific.

Etapa 3 - Adicione o slug da página

Em seguida, siga estes steps:

1. No campo Link, cole o slug copiado na etapa 1.
2. Adicione um símbolo de hashtag (#) no início do slug para completar o link. O link de âncora neste exemplo é #hours-and-location.
3. Clique em para abrir as configurações e veja se a opção Abrir em nova janela está desativada.
4. Nos templates Pacific, Charlotte, Horizon e Naomi, adicione -section ao fim do link de âncora, da seguinte forma: #hours-and-location-section
5. Clique em Salvar.

Step 4 - Adicione o slug do Índice

Se você adicionou o link no Step 2 a uma seção dentro do mesmo Índice, pode pular este step.

Para qualquer outro link, como links de navegação ou links em outras páginas, inclua o slug da Página Índice antes do link âncora. Isso garantirá que seus links funcionem a partir de:

• Outra página.
• Da navegação do seu site.
• O URL direto de uma subpágina.

Para adicionar isso:

1. Copie o slug para sua Página Índice a partir de suas Configurações de Página.
2. Abra o editor de links novamente.
3. Adicione o slug da página antes do link de âncora entre dois símbolos de /, desta forma:

https://siteexemplo.com/indexslug/#pageslug

4. Clique em Salvar.

Observação: se o seu domínio principal incluir www. antes do nome de domínio, inclua isso também no URL do link de âncora.

Exemplos

Adicione links de âncora a várias seções para ajudar os visitantes a navegarem em sua Página Índice. Este exemplo usa o template Brine e três tipos de links diferentes: Bloco de Botões, link de texto e imagem de URL de clickthrough.

Para criar uma navegação, organize os links de âncora lado a lado. Este exemplo usa o template Bedford com os correspondentes links de texto.

Página Índice de grade e links âncora

As seguintes famílias de template com Página Índice em grade aceitam uma funcionalidade semelhante:

• Avenue
• Flatiron
• Montauk

Você pode criar um link de âncora da Página Índice nesses templates usando o seguinte formato de URL:

/index-page-slug/#/page-slug

Essa é uma boa opção para vincular a navegação ou outras páginas do seu site ao índice. A página se abre com uma formatação específica do índice, da mesma forma que seria ao clicar na imagem em destaque dela no índice.

Este exemplo usa o template Avenue.

Resolução de problemas

Se um link âncora não está funcionando, estas dicas podem ajudar:

• Se necessário, veja se você adicionou o slug da página índice conforme descrito no Passo 4, incluindo os dois símbolos /. Isso é exigido nos links de navegação e de outras páginas.
• Se você está tendo problemas em dispositivos móveis e seu template for da família Brine, tente desativar o Ajax temporariamente para ver se isso é a causa do problema.
• Se você alterou um deles, será necessário atualizar manualmente o link de âncora.