En estas líneas voy a escribir sobre como usar los comentarios de facebook (Facebook Comments) en un website construido con WordPress sin la necesidad de instalar un plugin para lograrlo.
Con esta explicación se pueden implementar los comentarios de Facebook en cualquier website, y es precisamente por eso que quería hacer notar como instalar los comentarios de Facebook sin el uso de un plugin, porque cada CMS tiene una manera distinta de implementar los comentarios, así que quise explicar como implementarlos en cualquier CMS de una forma parecida.
Paso 1 – Crear una applicación de Facebook.
Lo primero es crear una aplicación de Facebook para que represente a tu website. Esto se puede hacer en el centro de desarrolladores de Facebook. Haz click en + Crear Nueva Aplicación y entra el nombre de tu website, selecciona que aceptas los Facebook Platform Policies y continúa.
Una vez la App está creada vas a ser redirigido a una pantalla donde se pueden editar las propiedades de tu app. Ahora mismo no tienes que editar nada, solo hacer click en el link de Website y copiar la App ID. Este ID lo vas a utilizar posteriormente para indentificar a quienes pueden moderar los comentarios en tu website.
paso 2 – Añadir el Facebook Javascript SDK a WordPress
Ahora hay que agregar el Facebook Javascript SDK al template de WordPress. Agrega el código a continuación en el header.php justo antes de la etiqueta </body> y sustituye el App ID que está en la linea 5 por el del paso anterior.
<!-- Facebook JavaScript SDK -->
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({appId: '141109849335437', status: true, cookie: true,
xfbml: true});
};
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol +
'//connect.facebook.net/en_US/all.js';
document.getElementById('fb-root').appendChild(e);
}());
</script>
<!-- End Facebook JavaScript SDK -->
paso 3 – Agregando las herramientas de moderación
Mientras editas el <head> … </head> pega el código a continuación y sustituye de nuevo el App ID por el que copiaste en el paso 1. Esta etiqueta del Open Graph le dice a Facebook que asocie este website con la app especificada.
<!-- Facebook Open Graph Tags --> <meta property="fb:app_id" content="141109849335437"/> <!-- End Facebook Open Graph Tags -->
Paso 4 – Agregando el plugin de comentarios
Ya que has agregado el Javascript SDK al header de tu template, lo próximo que debes hacer es agregar el facebook comments plugin al archivo comments.php
Yo opté por eliminar los comentarios de WordPress de mi template, pero no tienes que hacer lo mismo, lo comentarios de Facebook y los de WordPress pueden co-existir.
Para agregar los comentarios a tu template crea o sustituye el archivo comments.php por el siguiente código:
<div id="comments"> <?php if ( comments_open() ) : ?> <div id="fbcomments"> <div id="fb-root"></div> <script src="http://connect.facebook.net/es_ES/all.js#xfbml=1"></script> <fb:comments href="<?php the_permalink(); ?>" width="630" num_posts="10" ></fb:comments> </div> <?php endif; ?> </div>
Estas líneas van a verificar que los comentarios estén abiertos para esta entrada antes de insertar el código de los comentarios de Facebook. Se pueden cambiar la cantidad de comentarios (num_posts) y el ancho (width) para que cumpla con tus necesidades.
paso 5 – Comprobar los comentarios
Si ejecutaste todos los pasos anteriores correctamente, puedes dirgirte a una entrada cualquiera tu blog y bajar hacia donde están los comentarios y ver algo como esto:
Asumiendo que estás logueado en Facebook cuando haces esto deberías ver una opción para agregar comentario, vista del moderador y otra para editar las configuraciones, si no, debes verificar que la app Id del paso 1 están puestas correctamente en el header.
Para moderar los comentarios dirigete al Facebook comments moderation tool
