Twitter cards
Os "Twitter Cards" são um recurso da plataforma de mídia social Twitter que permite aos usuários anexar mídia rica, como imagens, vídeos e outros conteúdos interativos, aos seus tweets. Quando um usuário compartilha um link no Twitter que possui marcação de "Twitter Card", o conteúdo associado é exibido diretamente no tweet, tornando-o mais atraente e visualmente interessante.
Existem vários tipos de "Twitter Cards" disponíveis:
- Summary Card:
Este é o tipo de cartão padrão e exibe uma prévia do conteúdo vinculado, incluindo o título, descrição e imagem em miniatura. - Summary Card with Large Image:
Semelhante ao Summary Card, mas com uma imagem maior exibida de forma proeminente. - App Card:
Este tipo de cartão é especificamente projetado para promover aplicativos móveis. Ele inclui o nome do aplicativo, descrição, ícone e outros detalhes relevantes. - Player Card:
Os Player Cards são usados para incorporar vídeos, clipes de áudio ou outros reprodutores de mídia diretamente no tweet. - Gallery Card:
Os Gallery Cards permitem que você exiba várias imagens em um formato de carrossel deslizável. - Product Card:
Este tipo de cartão é adequado para promover produtos. Ele inclui informações como nome do produto, descrição, preço e um botão opcional "Comprar Agora".
Para usar os "Twitter Cards", é necessário adicionar marcação específica ao código HTML do seu site. O Twitter fornece documentação e diretrizes sobre como implementar cada tipo de cartão, incluindo as tags e propriedades meta necessárias. Uma vez que você tenha adicionado a marcação, o mecanismo de busca do Twitter detectará automaticamente e exibirá o cartão apropriado quando os links do seu site forem compartilhados na plataforma.
É importante observar que os "Twitter Cards" estão sujeitos às políticas e diretrizes da plataforma do Twitter. É recomendável revisar a documentação deles e se manter atualizado sobre quaisquer mudanças ou novos recursos que eles introduzirem.
Veja os principais cards do twiter
<meta name="twitter:card" content="summary_large_image" />A tag <meta name="twitter:card" content="summary_large_image" /> é utilizada para definir o tipo de cartão do Twitter que será exibido quando um link for compartilhado. No caso específico do código fornecido, o valor "summary_large_image" indica que o cartão a ser exibido será do tipo "Summary Card with Large Image", ou seja, um cartão de resumo com uma imagem grande. Isso significa que, ao compartilhar o link correspondente, o tweet será exibido com uma imagem de destaque, juntamente com o título e a descrição relacionados ao conteúdo vinculado.
<meta name="twitter:site" content="@site" />A tag <meta name="twitter:site" content="@site" /> é usada para especificar a conta do Twitter associada ao website. O valor "@site" deve ser substituído pelo nome de usuário (handle) da conta do Twitter que você deseja vincular ao site.
Ao adicionar essa meta tag ao código HTML do seu site, você está informando ao Twitter qual conta deve ser mencionada quando o link do seu site for compartilhado. Isso pode ajudar a direcionar o tráfego e notificar a conta associada sobre a atividade e engajamento relacionados ao conteúdo do seu site. Certifique-se de substituir "@site" pelo nome de usuário correto da conta do Twitter que você deseja vincular.
<meta name="twitter:title" expr:content="data:view.title.escaped" />A tag <meta name="twitter:title" expr:content="data:view.title.escaped" /> é usada para definir o título do conteúdo que será exibido quando um link do seu site for compartilhado no Twitter. A expressão data:view.title.escaped é usada para extrair o título da página atual do seu site e inseri-lo dinamicamente como o valor do atributo "content" da meta tag.
Essa tag permite que o Twitter mostre o título correto do conteúdo ao compartilhar o link, proporcionando uma descrição mais precisa do que está sendo compartilhado. Certifique-se de que seu site esteja configurado corretamente para fornecer o título adequado da página atual e que a expressão data:view.title.escaped esteja corretamente implementada para capturar esse título e inseri-lo na tag meta.
<meta name="twitter:title" content="Título do seu conteúdo" />A tag <meta name="twitter:title" content="Título do seu conteúdo" /> é utilizada para definir o título do conteúdo que será exibido quando um link do seu site for compartilhado no Twitter. Neste caso, o valor "Título do seu conteúdo" deve ser substituído pelo título específico do seu conteúdo.
Ao adicionar essa meta tag ao código HTML do seu site, você está informando ao Twitter qual título deve ser exibido ao compartilhar o link correspondente. Isso permite que os usuários do Twitter vejam o título do seu conteúdo de forma clara e concisa, o que pode ajudar a atrair a atenção e o interesse deles. Certifique-se de substituir "Título do seu conteúdo" pelo título apropriado do seu próprio conteúdo.
<meta name="twitter:creator" content="@autor" />A tag <meta name="twitter:creator" content="@autor" /> é utilizada para especificar o nome de usuário (handle) do autor ou criador do conteúdo que está sendo compartilhado no Twitter.
Ao adicionar essa meta tag ao código HTML do seu site, você está informando ao Twitter qual é o nome de usuário do autor associado ao conteúdo. Isso permite que o Twitter mencione o autor na publicação do tweet quando o link for compartilhado. Certifique-se de substituir "@autor" pelo nome de usuário correto do autor do conteúdo que você deseja vincular.
<meta name="twitter:image:src" content="https://logo do blog" />A tag <meta name="twitter:image:src" content="https://logo do blog" /> é usada para especificar a imagem que será exibida quando um link do seu site for compartilhado no Twitter. No caso específico do código fornecido, o valor "https://logo do blog" deve ser substituído pela URL da imagem que você deseja usar como a imagem representativa do conteúdo compartilhado.
Ao adicionar essa meta tag ao código HTML do seu site, você está informando ao Twitter qual imagem deve ser exibida ao compartilhar o link correspondente. Essa imagem pode ser o logotipo do seu blog ou uma imagem relacionada ao conteúdo específico que está sendo compartilhado. Certifique-se de substituir "https://logo do blog" pela URL correta da imagem que você deseja utilizar.
<meta property="og:url" content="https://seusite.com" />A tag <meta property="og:url" content="https://seusite.com" /> é usada para especificar a URL canônica do seu site quando compartilhado em plataformas que suportam Open Graph (OG), como o Facebook.
Ao adicionar essa meta tag ao código HTML do seu site, você está informando ao Facebook e outras plataformas que suportam Open Graph qual é a URL principal do seu site. Isso ajuda a garantir que o link compartilhado seja associado corretamente ao conteúdo original e pode melhorar a consistência e precisão das informações compartilhadas nas redes sociais.
Certifique-se de substituir "https://seusite.com" pela URL canônica correta do seu site, de modo que a plataforma identifique corretamente o link associado ao conteúdo que você deseja compartilhar.
<meta property=”og:title” content=”Título da página” />A tag <meta property="og:title" content="Título da página" /> é utilizada para definir o título do conteúdo quando ele é compartilhado em plataformas que suportam Open Graph (OG), como o Facebook.
Ao adicionar essa meta tag ao código HTML do seu site, você está informando ao Facebook e outras plataformas compatíveis qual é o título do conteúdo a ser exibido quando o link é compartilhado. Isso garante que o título correto seja exibido ao compartilhar o link, proporcionando uma descrição mais precisa do conteúdo em questão.
Certifique-se de substituir "Título da página" pelo título adequado da página que está sendo compartilhada, para que a plataforma identifique corretamente o título associado ao conteúdo que você deseja compartilhar.
<meta property=”og:type” content=”article” />A tag <meta property="og:type" content="article" /> é usada para especificar o tipo de conteúdo do Open Graph (OG) quando um link é compartilhado em plataformas que suportam essa funcionalidade, como o Facebook.
Ao adicionar essa meta tag ao código HTML do seu site, você está informando ao Facebook e outras plataformas que o tipo de conteúdo sendo compartilhado é um "artigo". Isso ajuda a fornecer informações adicionais sobre o tipo de conteúdo ao algoritmo das plataformas de mídia social, permitindo que elas apresentem o conteúdo de maneira mais apropriada, como mostrar um botão "Ler mais" ou exibir metadados específicos para artigos.
Certifique-se de que a tag esteja inserida corretamente no código HTML do seu site, se você deseja identificar o conteúdo como um artigo.
<meta property=”og:image” content=”https://example.com/image.jpg” />A tag <meta property="og:image" content="https://example.com/image.jpg" /> é usada para especificar a imagem destacada que será exibida quando um link do seu site for compartilhado em plataformas que suportam o Open Graph (OG), como o Facebook.
Ao adicionar essa meta tag ao código HTML do seu site, você está informando ao Facebook e outras plataformas que suportam o OG qual é a URL da imagem que deve ser exibida como a imagem representativa do conteúdo compartilhado. Certifique-se de substituir "https://example.com/image.jpg" pela URL correta da imagem que você deseja utilizar.
A imagem especificada na tag og:image geralmente é exibida como uma miniatura ou em destaque juntamente com o link compartilhado, ajudando a atrair a atenção dos usuários e fornecendo uma representação visual do conteúdo.
<meta property=”og:description” content=”Descrição da Página” />A tag <meta property="og:description" content="Descrição da Página" /> é usada para especificar a descrição do conteúdo quando ele é compartilhado em plataformas que suportam o Open Graph (OG), como o Facebook.
Ao adicionar essa meta tag ao código HTML do seu site, você está informando ao Facebook e outras plataformas que suportam o OG qual é a descrição do conteúdo a ser exibida quando o link é compartilhado. Isso ajuda a fornecer aos usuários uma visão geral do conteúdo antes de clicarem no link.
Certifique-se de substituir "Descrição da Página" pela descrição adequada da página que está sendo compartilhada, de forma que a plataforma identifique corretamente a descrição associada ao conteúdo que você deseja compartilhar.
<meta name="twitter:label1" content="Escrito por" />A tag <meta name="twitter:label1" content="Escrito por" /> é usada para definir o rótulo do primeiro campo personalizado no cartão do Twitter. Esse campo personalizado é usado para fornecer informações adicionais sobre o tweet, como o autor ou criador do conteúdo.
Ao adicionar essa meta tag ao código HTML do seu site, você está informando ao Twitter que o primeiro campo personalizado no cartão do Twitter deve ser rotulado como "Escrito por". Essa informação pode ser exibida ao lado do tweet para fornecer contexto adicional aos usuários.
Certifique-se de que essa meta tag esteja corretamente implementada no seu código HTML e que o rótulo "Escrito por" seja apropriado para o contexto do seu conteúdo.
<meta name="twitter:data1" content="Redator Rock Content" />A tag <meta name="twitter:data1" content="Redator Rock Content" /> é usada para definir o valor do primeiro campo personalizado no cartão do Twitter. Esse campo personalizado é usado para fornecer informações adicionais sobre o tweet, como o autor ou criador do conteúdo.
Ao adicionar essa meta tag ao código HTML do seu site, você está informando ao Twitter qual é o valor a ser exibido no primeiro campo personalizado no cartão do Twitter. No exemplo dado, o valor "Redator Rock Content" será exibido como o valor do primeiro campo personalizado.
Certifique-se de que essa meta tag esteja corretamente implementada no seu código HTML e que o valor "Redator Rock Content" seja substituído pela informação correta relacionada ao autor ou criador do conteúdo do tweet.
Gospel LifeConsulte também:
Meu TédioDá trabalho pra fazer. Vale um PIX? - PIX: 17191653604
