solución error url en botón compartir facebook en blogger

Cuando instale los plugin social de facebook en mi blog personal, note que el botón compartir (este botón: https://developers.facebook.com/docs/plugins/share-button ) de facebook, al momento de compartir presentaba 3 problemas:

1: No compartir la url del post especifico que quería compartir, sino que presentaba la url principal TUBLOG.blogspot.com   esta situación genera que se pierda la indexación de tus post, pues no hay nada más molesto que se anuncie en la red social una noticia en particular y lo envié a la pagina principal de la web a la que ingresamos, obviamente muy pocas personas dedicaran su tiempo a buscar el post que le intereso y por el cual ingreso a nuestra blog.



2: Por cosas de facebook que no sabría explicarles a algunos pocos posts si se compartían con la url correcta, pero en la visual de la entrada de facebook presentaba una apariencia de error 404, lo cual provoca que nadie le de click a este link.

3. (este sucede tanto con los botones de compartir que uno le instala como los que tiene por default blogger al final de cada post) Las imágenes que utiliza en la acción compartir no correspondían a las publicadas en el post, sino que presentaba muchas veces imágenes que uno utiliza para indexar otros link, generalmente en los widgets javascript y html que le hemos insertado a nuestro blog.

La soluciones:

1. Cuando creamos nuestro botón en la sección de developers de facebook, este nos pide escribir nuestra url del blog para generar el código que ingresaremos a nuestra plantilla en la edición html de blogger y en la creación de nuestro widget. Pero lo que tenemos que tener claro es que facebook pide nuestra url del blog para generar el codigo en especial el script el cuenta con un codigo de identificación que facebook automáticamente lee, por ello para solucionar el error de las url inserten en su widget el codigo pero sin la url en el href="" es decir:

<div class="fb-share-button" data-href=""></div>

pues ya desde el script, facebook sabe que se trata de nuestra url, por lo que mantenerla ahí se convierte en una redundancia y a la hora de compartir el post, lo que sucede es que suma la url del post más la principal, presentando por ende el error 404.

y para la solución de los siguientes dos errores, iniciare diciéndoles que esta solución la encontré en el siguiente link
http://www.baseecho.com/2014/02/cambiar-imagen-al-compartir-en-facebook.html

la cual la resumiré diciéndoles que coloquen en el head de su html el siguiente código:


(A este código solo le hice un cambio en relación con las fotos dejare en un color amarillo la linea original y en un color azul mi linea, la diferencia entre estas es que yo invoco son las fotografías de los post, pues como los tiene los compañeros de baseecho, solo comparten las imágenes principales de su blog, es decir el de portada o su logo, esto ya les queda a su decisión dependiendo de las necesidades que tengan, si estan en proceso de consolidar una marca o un logo dejen el código como esta en amarillo)



<b:if cond='data:blog.pageType == &quot;item&quot;'>

<meta expr:content='data:blog.pageName' property='og:title'/>

<meta expr:content='data:blog.canonicalUrl' property='og:url'/>

<meta content='article' property='og:type'/>

</b:if>

<meta expr:content='data:blog.title' property='og:site_name'/>

<b:if cond='data:blog.postImageThumbnailUrl'>

<meta expr:content='data:blog.postImageThumbnailUrl' property='og:image'/>

<b:else/>

<meta content='url_imagen_principal_blog' property='og:image'/>

<meta content='url_imagen_post' property='og:image'/>

</b:if>

<b:if cond='data:blog.metaDescription != &quot;&quot;'>

<meta expr:content='data:blog.metaDescription' name='og:description'/>

</b:if>

Share on Google Plus

About frederman