Como Mostrar Pré-visualização ao Vivo de Links no WordPress (2 Maneiras Fáceis)

Se você notou que os visitantes estão rolando suas páginas sem clicar nos seus links, você não está sozinho. Na minha experiência, links de texto simples são muitas vezes muito sutis para chamar a atenção, o que significa que os leitores perdem os recursos e ferramentas úteis que você recomenda.

É aí que as prévias de links ao vivo podem ajudar. Em vez de mostrar apenas um URL, você pode exibir uma prévia com uma imagem, título e uma breve descrição — semelhante a como os links aparecem nas plataformas de mídia social.

Neste guia, mostrarei como exibir prévias de links ao vivo no WordPress, passo a passo.

Ao final deste tutorial, você será capaz de transformar links simples em prévias atraentes que chamam a atenção e incentivam mais cliques.

Por que Mostrar Prévia de Links ao Vivo no WordPress?

As prévias de links ao vivo tornam os links mais úteis, mais visíveis e mais fáceis de clicar.

Em vez de mostrar um URL simples, eles fornecem contexto útil aos visitantes antes que eles decidam abrir um link.

Eis por que recomendo usar prévias de links ao vivo em um site WordPress:

• Chame a Atenção: Uma prévia de link com imagem e título se destaca mais do que texto simples, especialmente em posts de blog mais longos.
• Ajude a Obter Mais Cliques: Quando os leitores podem ver sobre o que é um link, eles são mais propensos a clicar nele.
• Melhore a Experiência de Leitura: Os visitantes não precisam adivinhar para onde um link leva. A prévia define expectativas claras.
• Ótimo para Compartilhar Ferramentas e Recursos: As prévias de links funcionam especialmente bem ao recomendar produtos, plugins ou conteúdo externo útil.
• Faça o Conteúdo Parecer Mais Moderno: Descobri que adicionar prévias de links dá ao seu site uma aparência polida e profissional. Isso faz com que seu conteúdo se pareça com o que as pessoas veem ao compartilhar links nas redes sociais.

Se você compartilha links com frequência em tutoriais, posts de blog ou landing pages, as prévias de links ao vivo podem ajudar a manter os leitores engajados e incentivá-los a explorar mais.

Agora, vamos mostrar como adicionar facilmente prévias de links ao vivo no WordPress usando 2 métodos fáceis.

Qual Método Você Deve Escolher?🤔

Antes de mergulhar nos tutoriais passo a passo, é útil escolher o método que se adapta ao seu site e aos seus objetivos.

Alguns plugins mostram prévias automaticamente quando os visitantes passam o mouse sobre os links, enquanto outros permitem que você crie cartões de prévia estilizados para links específicos.

A tabela abaixo facilita a visualização de qual opção funciona melhor para você:

Plugin / Método	Melhor Para	Quando Usar
Linkz.ai (Método 1)	Pré-visualizações automáticas de links ao vivo ao passar o mouse	Blogs, tutoriais, sites com muitos recursos, sites com muitos links externos
Visual Link Preview (Método 2)	Cartões de pré-visualização de links no estilo Facebook	Sites de afiliados, lojas WooCommerce, seções de links curados, páginas onde você deseja destacar links específicos

Agora que você sabe qual método atende às suas necessidades, vamos aos tutoriais e configurar suas pré-visualizações de links ao vivo:

Método 1: Mostrar pré-visualizações de links ao vivo ao passar o mouse usando Linkz.ai

Recomendo usar o Linkz.ai se você quiser que as prévias de links ao vivo apareçam automaticamente quando os visitantes passarem o mouse sobre os links em seu site.

Este método funciona especialmente bem para blogs, tutoriais e sites com muitos recursos onde você compartilha muitos links internos e externos.

O Linkz.ai extrai e exibe automaticamente o conteúdo vinculado, incluindo artigos, posts de blog, vídeos, apresentações, PDFs e mais de 1.000 outros embeds da web. Ele usa um script de carregamento sob demanda, o que significa que a pré-visualização só carrega quando um usuário interage com o link para manter o peso inicial da sua página leve.

