Ao criar e publicar um post social no HubSpot, a rede social correspondente tentará gerar uma visualização de imagem para seu post. Com base no link que você inseriu para o post, a rede social vai examinar as metatags no código fonte da sua página e rastrear o arquivo robots.txt do seu site.
Se você estiver hospedando seu site em um provedor externo, como o WordPress, e a visualização da sua publicação não aparecer como esperado, siga as instruções abaixo.
Um arquivo robots.txt informa aos mecanismos de pesquisa como indexar seu site. Se você não tiver adicionado ou configurado seu arquivo robots.txt corretamente, redes sociais não poderão analisar o conteúdo das suas páginas. Facebook e X fornecem as cadeias de caracteres do agente de usuário que é necessário adicionar ao ficheiro robots.txt:
User-agent: facebookexternalhit
Disallow:
User-agent: Twitterbot
Disallow:
O LinkedIn não fornece documentação para sua string de agente do usuário, mas você pode usar o inspetor de post do LinkedIn para confirmar se o LinkedIn pode rastrear o conteúdo do seu site.
Os mecanismos de pesquisa e redes sociais analisarão a seção do cabeçalho do seu HTML para procurar o metadados necessário para gerar uma visualização da página. Deve incluir os metadados para o Facebook e X depois das suas meta tags principais:
<!-- Primary Meta Tags -->
<title>Meta Tags — Preview, Edit and Generate</title>
<meta name="title" content="Meta Tags — Preview, Edit and Generate">
<meta name="description" content="With Meta Tags you can edit and experiment with your content then preview how your webpage will look on Google, Facebook, Twitter and more!">
<!-- Open Graph / Facebook -->
<meta property="og:type" content="website">
<meta property="og:url" content="https://example.com">
<meta property="og:title" content="Title of your Website Page">
<meta property="og:description" content="Description of your Website Page">
<meta property="og:image" content="https://example.com/image.png">
<!-- Twitter -->
<meta property="twitter:card" content="summary_large_image">
<meta property="twitter:url" content="https://example.com/">
<meta property="twitter:title" content="Title of your Website Page">
<meta property="twitter:description" content="Description of your Website Page">
<meta property="twitter:image" content="https://example.com/image.png">Preencha os atributos de conteúdo para cada uma das metatags acima com os valores correspondentes para sua página. Pode validar as suas meta-etiquetas utilizando a ferramenta de depuração do Facebook , o validador de cartões X e o inspetor de posts do LinkedIn .
Se a imagem em destaque de um link que inseriu não estiver a ser apresentada corretamente na pré-visualização social (por exemplo, a imagem está cortada ou a proporção está incorrecta), poderá ser necessário editar a imagem para que tenha as dimensões correctas para a rede social em que está a publicar e, em seguida, voltar a publicar a página. Se você estiver publicando no Facebook, pode aprender mais sobre os requisitos de imagem em destaque em sua documentação.
As seguintes dimensões são recomendadas para otimização da imagem em destaque em cada rede:
Certifique-se de que qualquer mídia incluída em seus posts sociais sigam as diretrizes de tamanho de arquivo para cada rede. Se a HubSpot determinar que um arquivo é muito grande para publicar em uma determinada rede, um aviso será exibido. O tamanho máximo de arquivo para cada rede social está listado abaixo:
Os perfis de cores incorporados podem afetar a forma como a imagem em destaque é exibida no post social. Os sistemas processam perfis de cores fora do comum de maneiras diferentes, e é por isso que as cores podem parecer diferentes ao visualizar a imagem no gerenciador de arquivos. Pode executar o URL da sua imagem através de uma ferramenta externa para ver se está a utilizar um perfil de cor invulgar. Se necessário, você pode remover o perfil de cores com interferência em uma ferramenta de edição de fotos como o Photoshop e republicar a página antes de publicar os posts sociais.
O gerenciador de arquivos da HubSpot usa a compactação de imagem em JPEGs e PNGs para ajudar a otimizar as velocidades de carregamento do seu conteúdo hospedado na HubSpot. As redes de mídias sociais também usam compressão de imagem nos posts, mas a qualidade pode variar em relação à compressão usada pelo HubSpot. Por isso, é recomendável usar imagens com resolução relativamente alta (na relação de aspecto recomendada) para cada rede. Se a imagem não estiver em conformidade com os requisitos de uma rede social, um aviso será exibido na ferramenta de publicação social do HubSpot para ajudá-lo a ajustar sua imagem.
Se você ainda encontrar problemas com as visualizações do link não aparecendo corretamente, confira nosso guia de solução de problemas.