Veja como deixar os links do seus posts do Blogger com o título, resumo e imagem no Twitter. Para isto, basta apenas adicionar algumas tags no Template do seu blog do Blogspot/Blogger.
Se você é usuário constante do Twitter e já compartilhou alguns do seus posts por lá, deve ter percebido como a exibição deles ficar feio por lá, não é mesmo? Fica apenas o link, diferente como aparece no Facebook, com imagem, título e resumo.
Mas, pra alegriada gente, há um jeito de pôr metatags do Twitter no nosso blog. O processo é bem simples.
1.1 Entre no Painel do seu blog, vá em Modelos, depois em Editar HTML.
Mas, pra alegriada gente, há um jeito de pôr metatags do Twitter no nosso blog. O processo é bem simples.
Criando o Card Types (Cartão de Resumo)
1.1 Entre no Painel do seu blog, vá em Modelos, depois em Editar HTML.
1.2 Clique em qualquer área dentro do editor, aperte Ctrl+F para abrir o buscador e pesquise por <head> ou </head>. Note que o código que vamos colar a seguir deve estar dentro dessa tag.
<head>
...
código
...
</head>
1.3 Cole o seguinte código:
<meta content='summary_large_image' name='twitter:card'/>
<meta content='@masqueseyo' name='twitter:site'/>
<meta content='@joanir007' name='twitter:creator'/>
<meta expr:content='data:blog.homepageUrl' name='twitter:domain'/>
<b:if cond='data:blog.pageType == "item"'>
<meta expr:content='data:blog.canonicalUrl' name='twitter:url'/>
<meta expr:content='data:blog.pageName' name='twitter:title'/>
<meta expr:content='data:blog.postImageUrl' name='twitter:image:src'/>
<b:else/>
<meta expr:content='data:blog.homepageUrl' name='twitter:url'/>
<meta expr:content='data:blog.pageTitle' name='twitter:title'/>
<meta content='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj4gsj3-ammTiDNIeD21kcJZUP0Gd-1o7QO2L73QySqZU1WyvuATiiatpn55fpXNxzeKRzb6SLm9XA1NG3th6fj5zOtAIQyx-WAjTQWTF1C8bpxYEemqvkNdIBCYvPzcxB95Si_SteMOccJ/s1600/mqsy-logo.png' name='twitter:image:src'/>
</b:if>
<b:if cond='data:blog.metaDescription'>
<meta expr:content='data:blog.metaDescription' name='twitter:description'/>
</b:if>
<meta expr:content='data:blog.canonicalUrl' name='twitter:url'/>
<meta content='@masqueseyo' name='twitter:site'/>
<meta content='@joanir007' name='twitter:creator'/>
<meta expr:content='data:blog.homepageUrl' name='twitter:domain'/>
<b:if cond='data:blog.pageType == "item"'>
<meta expr:content='data:blog.canonicalUrl' name='twitter:url'/>
<meta expr:content='data:blog.pageName' name='twitter:title'/>
<meta expr:content='data:blog.postImageUrl' name='twitter:image:src'/>
<b:else/>
<meta expr:content='data:blog.homepageUrl' name='twitter:url'/>
<meta expr:content='data:blog.pageTitle' name='twitter:title'/>
<meta content='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj4gsj3-ammTiDNIeD21kcJZUP0Gd-1o7QO2L73QySqZU1WyvuATiiatpn55fpXNxzeKRzb6SLm9XA1NG3th6fj5zOtAIQyx-WAjTQWTF1C8bpxYEemqvkNdIBCYvPzcxB95Si_SteMOccJ/s1600/mqsy-logo.png' name='twitter:image:src'/>
</b:if>
<b:if cond='data:blog.metaDescription'>
<meta expr:content='data:blog.metaDescription' name='twitter:description'/>
</b:if>
<meta expr:content='data:blog.canonicalUrl' name='twitter:url'/>
1.4 Observe as partes destacadas. Faremos as seguintes alterações:
- Caso queira que a imagem fique pequena, substitua essa linha por
- Substitua pelo Twitter do seu blog. Caso ele não tenha, você pode remover essa linha.
- Substitua pelo seu Twitter.
- Substitua pela imagem do seu blog, ou seja, a imagem do cabeçalho ou alguma que o caracterize.
1.5 Salve o seu template.
1.6 Agora, acesse o Card Validator, cole o link do seu blog e clique em Preview Card.
Pronto, agora basta esperar um pouco. Pode levar até dois dias para o Twitter validar tudo.
- Caso queira que a imagem fique pequena, substitua essa linha por
<meta name="twitter:card" content="summary" />- Substitua pelo Twitter do seu blog. Caso ele não tenha, você pode remover essa linha.
- Substitua pelo seu Twitter.
- Substitua pela imagem do seu blog, ou seja, a imagem do cabeçalho ou alguma que o caracterize.
1.5 Salve o seu template.
1.6 Agora, acesse o Card Validator, cole o link do seu blog e clique em Preview Card.
 |
| Clique em Preview card para validar o seu Blog |
Pronto, agora basta esperar um pouco. Pode levar até dois dias para o Twitter validar tudo.
Algumas considerações
Para que tudo funcione direitinho, você tem que levar algumas coisas em consideração:
2.1 Adicionar um título não muito grande ao seus posts (no máximo, 70 caracteres).
2.2 Adicionar um resumo ou descrição do seu post (no máximo, 200 caracteres). Para fazer isso, no editor do post, clique em Descrição da pesquisa e adicione um resumo.
2.3 Sempre adicione uma imagem ao seu post.
Quer ajudar o nosso blog?
Este tutorial foi útil pra você? Te ajudou a melhorar o seu blog? Então nos ajude também, dê like, comente e compartilhe este post. Ah, e deixe também sua doação em dinheiro:
FAÇA SUA DOAÇÃO ONLINE CLICANDO AQUI
FAÇA SUA DOAÇÃO ONLINE CLICANDO AQUI
Pronto! Chegamos ao final de mais um post. Se você quiser ler mais sobre isso, pode conferir os documentos do Twitter Card Types, fonte deste tutorial. Qualquer dúvida ou sugestão de tema, basta comentar. Até a próxima!!
