Como inserir o Twitter Card no Blogger
Você já se deparou com a situação de compartilhar um link no seu twitter e ele mostrar um conteúdo estranho totalmente bagunçado?
Isto acontece porque você não sabia como inserir o Twitter Card no seu blogger.
O recurso que vou ensinar hoje, vai permitir compartilhar conteúdo da forma correta no twitter gerando um público maior para seu site e até ganhar seguidores para seu blogger no twitter usando o twitter card.
Veja a imagem dos resultados do twitter card ANTES / DEPOIS da alteração:
<!--INÍCIO DO CÓDIGO TWITTER CARD-->
<meta content='summary_large_image' name='twitter:card' />
<b:if cond='data:blog.metaDescription'>
<meta expr:content='data:blog.metaDescription' property='twitter:description'
/>
<b:else/>
<meta expr:content='"Acesse o site " + data:blog.title + " para ver o conteúdo completo ."'
property='twitter:description' />
</b:if>
<meta expr:content='data:blog.homepageUrl' name='twitter:site' />
<meta content='@darlan_efc' name='twitter:creator' />
<b:if cond='data:blog.pageType == "index"'>
<meta expr:content='data:blog.title' name='twitter:title' />
<meta expr:content='data:post.firstImageUrl' property='twitter:image' />
</b:if>
<b:if cond='data:blog.pageType != "index"'>
<meta expr:content='data:blog.pageName + " : " + data:blog.title' name='twitter:title' />
<b:if cond='data:blog.postImageUrl'>
<meta expr:content='data:blog.postImageUrl' name='twitter:image' />
</b:if>
</b:if>
<meta expr:content='data:blog.pageTitle' name='twitter:image:alt' />
<!--FIM DO CÓDIGO TWITTER CARD-->
E seu código final deverá aparecer desta forma repare no head destacado em azul e o código em vermelho.
Isto acontece porque você não sabia como inserir o Twitter Card no seu blogger.
O recurso que vou ensinar hoje, vai permitir compartilhar conteúdo da forma correta no twitter gerando um público maior para seu site e até ganhar seguidores para seu blogger no twitter usando o twitter card.
Veja a imagem dos resultados do twitter card ANTES / DEPOIS da alteração:
São quatro passos simples para ativar o twitter card no blogger
- Faça Backup do seu template (Clique aqui se não souber como).
- Encontre a tag <Head> na guia model/editar html do seu blogger.
- Copie o código abaixo e altere o campo em vermelho substituindo o usuário pelo seu
usuário do twitter. - Cole tudo abaixo da tag <head> ou seja entre as tags <head> e </head>.
<!--INÍCIO DO CÓDIGO TWITTER CARD-->
<meta content='summary_large_image' name='twitter:card' />
<b:if cond='data:blog.metaDescription'>
<meta expr:content='data:blog.metaDescription' property='twitter:description'
/>
<b:else/>
<meta expr:content='"Acesse o site " + data:blog.title + " para ver o conteúdo completo ."'
property='twitter:description' />
</b:if>
<meta expr:content='data:blog.homepageUrl' name='twitter:site' />
<meta content='@darlan_efc' name='twitter:creator' />
<b:if cond='data:blog.pageType == "index"'>
<meta expr:content='data:blog.title' name='twitter:title' />
<meta expr:content='data:post.firstImageUrl' property='twitter:image' />
</b:if>
<b:if cond='data:blog.pageType != "index"'>
<meta expr:content='data:blog.pageName + " : " + data:blog.title' name='twitter:title' />
<b:if cond='data:blog.postImageUrl'>
<meta expr:content='data:blog.postImageUrl' name='twitter:image' />
</b:if>
</b:if>
<meta expr:content='data:blog.pageTitle' name='twitter:image:alt' />
<!--FIM DO CÓDIGO TWITTER CARD-->
Qualquer dúvida estarei a disposição!
ResponderExcluirLike your Site and Thanks for Reaching out to my site at http://timeandupdate.com
ResponderExcluirI'm glad you liked my site.
ExcluirI do not speak your language, I went to your site using the google translator.
Me too use google translation for your site and find articles really useful. I had no idea about twitter card for Blogger. i had just used for static html site. Thanks for this post too.
Excluir