Cómo implementar los comentarios de Facebook en K2 sin plugins
- Detalles
- Por Emanuel Rodríguez
- Visto: 1566
⚠️ Nota importante
Este artículo tiene más de un año. La tecnología evoluciona rápido, por lo que algunos contenidos o instrucciones pueden estar desactualizados. Recuerda buscar información reciente y actualizada.
El sistema de comentarios incluido en K2 puede resultar un poco limitado para la mayoría de sitios web que cuentan con una comunidad activa. En mi caso, utilicé por años los comentarios de Disqus, pero hace unos meses el sistema comenzó a cargar múltiples scripts relacionados al sistema de publicidad integrado obligatorio así que decidí darle una oportunidad a los comentarios de K2. Lo intenté usar por algunos días pero, después de tener algunas dificultades para compartir con la comunidad que hacía preguntas y sugerencias por medio de los comentarios, decidí implementar el sistema de comentarios de Facebook.
El proceso de implementación es muy sencillo y no es necesario instalar ninguna extensión adicional. Solamente hay que realizar un pequeño cambio en el archivo item.php
. Recuerda que para hacer cambios a este archivo y conservarlos después de una actualización del componentes K2 debes hacer un override.
El archivo item.php
se encuentra en templates/tu_plantilla/html/com_k2/plantilla_k2/item.php
. En dicho archivo, la sección de comentarios empieza en la línea 567 (en el archivo predeterminado sin modificaciones). Hay que conservar las tres primeras secciones completas (aproximadamente hasta la línea 583):
<!-- K2 Plugins: K2CommentsBlock --> <?php echo $this->item->event->K2CommentsBlock; ?> <?php endif; ?> <?php if( $this->item->params->get('itemComments') && ($this->item->params->get('comments') == '1' || ($this->item->params->get('comments') == '2')) && empty($this->item->event->K2CommentsBlock) ): ?> <!-- Item comments --> <a name="itemCommentsAnchor" id="itemCommentsAnchor"></a> <div class="itemComments"> <?php if($this->item->params->get('commentsFormPosition')=='above' && $this->item->params->get('itemComments') && !JRequest::getInt('print') && ($this->item->params->get('comments') == '1' || ($this->item->params->get('comments') == '2' && K2HelperPermissions::canAddComment($this->item->catid)))): ?> <!-- Item comments form --> <div class="itemCommentsForm"> <?php echo $this->loadTemplate('comments_form'); ?> </div> <?php endif; ?>
Las siguientes secciones podemos eliminarlas. Esto es a partir del conteo de comentarios en la línea que se muestra a continuación y que también debe ser eliminada:
<?php if($this->item->numOfComments>0 && $this->item->params->get('itemComments') && ($this->item->params->get('comments') == '1' || ($this->item->params->get('comments') == '2'))): ?>
Hasta la siguiente sección (que también debe ser eliminada):
<?php $user = JFactory::getUser(); if($this->item->params->get('comments') == '2' && $user->guest): ?> <div class="itemCommentsLoginFirst"><?php echo JText::_('K2_LOGIN_TO_POST_COMMENTS'); ?></div> <?php endif; ?>
Recuerda hacerlos los cambios en el archivo
item.php
de la plantilla y no encomponents/com_k2/templates/default/item.php
.
Justo después de la última línea del primer segmento debemos insertar lo siguiente:
<!-- Comentarios de Facebook --> <?php if($this->item->params->get('itemComments') && ($this->item->params->get('comments') == '1' || ($this->item->params->get('comments') == '2')) && empty($this->item->event->K2CommentsBlock)): ?> <div class="fb-comments" data-href="<?php $url="".$this->item->absoluteURL; echo $url; ?>" data-width="815" data-num-posts="5" data-order-by="reverse_time"></div> <?php endif; ?>
Por supuesto que en data-width
debes definir el ancho que les quieres dar a los comentarios. En data-num-posts
debes definir la cantidad de comentarios a mostrar de forma predeterminada. El código lo puedes probar y conocer más en la sección de desarrolladores de Facebook. Allí podrás configurar la forma en que quieres que se muestren los comentarios y hacer los cambios respectivos en el código de arriba.
Si no estás usando algún otro plugin de Facebook y por lo tanto no estás cargado el SDK para Javascript de Facebook, en lugar de insertar el código anterior debes ingresar el siguiente:
<!-- Comentarios de Facebook --> <?php if($this->item->params->get('itemComments') && ($this->item->params->get('comments') == '1' || ($this->item->params->get('comments') == '2')) && empty($this->item->event->K2CommentsBlock)): ?> <div id="fb-root"></div> <script>(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 = 'https://connect.facebook.net/es_ES/sdk.js#xfbml=1&version=v2.11&appId=572710156237099'; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk'));</script> <div class="fb-comments" data-href="<?php $url="".$this->item->absoluteURL; echo $url; ?>" data-width="815" data-num-posts="5" data-order-by="reverse_time"></div> <?php endif; ?>
Si tienes alguna duda o problema con la implementación, no dudes en compartirla en los comentarios de Facebook al final del artículo.