Quando os usuários passam o mouse sobre um link, um pop-up aparece com um resumo do conteúdo, dando aos visitantes contexto sem sair do seu site.

Você precisará criar uma conta Linkz.ai para usar o plugin. O plano gratuito permite que você adicione pré-visualizações ao passar o mouse imediatamente para links internos e externos, o que é suficiente para a maioria dos blogs e sites pequenos.

Para aqueles que precisam de mais recursos como análises, temas extras e conteúdo mais rico, o plano premium 'Blog' começa em $60 por ano ($5 por mês).

No geral, acho que é uma ótima solução porque é automática, fácil para iniciantes e mantém os leitores engajados com configuração mínima.

Passo 1: Instale o Linkz.ai e Crie uma Conta

Primeiro, você precisa instalar e ativar o plugin Linkz.ai. Se você não tem certeza de como fazer isso, não se preocupe, pois eu te ajudo.

Basta seguir nosso guia passo a passo sobre como instalar um plugin do WordPress.

Assim que o plugin for ativado, você verá uma aba de menu Linkz.ai no seu painel de administração do WordPress. Clique nela e, em seguida, clique no botão 'Sign Up'.

Isso o direcionará para o site Linkz.ai, onde você precisará criar uma conta inserindo seu endereço de e-mail e escolhendo uma senha.

Depois disso, clique no botão ‘Continue’.

Você agora criou com sucesso sua conta Linkz.ai. Por padrão, você estará no plano Gratuito, que permite adicionar até 2.500 pré-visualizações de links por mês em um site.

Ele exibe automaticamente pré-visualizações quando os usuários passam o mouse sobre os links e pode exibir pré-visualizações ricas ao clicar, com a marca Linkz.ai incluída.

Este plano é perfeito para começar, e você sempre pode fazer um upgrade mais tarde se desejar recursos extras como análises, temas adicionais ou mais pré-visualizações de links por mês.

Etapa 2: Conecte o Linkz.ai ao seu site WordPress

Agora que você criou sua conta Linkz.ai, é hora de conectá-la ao seu site WordPress. Após o cadastro, o Linkz.ai abrirá automaticamente um assistente de instalação em seu painel.

O URL do seu site já estará adicionado, então tudo o que você precisa fazer é clicar no botão 'Add' para conectar seu site ao Linkz.ai.

Em seguida, o assistente perguntará quais hiperlinks devem exibir prévias de links. Se você quiser apenas prévias para links externos, poderá selecionar essa opção.

Eu pessoalmente recomendo escolher links externos e internos se você quiser que todo o seu conteúdo pareça mais interativo e envolvente para os visitantes.

Assim que fizer sua seleção, clique no botão ‘Próximo’.

Depois disso, você terá que escolher um tema e estilo para os cartões de pré-visualização do seu link.

No plano gratuito, você só pode usar o tema 'Clássico', que mostra uma imagem em destaque grande junto com um trecho do post. Usuários premium têm acesso a temas adicionais e mais opções de personalização.

Para o estilo, você precisará escolher entre o modo claro e o modo escuro.

Eu pessoalmente recomendo a opção ‘Automático claro/escuro’ porque ela se ajusta automaticamente para combinar com o modo do site do seu visitante, embora esse recurso esteja disponível apenas com o plano premium.

Depois de fazer suas seleções, clique no botão ‘Próximo’.

Isso o direcionará para a última etapa, onde você precisará clicar no botão ‘Ativar Linkz.ai’.

Em seguida, você retornará ao seu painel do WordPress. Aqui, seu site será listado nas configurações do Linkz.ai com o alternador ativado.

Isso significa que seus cartões de pré-visualização de link agora estão ativos e serão exibidos por padrão em seu site.

Etapa 3: Teste suas primeiras pré-visualizações de link ao vivo

Assim que o Linkz.ai estiver conectado e ativo em seu site, é hora de vê-lo em ação. Abra uma postagem ou página em seu site WordPress que contenha links.

