Lo primero que se debe hacer para poner la caja de comentarios en una entrada a través de facebook es conseguir su código, para ello, deben ir a esta página Aplicaciones para Facebook Recuerden que todo el procedimiento se debe hacer con una cuenta de usuario (El usuario de la cta de sus páginas de facebook).
Crear el código es muy sencillo, introducen la URL de su página, luego el número de comentarios que quieren que sean visibles, el ancho de la caja de los comentarios, y el color (claro u oscuro), luego hacen clic sobre el botón "Get Code" (Obtener el código) y listo.
Ahora, el que nos interesa es el primero, uno largo, ya que el segundo debemos cambiarlo, porque si lo dejamos como viene nos saldrá un mismo comentario en todas las entradas, y además se agregarán comentarios de otras páginas que se hayan realizado en la fecha en la que se publicó el tema.
El primer código debemos colocarlo debajo de la etiqueta:
crtl + f: el buscador
------------------------------
------------------------------
<body>
o
<body expr:class='"loading" + data:blog.mobileClass'>
------------------------------
La ruta sería: Plantilla / Editar HTML
Ahora como les comenté anteriormente, vamos a cambiar el segundo código, usen este: [más adelante está con el código condicional para que la caja de comentarios se muestre solo en las entradas si lo prefieren así].
<div id='comentariosFacebook'>
<div class='fb-comments' data-colorscheme='dark' data-num-posts='5' data-width='500' expr:href='data:post.url'/>
</div>
En amarillo está el color, pueden dejar dark para oscuro o light para claro, en verde está el número de comentarios, y en rojo está el ancho de la caja de comentarios.
Pero debemos agregar un código más para que los comentarios se vean solo en las entradas o temas específicos, ya que si lo dejamos así como está, el código aumentaría el tiempo de carga de la página principal en 1 o 2 segundos. El código final quedaría así:
------------------------------
<b:if cond='data:blog.pageType == "item"'>
<div id='comentariosFacebook'>
<div class='fb-comments' data-colorscheme='dark' data-num-posts='5' data-width='500' expr:href='data:post.url'/>
</div>
</b:if>
------------------------------
Este código debemos colocarlo debajo del código donde se encuentra ubicada la siguiente parte, les muestro varias formas como puede salir su inicio o primera línea, con las imágenes de más adelante se guiarán mejor:
------------------------------
<div class='post-share-buttons'><div class='post-share-buttons goog-inline-block'>
<div class='post-share-buttons goog-inline-block' style='padding:0 0 0 1px;margin:0;'>
------------------------------
La ruta sería: Plantilla / Editar HTML
Video tutorial Nuevo diseño Plantilla de Blogger
Pueden colocar en el buscador (Control + F): post-share-buttons
y verán opciones del lugar donde podría estar este código, la mayoría de veces sale en la parte del "quick edit pencil" pero también puede salir en otra, como: <div class='post-footer'> eso depende de la plantilla. Con las imágenes lo entenderán mejor ;)
