Facebook open Graph como configurar o Tamanho da imagem Correta para compartilhar

facebook open graph como configurar


Hoje vamos compartilhar com você facebook open graph em uma versão melhor isso se da quando alguém compartilha um post do blog no facebook para criar melhor impacto e obter mais atenção é preciso que isso seja ajustado embora algumas vezes pode ser que a figura apareça um pouco menor então vamos definir valores afim de tornar isso mais atraente 1200x630 pixels para alta resolução e 600x315 pixels para compartilhamento no facebook veja as imagens abaixo:


facebook-open-graph-share-image

Facebook open share graphic for generate impact

Então faça login no Blogger va no menu tema então editar HTML com as teclas combinadas CTRL+F busque por 
<meta expr:content='data:blog.postImageThumbnailUrl' property='og:image'/> 

Em seguida coloque o seguinte código na parte inferior direita 

<meta property="og:image:width" content="600" />
 <meta property="og:image:height" content="315" />

Salve e pronto 


Quando isso é combinado Facebook+ Twitter vai ver o seguinte código 

<!-- Facebook and Twitter Open Graph -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<meta content='ID GROUP FACEBOOK' property='fb:app_id'/>
<meta content='ID FACEBOOK ADMIN' property='fb:admins'/>
<b:if cond='data:blog.url'>
<meta expr:content='data:blog.url' property='og:url'/>
</b:if>
<meta expr:content='data:blog.title' property='og:site_name'/>
<b:if cond='data:blog.pageName'>
<meta expr:content='data:blog.pageName' property='og:title'/>
</b:if>
<meta content='website' property='og:type'/>
<b:if cond='data:blog.postImageThumbnailUrl'>
<meta expr:content='data:blog.postImageThumbnailUrl' property='og:image'/>
<meta property="og:image:width" content="600" />
<meta property="og:image:height" content="315" />
</b:if>
<meta expr:content='data:blog.title' name='twitter:site'/>
<meta content='summary_large_image' name='twitter:card'/>
<meta content='TWITTER ADMIN' name='twitter:creator'/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:if cond='data:blog.postImageThumbnailUrl'>
<link expr:href='data:blog.postImageThumbnailUrl' rel='image_src'/>
</b:if>
</b:if>
</b:if>



Click to comment