como fazer link âncora no wordpress

Como fazer link âncora no wordpress“, assim mesmo, foi o que eu digitei no Google para tentar resolver uma dúvida simples sobre o código HTML que eu deveria utilizar para fazer um link  de uma palavra específica para um ponto exata dentro do meu artigo. Simples não? Mas demorei um pouco para encontrar.

Nesse artigo aqui tenho certeza que você vai matar a sua dúvida bem rápido de como fazer link âncora no WordPress usando HTML, nesse caso.

 

Entenda o que seria um link Âncora

Fazer um link âncora, significa “âncorar” um ponto de contato, ou link, não apenas de uma página ou artigo para outro utilizando um “CLIQUE AQUI“, “SAIBA MAIS AQUI” ou “CLIQUE” onde todas essas palavras em letra maiúscula te levariam à uma outra página do seu Site, Blog, e-Commerce ou Hotsite.

Tipo “De origem” – de onde vai partir o link – “Para onde” – para onde será o destino do link, mas também pode ser usado para levar seu usuário para um ponto exato da sua página ou artigo (a “âncora”).

E, ao mesmo tempo, isso coloca outra questão interessante: a possibilidade de fazer links internos a uma postagem (ou página web). Isto é útil quando a postagem é grande e você quer facilitar a vida dos seus usuários, sendo assim você poderia fazer uma lista inicial de tópicos dentro do texto que levaram seu leitor diretamente onde mais o interessa durante a navegação.

Complicado? Acho que não, mas quando chegar na parte prática desse artigo você verá que não é tão complicado assim, pois vou colocar os links para você Copiar e Colar no seu código HTML da sua página web.

 

SUGIRO TAMBÉM: CONSULTORIA DE MARKETING DIGITAL PARA PEQUENAS EMPRESAS

 

A estrutura HTML para resolver o texto âncora

Vou ensinar as estruturas de HTML que são necessárias criar para gerar seus links âncora de forma simples não sendo necessário você ter conhecimento aprofundado de HTML ou até mesmo contratar um programador para que ele faça isso por você. Poupe tempo e dinheiro!

Pode ser que você fique na dúvida de onde inserir esses códigos que vou listar abaixo, então, para você não ficar meio perdido (a) no momento em que for realizar o processo no seu WordPress, logo ali em cima das configurações de fontes, negrito, itálico, inserir imagem etc.. existem 2 (duas) abas muito comuns, a Visual e a Texto… veja na seta verde em destaque:

 

onde editar o codigo html para inserir o texto ancora

 

PRONTO! Dessa forma, você já pode seguir em frente e utilizar o passo a passo abaixo para criar seu link âncora no WordPress:

código HTML no ponto de origem:

Você deverá inserir onde está escrito #nome_da_ancora alguma codificação a sua escolha para identificar o link e a facilitar a sua viva na gestão do processo de construção do seu artigo perfeito. Já no lugar onde está escrito link você deverá colocar o texto âncora onde será ativado o seu link para o ponto exato do texto que você deseja.

<a href=”#nome_da_ancora”>link</a>

Veja um exemplo prático de isso funcionaria no processo de construção de um link âncora dentro do seu artigo ou página. Note que o texto utilizado no lugar da palavra link foi Federation Square. 😉

Já o código que utilizei no lugar do #nome_da_ancora criei um padrão assim: link1, link2, link3 etc.

 

 

link ancora em artigo do wordpress

 

CÓDIGO HTML NO PONTO DE DESTINO:

Já no destino do seu link você deverá inserir o código HTML abaixo. Lembre-se que onde está escrito nome_da_ancora você NÃO precisa inserir o código # no início, ok. Veja também que surgirá a imagem de uma âncora no seu WordPress (veja a seta em verde) não se assuste, pois ela aparecerá exatamente onde está o local que a tela vai parar assim que seu usuário clicar no link de origem.

<a name=”nome_da_ancora”>texto âncora</a>

texto ancora dentro do wordpress no destino

 

Dessa forma um exemplo prático de um link interno ou âncora ficaria assim:

<a href=”#nome_da_ancora”>Palavra que ficará em destaque no texto com o link</a>

<a name=”nome_da_ancora”>Parte do texto o qual você quer que o usuário chegue</a>

 

Quando o link-âncora está em páginas DIFERENTES, os códigos são os seguintes:

Código de link para âncora para outra página é o seguinte:

<a href=”http://www.nomedosite.com/completo/exemplo#nome_da_ancora”>nome do link</a>

<a name=”nome_da_ancora”>texto âncora onde o usuário vai chegar na outra página</a>

Caso você conheça alguma outra forma ou método mais simples de como fazer link âncora no WordPress, por favor, agradeço pode deixar seu comentário logo a baixo com algum link de artigo, vídeo ou qualquer outra media, ok.

 

 

Deixe uma resposta

O seu endereço de e-mail não será publicado.