Cómo añadir Disqus en WordPress sin plugin.

Hace unos días tuvimos que actualizar la web de un cliente que usa Disqus. Disqus es un sistema de moderación de comentarios que añade funcionalidades a WordPress.

El problema surgió porque lo tenía instalado con el plugin de Disqus para WordPress (sin actualizar desde hace un año) pero en la actualización del Tema no era compatible. Con un tema por defecto aparecían los comentarios, pero con el tema actualizado no. Tocaba buscar la solución sin plugin.

PD: Suponemos que la web está configurada en Disqus. Para eso puedes usar el plugin anterior o hacerlo a mano.

Añadir el sistema de comentarios Disqus a WordPress sin plugin.

Disqus deja un código para añadir a mano en cualquier CMS , lo que llaman el Universal Embed Code aquí. Vamos a basarnos en ese código para crear un Snippet. Normalmente usamos este plugin, pero hoy vamos a usar uno similar.: Woody Code Snippets.
¿Por qué? Porque te permite crear automáticamente, sin más desarrollo, un shortcode. y lo vamos a necesitar.

Primero, tras la instalación de ese u otro plugin de Snippets vamos a añadir este código (o en functions.php). Es JavaScript, así que o lo metemos como código de Javascript en un módulo de Snippets como Woody o lo ponemos entre las etiquetas de <script> </script> en un php (o función). Nosotros lo hemos metido como shortcode de Javascript.

   var disqus_config = function () {
           // this.page.url = "'.get_permalink($post->ID).'";
        };

        (function() {
            var d = document, s = d.createElement("script");
            s.src = 'https://SHORTNAME.disqus.com/embed.js';
            s.setAttribute("data-timestamp", +new Date());
            (d.head || d.body).appendChild(s);
        })();

Donde SHORTNAME es el nombre abreviado (shortname) que Disqus nos ha proporcionado cuando damos de alta la web.
Woody si lo ponemos en opción de mostrar el código donde está el shortcode nos proporciona a la derecha un shortcode para este código.

Ahora lo que vamos a hacer es editar nuestra plantilla de página o entrada para poner el shortcode. Lo podemos hacer de varias maneras:

  • Si estamos usando plantillas de entradas en un constructor lo ponemos ahí.
  • Si estamos usando una plantilla lo mejor es crear un tema hijo, y copiar del tema padre el fichero donde ponga los comentarios. Normalmente es single.php o comments.php. y tiene un código como:
<?php comments_template( '', true ); ?>

Lo vamos a sustituir por

<div id="disqus_thread">[wbcr_js_snippet id="XXXXX"]</div>

Donde XXXxx es el id del snippet que nos ha dado Woody.

Es importante que esté un div con ese id o en esta parte del código o en la anterior, porque ahí es donde Disqus hará un “embed” de los comentarios.

Y con esto ya deberían aparecer los comentarios.

Nota: hay otras maneras de hacer esto. Podemos crear un shortcode directamente en el snippet. O meter el div en el snippet como código php y luego el javascript. Sólo son variantes de lo mismo.