Tags OG do WordPress: como aumentar os cliques em sua postagem nas redes sociais

Você já ouviu falar sobre meta tags og? Você implementa og meta tags em seu site WordPress? Este artigo mostrará o que são meta tags og e como implementá-las em seu site WordPress.

Conteúdo[Mostrar]

Quando um post do seu blog ou URL do seu site é compartilhado no Facebook, o site de mídia social faz um bom trabalho ao obter os dados certos dele. Coisas como o URL do seu blog ou site, um trecho do texto do post, uma imagem em destaque, etc. serão exibidos, levando os usuários a clicarem nele.

No entanto, se você for um usuário ávido do Facebook, deve ter notado que os dados que ele extrai de sites (incluindo o seu) nem sempre são perfeitos. Às vezes, ele puxa uma imagem que não representa com precisão o conteúdo da postagem compartilhada ou pode extrair um texto próximo ao final da postagem e usá-lo como um trecho, o que quase sempre não é uma coisa boa e, pior ainda, existe são momentos em que nenhum outro dado além do título da postagem (ou o conteúdo do tag) e o URL é compartilhado!

Isso normalmente acontece se você não implementar ocaneta gmeta tags raph (também conhecidas como meta tags og) em seu site WordPress. Sem essas tags importantes, o Facebook (e outros sites de mídia social) não será capaz de obter as informações corretas para exibir em uma postagem ou link compartilhado.

Isto pode parecer quando você compartilha um URL no Facebook de um site que não está sendo atualizado com tags de gráfico aberto:

Facebook compartilhar sem tags og

Por outro lado, é assim que se parece quando você compartilha um URL que está implementando meta tags de gráfico aberto:

Facebook compartilhar com og1

Meta tags Open Graph (OG) do Facebook

As meta tags de gráfico aberto do Facebook definem como um site de terceiros (como o seu blog) será apresentado no Facebook.

Embora seja desenvolvido pelo Facebook, meta tags de gráfico aberto também são usadas por outras redes sociais (como Twitter e LinkedIn) para personalizar o compartilhamento que acontece lá.

Para incluir as metatags de gráfico aberto em seu site WordPress, você precisará adicionar tags no do seu site. De acordo com protocolo gráfico aberto, a seguir estão as propriedades necessárias:

  • og: title
  • og: type
  • og: imagem
  • og: url

 

og marca facebook1

Usando gráficos abertos em sites, Neil Patel encontrado um aumento na taxa de cliques em 39%.

Como verificar se há meta tags OG em seu site WordPress?

Consulte o código-fonte do seu site WordPress se você não tiver certeza se as tags og já foram colocadas em seu site. No Windows ou Linux, pressione Ctrl + U e no Mac, pressione Command + Alt + U para visualizar o código-fonte.

Se já estiver sendo adicionado, você encontrará suas tags og no seção dentro do “

og

Além disso, você pode usar o Depurador de Compartilhamento do Facebook ferramenta para ver o que o Facebook está lendo sobre o seu site.

Adicionando meta tags OG ao WordPress sem um plug-in

Para adicionar meta tags og às suas postagens e páginas no WordPress sem usar um plug-in, basta adicionar o seguinte snippet de código ao seu tema functions.php arquivo.

// Adicionando o gráfico aberto na função de atributos de linguagem add_opengraph_doctype ($ output) {return $ output. 'xmlns: og = "https://opengraphprotocol.org/schema/" xmlns: fb = "https://www.facebook.com/2008/fbml"'; } add_filter ('language_attributes', 'add_opengraph_doctype'); // Vamos adicionar a função Open Graph Meta Info add_og_meta_tag () {global $ post; if (! is_singular ()) // se não for um post ou uma página, não adicione tags og return; echo " \ n "; echo ' '. "\ n"; eco ' '. "\ n"; eco ' '. "\ n"; eco ' '. "\ n"; eco ' '. "\ n"; eco '  '. "\ n"; if (! has_post_thumbnail ($ post-> ID)) {// se a postagem não tiver imagem em destaque, use uma imagem padrão $ default_image = "https://example.com/image.jpg"; // substitua por uma imagem padrão em seu servidor ou uma imagem em sua biblioteca de mídia echo ' '; } else {$ thumbnail_src = wp_get_attachment_image_src (get_post_thumbnail_id ($ post-> ID), 'grande'); eco ' '; } echo "\ n \ n ";} add_action ('wp_head', 'add_og_meta_tag', 0);

Certifique-se de alterar "SUA ID DE USUÁRIO" no parte com seu próprio ID de usuário do Facebook.

