Suporte CarcasaWeb carcasa.com.br
Enviar
Enviar
Enviar
(48)99979868 carcasa@carcasa.com.br

Links âncora

Ago 1, 2020 | Blog, DIVI

Os links âncora são usados ​​para navegar para conteúdo específico em uma página, e não simplesmente entre as próprias páginas.

Existem muitos usos para links âncora, como sites de uma página e vendas e páginas de entrada.

Por exemplo, se você tiver uma página de vendas de formulário longo descrevendo seu produto, poderá colocar um botão ‘Comprar’ em vários locais da página, todos com link para a parte inferior da página onde o usuário pode realmente comprar seu produto.

Dominar links de âncora no Divi é realmente muito simples.

]Use os links de ancoragem abaixo para navegar até a seção necessária piscadela

 ÂNCORAS DO MENU PRINCIPAL   | ÂNCORAS DE BOTÃO   | ÂNCORAS DE TEXTO

Então vamos cozinhar!

ANCORAR EM UM BOTÃO

Agora vamos dar uma olhada na criação de uma âncora em um botão.

O princípio é o mesmo, mas adicionamos a âncora ao campo URL do botão com o hash anterior (#)

Usando links âncora no Divi

 

Em seguida, adicionamos a âncora ao campo ID do CSS na guia Avançado da seção, linha ou módulo ao qual queremos vincular.

Usando links âncora no Divi

 

Agora que você salvar e atualizar sua página, seu novo botão será vinculado à seção, linha ou módulo que você definiu.

ÂNCORA DE LINK DE TEXTO

Por fim, veremos uma âncora de link de texto simples.

Supondo que queremos vincular a partir de algum texto em um parágrafo, nosso HTML se pareceria com isso, você pode ver que substituímos o URL por nossa âncora exclusiva, precedida por um hash (#).

  1. Este é o HTML que eu usaria para criar o meu costume <a href = “#myanchor”> Anchor link </a> quando se usa no texto.

 

Novamente, podemos adicionar nossa âncora ao campo CSS ID de qualquer seção, linha ou módulo, mas também podemos adicioná-lo a outro texto, para que a âncora sirva apenas para vincular frases ou parágrafos. Por exemplo, aqui vinculamos a um cabeçalho:

  1. <h1 id = “myanchor” > Este é um cabeçalho </h1>

 

Aqui, temos um link para o início de um parágrafo:

  1. <p id = “myanchor” > Este é o começo do meu parágrafo … </p>

 

E podemos até vincular uma palavra ou sentença específica dentro de um bloco de texto usando uma tag span como esta:

  1. Aqui estão alguns textos, <span id = “myanchor” > links de ancoragem para aqui </span> e mais alguns textos …

 

Essas soluções funcionam para vincular ao conteúdo na mesma página, mas e se você desejar vincular a uma âncora em outra página?

Nesse caso, você precisa adicionar o nome da página antes da âncora; portanto, em seu botão, item de menu personalizado ou link de texto, você adicionaria sua âncora assim:

/ pagename / # myanchor

ao invés de apenas

#myanchor

Se você tiver um cenário em que deseja vincular novamente a uma âncora na página inicial a partir de qualquer outra página, por exemplo, se você tiver um site de uma página que também tenha um blog, e em postagens únicas, será possível vincular novamente para uma âncora na página inicial, basta usar uma barra anterior como esta:

/ # myanchor

 

E é isso, muito simples né? 

EnglishPortuguêsEspañol