Se você administra um site construído com WordPress, é muito provável que você já tenha compartilhado um dos seus posts nas redes sociais, especialmente no Facebook ou através do WhatsApp, com seus amigos e seguidores. Quando você faz isso, geralmente as redes sociais automaticamente geram uma prévia do seu conteúdo, mostrando uma imagem, um título e uma descrição. Embora as redes sociais se esforcem para criar as prévias da melhor forma possível, é interessante ter o controle sobre como essas prévias são exibidas.
Redes sociais como o Facebook e WhatsApp usam as marcações Open Graph presentes no código HTML do seu site (você pode acessar o código-fonte do seu site no Chrome pressionando CTRL + U) para montar essas prévias de compartilhamento. Aqui está um exemplo de marcação Open Graph com o título da página:
<meta property="og:title" content="Como Configurar Prévias de Posts WordPress no Facebook Sem a Utilização de Plugins - por Aylton Inacio">
A maneira mais simples de configurar o seu site WordPress para exibir prévias personalizadas é utilizando um plugin de SEO. No entanto, como é sabido, quanto menos plugins, melhor. Portanto, vamos explorar como fazer essa configuração sem a necessidade de um plugin.
Passos para Configurar as Prévias de Posts no WordPress Sem a Utilização de Plugins
Neste tutorial, vamos focar na configuração das prévias somente para os posts. Siga os seguintes passos:
- Acesse o painel de administração do seu site WordPress.
- Clique em “Aparência” e encontre o arquivo
header.php, que é responsável pelo cabeçalho do tema do seu site.
Lembre-se de ser cauteloso ao fazer alterações nos arquivos do site, adicionando apenas o que for apresentado neste tutorial. Qualquer modificação adicional pode fazer com que o seu site WordPress não funcione corretamente.
- Procure pela linha
</head>no arquivoheader.phpe insira o seguinte código antes dela:
if ( is_single() ) {
echo "<meta property='og:title' content='" . get_the_title() . "'>\n";
echo "<meta property='og:description' content='" . get_the_excerpt() . "'>\n";
echo "<meta property='og:image' content='" . get_the_post_thumbnail_url() . "'>\n";
echo "<meta property='og:type' content='article'>\n";
echo "<meta property='og:url' content='" . get_permalink() . "'>\n";
}
- Após inserir o código, verifique se está correto e clique em “Atualizar Arquivo”. Se ocorrer algum erro que impeça a alteração, entre em contato com o suporte técnico ou programador e peça para que façam a alteração diretamente no servidor. O arquivo a ser modificado é o
header.phpque está localizado na pasta do tema do seu site.
Analisando o código, a linha if ( is_single() ) verifica se a página acessada é um post. Se for um post, o código adiciona as marcações Open Graph de forma dinâmica. Por exemplo, a função get_the_title() recupera o título do post atual. É importante lembrar que cada post deve possuir uma imagem de destaque e um resumo, pois essas informações são essenciais para a criação das prévias nas redes sociais.
Para finalizar, você pode acessar um post no seu site e verificar o código-fonte da página (no Chrome, pressione CTRL + U). Procure pelas marcações e certifique-se de que tudo está preenchido corretamente. Você também pode utilizar a ferramenta “Depurador do Facebook” para testar a URL do post, que mostrará como o Facebook está interpretando a página e como a prévia será criada.
Espero que você tenha achado este tutorial útil. Se gostou, ajude na divulgação compartilhando o conteúdo “Como Configurar Prévias de Posts WordPress no Facebook Sem a Utilização de Plugins” nas redes sociais ou adicionando um link em seu site para apoiar e melhorar a classificação deste material nos resultados de pesquisa. Se tiver dúvidas ou sugestões, não hesite em entrar em contato.
Aproveite também para se inscrever no meu canal do YouTube e na newsletter do site para ficar por dentro das últimas novidades em artigos, tutoriais e cursos online. Até a próxima!