Você pode encontrar seu ID de usuário do Facebook visitando sua página de perfil do Facebook em um navegador de desktop.

  1. Clique na imagem do seu perfil e selecione “Ver foto do perfil”
  2. Isso abrirá o visualizador de fotos do Facebook para sua foto de perfil.
  3. O URL agora deve ser parecido com isto: “https://www.facebook.com/photo?fbid=xxxxxxxxxxxxxxx&set=a.xxxxxxxxxxxxxxx"
  4. Procure a parte Facebook=xxxxxxxxxxxxxx. Os números após o Facebook parâmetro “xxxxxxxxxxxxxxxx”É o seu ID de usuário.
  5. Copie-o e use-o para substituir “SUA ID DE USUÁRIO” no trecho de código acima.

id de usuário do facebook

Você Terminou! Seu site agora está atualizado com tags de gráfico aberto.

Adicionando meta tags OG ao WordPress com um plugin

Os dois plug-ins populares de SEO, Yoast SEO e Tudo em um bloco de SEO vem com recursos de meta tag de gráfico aberto.

Adicionando tags OG com o plugin Yoast SEO

Primeiro, instale o Yoast SEO. Após a instalação, você deve ver o novo item de SEO no menu da barra lateral esquerda do admin.

Para adicionar tags og com Yoast, vá para SEO > Redes Sociais através do menu da barra lateral de administração.

Quando estiver na página, vá para a guia Facebook.

yoast seo e tag

Por padrão, o Yoast SEO adiciona tags de gráfico aberto às suas postagens prontas para uso. Você não precisa configurar nada. 

No entanto, você precisará configurar as tags og para a página inicial do seu site.

Sob o Configurações da página inicial seção, você pode definir um URL de imagem para sua página inicial. Isso será usado para o og: imagem propriedade da sua página inicial. 

Você também pode adicionar o título e a descrição, que são usados ​​para o og: title e og: descrição propriedades respectivamente.

Finalmente, há o Configurações padrão seção. Isso permite que você defina um URL de imagem padrão que será usado para uma postagem og: imagem propriedade no caso de não haver imagem de destaque definida.

Assim que terminar, não se esqueça de clicar Salvar as alterações para que suas alterações sejam aplicadas.

Configurando Per Post OG Tags com Yoast SEO

Se você quiser definir manualmente as tags og por postagem, você pode fazer isso acessando o editor de postagem e rolando para baixo até a seção Yoast Metabox e indo para o Redes Sociais aba.

yoast por post og tags

Você pode então definir um parâmetro personalizado para várias tags og aqui.

Quando terminar de adicionar suas tags og a um post, certifique-se de salvá-lo, atualizá-lo ou publicá-lo, o que for aplicável, a fim de confirmar as alterações que você fez.

Adicionando tags OG com pacote de SEO tudo em um

Primeiro, instale o All in One SEO Pack. Após a instalação, vá para All in One SEO > Redes Sociais através do menu da barra lateral de administração do seu site. Quando estiver na página, vá para o Facebook aba.

tudo em um seo og tags

Com o All in One SEO Pack, as tags og são adicionadas à sua postagem por padrão, assim como o Yoast.

Existem mais opções configuráveis ​​aqui em comparação com o Yoast, mas algumas estão disponíveis apenas quando você está usando a versão profissional. Nem mesmoless, a quantidade de opções configuráveis ​​na versão gratuita é mais do que suficiente.

  • Imagem de postagem padrão - define qual imagem será usada para uma postagem og: imagem propriedade.
  • Postagem padrão no Facebook - se você selecionar a opção de imagem padrão (definida abaixo) na opção de pós-imagem padrão, é aqui que você carrega a imagem personalizada.
  • Tipos de objeto de tipo de postagem padrão - permite definir um valor padrão para uma postagem, página ou anexo og: type propriedade.
  • Mostrar autor do Facebook - você pode vincular seu perfil do Facebook ao seu site. Habilitar esta opção permite que você vincule uma postagem ao seu perfil do Facebook, permitindo que seus leitores sigam diretamente sua página / perfil do FB. Você pode aprender mais sobre como configurar isso do AIOSEO página de ajuda.
  • Nome do site - permite que você configure quais valores serão usados ​​para uma postagem og: site_name propriedade. Você pode usar tags para gerar dinamicamente o valor para esta propriedade, você também pode adicionar um texto padrão ou pode misturar os dois também, se desejar.

