Tutorial: Cómo agregar comentarios de Facebook en Blogger

linuxer Seguir

Gamma
Verificación en dos pasos desactivada
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
1 May 2012
Mensajes
153
He decidido poner comentarios de Facebook en mis blogger por dos motivos
1)Cuando alguien comenta aparece en su muro
2)Los visitantes suelen estar ya con el login hecho

He terminado haciéndome un pequeño código javascript para la API de Facebook para que se muestre el correspondiente a cada post, lo comparto aquí

En Plantilla -> Editar Html , y marcamos "Expandir plantilla de artilugios"

Luego dentro del <body>, justo debajo copiamos esto

Insertar CODE, HTML o PHP:
&lt;!-- FACEBOOK SDK EMPIEZA --&gt;
&lt;div id=&quot;fb-root&quot;&gt;&lt;/div&gt;
&lt;script&gt;(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = &quot;//connect.facebook.net/es_ES/all.js#xfbml=1&quot;;
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));&lt;/script&gt;
&lt;!-- FACEBOOK SDK ACABA --&gt;

Luego buscamos la línea
<div class='post-footer'>

nos deben salir dos coincidencias, solo interesa la primera y justo encima pegamos esto

Insertar CODE, HTML o PHP:
<!-- FACEBOOK COMENTARIOS EMPIEZA -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='currentUrll' style='display:none'><data:post.url/></div>
<br/><br/>
<script>
var urll=document.getElementById(&quot;currentUrll&quot;).innerHTML;
document.write(&quot;<div class='fb-comments' data-colorscheme='dark' data-href='&quot;+urll+&quot;' data-num-posts='5' data-width='640'/>&quot;);
</script>
</b:if>
<!-- FACEBOOK COMENTARIOS ACABA -->

si nuestro blog es blanco quitamos lo que dice: data-colorscheme='dark'

si queremos mostrar mas o menos de cinco cambiamos el número de: data-num-posts='5'

dependiendo del ancho del blog cambiamos: data-width='640'

yo siempre que añado código a la plantilla suelo separarlo varias líneas vacías antes y después para encontrarlo fácilmente

y hecho, si os funciona :encouragement:
 
Última edición:

Carlos Arreola

Admin
Sigma
Verificado
Verificación en dos pasos activada
Verificado por Whatsapp
Verificado por Binance
¡Excelente comerciante!
Suscripción a IA
Desde
6 Abr 2009
Mensajes
11.327
Tutorial aprobado y agregado al listado, se agradece el aporte.
 

JuanDRomero

Eta
SEO
Verificación en dos pasos desactivada
Desde
14 Ago 2011
Mensajes
1.461
Hola amigo, acabo de intentar agregarlo a un sitio y no me sale, el sitio es Descargar gratis, deje el script agregado para que puedas entrar al sitio y mirar si coloque todo bien, tengo los comentarios activado y agregue tal cual dices.

Saludos
 

linuxer

Gamma
Verificación en dos pasos desactivada
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
1 May 2012
Mensajes
153
Hola amigo, acabo de intentar agregarlo a un sitio y no me sale, el sitio es Descargar gratis, deje el script agregado para que puedas entrar al sitio y mirar si coloque todo bien, tengo los comentarios activado y agregue tal cual dices.

Saludos

con comentarios a mi no me ha dado problemas porque la api va con facebook independiente

me aparece el primero, pero no el segundo código :confused:, busca de nuevo <div class='post-footer'>, si te salen dos concidencias prueba a cortar ese código que has pegado de donde lo tienes y pegarlo encima de la otra coincidencia

es lo unico que se me ocurre

añado: en tu blog sale dos veces la api de Facebook, la que yo puse y luego abajo la misma, en princpio con una vez bastaria, pero eso no es ningun problema
 
Última edición:

EliJ

1
Pi
Verificado
Verificación en dos pasos activada
Verificado por Whatsapp
¡Ha verificado su Paypal!
Suscripción a IA
Desde
21 Mar 2012
Mensajes
6.735
Muy bueno, ya los he agregado pero siempre se me olvida al rato.
 

Pulsar

1
Pi
Verificado
Verificación en dos pasos activada
Verificado por Whatsapp
¡Ha verificado su Paypal!
Suscripción a IA
Desde
7 Jul 2011
Mensajes
5.033
Gracias por el aporte. Es realmente importante y buscado esto.
 

yonatan26

Iota
Videoblogger
Verificado
Verificación en dos pasos desactivada
Verificado por Whatsapp
Verificado por Binance
Desde
25 Mar 2011
Mensajes
2.326
buen aporte, gracias!
 

frans185

Curioso
Verificación en dos pasos desactivada
Desde
20 Dic 2012
Mensajes
8
Por favor, ten en cuenta 📝 que si deseas hacer un trato 🤝 con este usuario, está baneado 🔒.
gracias amigo, ahora que estoy aprendiendo a usar blogger con esto dejare bien chvr mi sitio ;)
 

*+LcP+*

1
Eta
Redactor
Verificación en dos pasos desactivada
Verificado por Whatsapp
Suscripción a IA
Desde
24 Jun 2009
Mensajes
1.486
[MENTION=23826]linuxer[/MENTION] Muchas gracias por el tutorial! Por fin uno que me funcionó! :) Tengo una pregunta, dónde pongo el código si lo que quiero es que los comentarios se vean en la página principal?
 
Última edición:

linuxer

Gamma
Verificación en dos pasos desactivada
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
1 May 2012
Mensajes
153
si quitas estas dos lineas te aparecen en la pagina principal

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

</b:if>

pero si lo que quieres es comentarios de la web principal no necesitaras javascript, lo puedes hacer de aqui, copias el código que te da y lo pones como un widget si quieres

https://developers.facebook.com/docs/reference/plugins/comments/


[MENTION=23826]linuxer[/MENTION] Muchas gracias por el tutorial! Por fin uno que me funcionó! :) Tengo una pregunta, dónde pongo el código si lo que quiero es que los comentarios se vean en la página principal?
 

*+LcP+*

1
Eta
Redactor
Verificación en dos pasos desactivada
Verificado por Whatsapp
Suscripción a IA
Desde
24 Jun 2009
Mensajes
1.486
si quitas estas dos lineas te aparecen en la pagina principal

<b:if cond='data:blog.pageType == "item"'>

</b:if>

pero si lo que quieres es comentarios de la web principal no necesitaras javascript, lo puedes hacer de aqui, copias el código que te da y lo pones como un widget si quieres

https://developers.facebook.com/docs/reference/plugins/comments/

Muchas gracias por tu pronta respuesta! :D

Tengo otra duda. Ya implementé el cambio que me indicaste, pero he notado que los mismos comentarios salen en todas las cajas de comentarios ¿Hay alguna forma de modificar eso o simplemente es así como funciona?

Saludos!
 

¡Regístrate y comienza a ganar!

Beneficios

  • Gana dinero por participar
  • Gana dinero por recomendarnos
  • Descubre ofertas de empleo diariamente
  • Negocios seguros
  • ¡Información premium y más!

Acceder

¿Ya tienes una cuenta? Accede aquí

Arriba