Passe o mouse sobre um link e você deverá ver uma pequena prévia em popup aparecer automaticamente. Esta prévia mostrará um resumo do conteúdo vinculado, incluindo o título, a imagem em destaque e o trecho.

Se você selecionou links internos e externos na Etapa 2, tente passar o mouse sobre um link interno para ver como ele fica. Esta é uma ótima maneira de tornar seu próprio conteúdo mais interativo e manter os visitantes engajados em seu site.

Se a pré-visualização não aparecer, certifique-se de que o alternador Linkz.ai esteja ativado no painel do WordPress em configurações do Linkz.ai.

Você também pode querer limpar o cache do seu site se estiver usando um plugin de cache, pois páginas em cache às vezes podem impedir que novos recursos sejam exibidos imediatamente.

Após confirmar que tudo funciona, você pode começar a publicar postagens com a confiança de que seus links agora são mais envolventes.

Método 2: Crie cartões de pré-visualização de link usando pré-visualização de link visual

Se você quiser mais controle sobre como seus links aparecem, então o Visual Link Preview é uma ótima opção. Este plugin permite que você crie cartões de prévia de links no estilo do Facebook para qualquer link em seu site, para que você possa escolher a imagem, o título e a descrição que aparecem.

Você pode até criar seu próprio modelo personalizado ou estilizar o modelo padrão para combinar com o design do seu site.

Recomendo este método se você quiser destacar links específicos, como promoções de afiliados, produtos WooCommerce, posts relacionados ou listas curadas de sites úteis.

Como ele salva os dados de pré-visualização localmente em seu site, ele não precisa buscar dados do site externo toda vez que uma página é carregada. Isso reduz as requisições HTTP externas, o que ajuda a manter suas Core Web Vitals e a velocidade geral do site.

Visual Link Preview funciona tanto com o Editor Clássico quanto com o Gutenberg, permitindo que você adicione pré-visualizações usando blocos ou shortcodes. Isso o torna flexível para qualquer tipo de conteúdo, seja você mantendo um blog, uma loja online ou uma página de recursos.

Passo 1: Instale e Ative o Visual Link Preview

Para começar, você primeiro precisa instalar e ativar o plugin Visual Link Preview. A melhor parte é que ele é totalmente gratuito, então você pode adicionar cartões de prévia de links personalizados ao seu site sem gastar nada.

Para instalá-lo, vá para o seu painel do WordPress, navegue até Plugins » Adicionar Novo e pesquise por 'Visual Link Preview'.

Assim que encontrá-lo, clique em 'Instalar agora' e depois em 'Ativar'. Para mais informações, você pode conferir nosso guia sobre como instalar um plugin do WordPress.

Passo 2: Escolha e Personalize um Modelo para os Cartões de Pré-visualização de Links

Assim que o plugin for ativado, vá para a página Configurações » Visual Link Preview no seu painel do WordPress. É aqui que você decidirá como seus cartões de pré-visualização de links ficarão.

O plugin oferece dois tipos de modelos: dinâmicos e estáticos.

Modelos dinâmicos são totalmente editáveis usando o Editor de Modelos, dando a você controle total sobre o layout, cores e design dos seus cartões. Modelos estáticos são pré-codificados e permitem apenas pequenas alterações de estilo, sendo assim mais simples, mas menos flexíveis.

Para criar um modelo dinâmico, você precisa abrir o ‘Editor de Modelos’.

Eu recomendo esta opção porque ela permite que você personalize seus cartões exatamente como deseja e veja as alterações em tempo real.

Primeiro, você escolhe um estilo de modelo padrão e o visualiza. Em seguida, clique no botão ‘Clonar e Editar Modelo’ para começar a personalizar.

Você precisa dar um nome ao seu modelo antes de poder salvá-lo.

Eu geralmente escolho algo descritivo que facilita a identificação mais tarde.

No editor, o lado esquerdo permite ajustar as propriedades do modelo, como fundo, bordas, preenchimento e margens. Você também pode editar elementos individuais como título, texto e imagem.