Seguindo os itens acima, há uma seção para configurar as tags og da página inicial do seu site. Debaixo de Configurações da página inicial seção, você pode definir o seguinte:

  • Imagem - para a sua página inicial og: imagem propriedade.
  • Título - para a sua página inicial og: title propriedade. Você pode usar variáveis ​​para gerar isso dinamicamente.
  • Descrição - para a sua página inicial og: descrição propriedade.
  • Tipo de objeto - para a sua página inicial og: type propriedade.

Finalmente, há um Configurações avançadas seção, que permite definir meta tags de gráfico aberto adicionais, como fb: app_id, fb: admins, etc.

Quando estiver satisfeito com sua configuração, não se esqueça de salvar as alterações.

Configurando Por Post OG Tags com All in One SEO Pack

Você pode configurar por post og tags com AIOSEO como Yoast. Vá para o editor de postagem e role para baixo até a metabox AIOSEO e, em seguida, vá para o Redes Sociais aba.

aioseo por post og tags

As opções aqui são semelhantes às discutidas acima. Você pode ir em frente e definir parâmetros personalizados para suas tags og para este post, substituindo quaisquer opções que você definiu nas configurações da AIOSEO.

Quando terminar de adicionar suas tags og a um post, certifique-se de salvá-lo, atualizá-lo ou publicá-lo, o que for aplicável, a fim de confirmar as alterações que você fez.

Isso cobre como adicionar tags og ao seu site WordPress. Esperançosamente, este artigo ajudou você a escolher a melhor abordagem para isso e que você aprendeu um pouco sobre como é importante implementar tags og em seu site.

Se você gostaria de ver mais dicas e truques do WordPress, confira nosso 101 lista de dicas e truques do WordPress.

Baixe a lista de 101 truques do WordPress que todo blogueiro deve saber

101 truques do WordPress

Clique aqui para baixar agora

// Adicionando o gráfico aberto nos atributos de linguagem

function add_opengraph_doctype ($ output) {

return $ output. 'xmlns: og = "https://opengraphprotocol.org/schema/" xmlns: fb = "https://www.facebook.com/2008/fbml"';

}


add_filter ('language_attributes', 'add_opengraph_doctype');


// Vamos adicionar Open Graph Meta Info

function add_og_meta_tag () {


postagem global $;


if (! is_singular ()) // se não for um post ou uma página, não adicione tags og

voltar;

echo " \ n ";

eco ' '. "\ n";

eco ' '. "\ n";

eco ' '. "\ n";

eco ' '. "\ n";

eco ' '. "\ n";

eco ' '. "\ n";


if (! has_post_thumbnail ($ post-> ID)) {// se a postagem não tiver imagem em destaque, use uma imagem padrão

$ default_image = "https://example.com/image.jpg"; // substitua por uma imagem padrão em seu servidor ou uma imagem em sua biblioteca de mídia

eco ' ';

}


else {

$ thumbnail_src = wp_get_attachment_image_src (get_post_thumbnail_id ($ post-> ID), 'grande');

eco ' ';

}


echo "\ n \ n ";

}


add_action ('wp_head', 'add_og_meta_tag', 5);

Sobre o autor
David Attard
David trabalha na indústria online e digital ou em torno dela há 21 anos. Ele tem vasta experiência nas indústrias de software e web design usando WordPress, Joomla e nichos que os cercam. Ele trabalhou com agências de desenvolvimento de software, empresas internacionais de software, agências de marketing locais e agora é Chefe de Operações de Marketing na Aphex Media – uma agência de SEO. Como consultor digital, seu foco é ajudar as empresas a obter uma vantagem competitiva usando uma combinação de seus sites e plataformas digitais disponíveis atualmente. Sua combinação de experiência em tecnologia combinada com uma forte visão de negócios traz uma vantagem competitiva aos seus escritos.

Mais uma coisa... Você sabia que as pessoas que compartilham coisas úteis como esta postagem também parecem FANTÁSTICAS? ;-)
. deixe um útil comente com suas ideias, depois compartilhe com seu (s) grupo (s) do Facebook, que considerariam isso útil e vamos colher os benefícios juntos. Obrigado por compartilhar e ser legal!

Divulgação: Esta página pode conter links para sites externos de produtos que amamos e recomendamos de todo o coração. Se você comprar produtos que sugerimos, podemos receber uma taxa de referência. Essas taxas não influenciam nossas recomendações e não aceitamos pagamentos por análises positivas.

Autor (es) em destaque em:  Logotipo da revista Inc   Logotipo do Sitepoint   Logotipo do CSS Tricks    logotipo do webdesignerdepot   Logotipo WPMU DEV   e muitos mais ...