No lado direito, você verá uma prévia em tempo real do seu cartão de prévia de link enquanto faz as alterações. Quando estiver satisfeito com o design, clique em ‘Salvar Alterações’ no topo.

De volta à página de configurações, seu novo modelo agora aparecerá no menu suspenso de modelos dinâmicos.

A partir daqui, basta selecioná-lo para começar a usá-lo imediatamente.

Se você quiser uma configuração mais rápida, pode escolher um modelo estático em vez disso, ativando o interruptor ‘Usar Estilo Personalizado’.

Em seguida, faça ajustes básicos como largura do contêiner, cor de fundo, preenchimento, bordas e estilos de texto.

É uma opção mais rápida, mas eu pessoalmente prefiro modelos dinâmicos porque eles me dão mais controle e criam um visual mais polido e profissional para meus cartões de prévia de link.

Quando terminar, basta clicar no botão ‘Save Changes’ para salvar suas configurações.

Passo 3: Adicione Seu Primeiro Cartão de Prévia de Link

Agora é hora de adicionar um cartão de prévia de link a um dos seus posts. Vá para Posts » Todos os Posts e clique em ‘Editar’ no post onde você deseja destacar o cartão de prévia.

Assim que o editor de blocos abrir, clique no botão ‘Adicionar Bloco’ para abrir o menu de blocos. A partir daí, encontre o bloco ‘Prévia de Link Visual’ e arraste-o para um local de sua escolha.

Se você quiser adicionar uma prévia para um link externo, basta colar o URL e clicar no botão ‘Usar Este URL’. Se você quiser adicionar uma prévia para um post ou página interna, clique no botão ‘Pesquisar Post’.

Um pop-up aparecerá onde você pode digitar o título do post que deseja.

Assim que o plugin carregar os resultados, clique em ‘Usar Este Post’ ao lado do que você deseja destacar no cartão de prévia.

Após o carregamento do cartão de pré-visualização, você pode personalizá-lo no painel de blocos à esquerda.

Você pode editar a descrição para torná-la mais envolvente e substituir a imagem em miniatura se desejar usar outra.

Você também pode alternar opções para abrir o link em uma nova aba ou adicionar um atributo nofollow.

Se você estiver usando um link externo, recomendo ativar a opção nofollow.

Descobri que usar nofollow para links externos ajuda a proteger o SEO do seu próprio site. Isso permite que você compartilhe recursos úteis com seus leitores sem transferir sua própria autoridade de busca.

Quando estiver satisfeito com a aparência, clique em 'Atualizar' ou 'Publicar' para salvar suas alterações.

Agora seu cartão de pré-visualização de link está ativo, oferecendo aos leitores uma maneira visual e interativa de explorar o conteúdo sem sair da página.

Bônus: Faça suas pré-visualizações de links do WordPress parecerem perfeitas

Os métodos acima ajudam você a mostrar pré-visualizações de links em seu site, mas você também quer que seus links fiquem ótimos quando compartilhados nas redes sociais. Uma imagem, título e descrição adequados criam um cartão de pré-visualização com aparência profissional e tornam as pessoas mais propensas a clicar.

Se essas informações não estiverem configuradas corretamente, seus links podem parecer pouco polidos ou quebrados. Recomendo usar o All in One SEO (AIOSEO), o melhor plugin de SEO para WordPress, para controlar facilmente esses metadados e garantir que seus links sempre pareçam os melhores.

Usamos o AIOSEO no WPBeginner para SEO. Para ler mais sobre nossa experiência, veja nossa avaliação completa do AIOSEO.

Com o AIOSEO, você pode facilmente definir meta tags Open Graph para Facebook, LinkedIn e outras plataformas, personalizar o título e a descrição, e até mesmo definir uma imagem Open Graph padrão.

Você também pode adicionar marcação de schema para dar aos mecanismos de busca mais contexto sobre seu conteúdo.

Ao configurar o Open Graph e o schema com o AIOSEO, seus links ficarão limpos e clicáveis em toda a web, ao mesmo tempo que ajudam você a melhorar seu SEO no WordPress.

👉 Para saber mais, confira nossos guias:

• Como Adicionar Marcação Schema no WordPress
• Como Adicionar Corretamente Schema de ‘Como Fazer’ Amigável para SEO no WordPress
• Guia para Iniciantes sobre Como Adicionar Metadados Open Graph do Facebook no WordPress

Perguntas frequentes sobre como mostrar links de pré-visualização ao vivo no WordPress

Se você ainda tem dúvidas sobre como adicionar prévias de links em seu site WordPress, você não está sozinho. Abaixo, respondi às perguntas mais comuns para ajudá-lo a solucionar problemas e fazer com que seus links fiquem com a melhor aparência possível.

Como rastrear cliques em links no WordPress?

Você pode rastrear cliques em links usando plugins como o MonsterInsights, o melhor plugin do Google Analytics para WordPress, ou o Pretty Links, o melhor plugin de encurtamento de links para WordPress. Essas ferramentas registram dados específicos como taxas de cliques (CTR) e estatísticas de conversão sem a necessidade de código personalizado.

Para começar, confira nosso guia sobre como rastrear cliques em links no WordPress.

O WordPress exibe prévias de links por padrão?

Não, o WordPress exibe links como texto simples por padrão. No entanto, o WordPress incorpora automaticamente conteúdo de sites específicos (como YouTube ou Twitter) se você colar o URL em sua própria linha. Para links de texto padrão, você precisa de um plugin como os mencionados acima.

Qual é o melhor rastreador de links gratuito?

Para uma opção gratuita, o Pretty Links Lite é uma escolha popular. Ele permite encurtar, rastrear e gerenciar links diretamente do seu painel do WordPress sem nenhum custo.

Como vejo todos os links no WordPress?

Você pode ver todos os links instalando um plugin de gerenciamento de links como o Pretty Links ou usando o editor do WordPress para verificar suas postagens e páginas. Alguns plugins de SEO também fornecem uma visão geral dos links em seus painéis.

Encurtadores de URL são bons para SEO?

Sim, mas com alguma cautela. URLs encurtados podem parecer mais limpos e fáceis de compartilhar, mas certifique-se de que eles redirecionam corretamente para a página final. Plugins como Pretty Links e ThirstyAffiliates lidam com isso com segurança para o WordPress.

Qual é a diferença entre uma URL e um hiperlink?

Uma URL é o endereço web de uma página, enquanto um hiperlink é o texto ou imagem clicável que aponta para essa URL. Em termos simples, a URL é o destino e o hiperlink é o que os usuários clicam para chegar lá.

Como altero uma URL sem perder o SEO?

Use um redirecionamento 301 sempre que alterar um URL. Isso informa aos mecanismos de pesquisa que a página foi movida permanentemente e preserva suas classificações de SEO, ao mesmo tempo que envia os visitantes para o novo link.

Descubra Mais Recursos de Design para WordPress

Quer tornar o design do seu site WordPress ainda mais interessante? Confira estes guias úteis:

• Use notas de rodapé simples e elegantes em suas postagens de blog para adicionar informações extras
• Mostre links de navegação de breadcrumb para ajudar os visitantes a entender onde eles estão em seu site
• Crie um ticker de notícias em rolagem para compartilhar atualizações importantes com seus visitantes
• Use um widget de cronômetro regressivo para criar expectativa para eventos especiais
• Adicione uma barra de progresso de leitura às suas postagens para manter os leitores engajados
• Crie divisores de forma personalizados para tornar o design do seu site mais interessante

Espero que este artigo tenha ajudado você a aprender como mostrar pré-visualizações ao vivo de seus links no WordPress. Você também pode querer conferir nossa lista dos melhores construtores de páginas de arrastar e soltar no WordPress e nosso guia sobre como editar um site WordPress.

Se você gostou deste artigo, por favor, inscreva-se em nosso Canal do YouTube para tutoriais em vídeo do WordPress. Você também pode nos encontrar no Twitter e no Facebook.