Blog

Creando un modulo para Joomla

Muchas veces he recibido recomendaciones de módulos de terceros, ahora les enseñare a crear uno básico, para mostrar lo fácil que es crear nuestros propios módulos.

Más adelante creare un tutorial para un módulo más avanzado pero este es un buen comienzo, ya lo demás dependerá de las ganas de cada quien de investigar al respecto.

Lo primero que haré será explicar a grandes rasgos que es un modulo, según la propia documentación de Joomla:
Los módulos son extensiones ligeras y flexibles usadas para la visualización de las páginas. Estos módulos son a menudo “cajas”, dispuestas en torno a un Componente en una página típica. Un ejemplo bien conocido es el módulo de inicio de sesión. Los módulos asignados por cada elemento de menú, así que (por ejemplo) puede decidir mostrar u ocultar el módulo de inicio de sesión dependiendo de la página (elemento de menú) que el usuario se encuentre actualmente. Algunos módulos están vinculados a componentes: el módulo “últimas novedades”, por ejemplo, vinculado con el componente de contenido (com_content), muestra los enlaces a los elementos de contenido más recientes. Sin embargo, los módulos no necesitan estar vinculados a los componentes; ni siquiera tienen que vincularse a nada y pueden ser sólo HTML estático o texto.

Entendiendo un poco más que es un modulo comencemos a crear uno.

La estructura básica de un modulo es la siguiente:

- mod_modulo
-- css (Opcional carpeta de estilos CSS)
-- js (Opcional carpeta de scripts JS)
-- tmpl (Opcional carpeta de templates disponibles)
--- mod_modulo.php (Obligatorio Archivo principal del modulo)
--- mod_modulo.xml (Obligatorio Archivo manifiesto del modulo)
--- helper.php (Opcional Archivo de gestión de conexiones a BD u otra fuente)

En nuestro caso de este ejemplo solo utilizaremos la carpeta tmpl y los 2 archivos obligatorios, en un siguiente tutorial haremos uso de más opciones como conexión mediante la API de Joomla a componentes y BD.

Entonces, lo primero que haremos será crear una carpeta con el nombre de la carpeta de nuestro modulo, esta debe comenzar con el prefijo mod_ quedando algo así mod_modulo, a continuación creamos un archivo con el mismo nombre de la carpeta del modulo agregando la extensión .php, quedando mod_modulo.php, en dicho archivo agregamos el siguiente código:
<?php
/**
 * @package     Joomla.Site
 * @subpackage  mod_modulo
 *
 * @copyright   Copyright (C) 2005 - 2013 Open Source Matters, Inc. All rights reserved.
 * @license     GNU General Public License version 2 or later; see LICENSE.txt
 */

defined('_JEXEC') or die;

// Asignamos la vista a mostrar, por default
require JModuleHelper::getLayoutPath('mod_modulo', $params->get('layout', 'default'));​


Después de esto creamos un archivo con el mismo nombre pero con extensión .xml, es decir, mod_modulo.xml y agregamos lo siguiente:

<?xml version="1.0" encoding="utf-8"?>
<extension type="module" version="2.5.0" position="status" method="upgrade">
 <name>Modulo Base</name>
 <author>@Javi_Mata</author>
 <creationDate>August 2016</creationDate>
 <copyright>Copyright (C) 2016 - All rights reserved.</copyright>
 <license>http://www.gnu.org/licenses/gpl-2.0.html GNU/GPL</license>
 <authorEmail>Esta dirección de correo electrónico está siendo protegida contra los robots de spam. Necesita tener JavaScript habilitado para poder verlo.</authorEmail>
 <authorUrl>www.javimata.com</authorUrl>
 <version>1.0</version>
 <description><![CDATA[Modulo base de prueba]]></description>
 <files>
  <folder>css</folder>
  <folder>js</folder>
  <folder>tmpl</folder>
  <filename module="mod_modulo">css/styles.css</filename>
  <filename module="mod_modulo">js/scripts.js</filename>
  <filename module="mod_modulo">mod_modulo.php</filename>
 </files>
 <config>
  <fields name="params">
   <fieldset name="basic">
    <field name="moduleclass_sfx" type="text" default="" label="Sufijo de tabla" />
    <field name="texto" type="text" default="" label="Texto" description="Texto a mostrar en la vista" />

    <field name="layout" type="modulelayout" label="JFIELD_ALT_LAYOUT_LABEL" description="JFIELD_ALT_MODULE_LAYOUT_DESC" />

   </fieldset>
  </fields>
 </config>
</extension>

Este archivo lo que hace es configurar y definir los valores de nuestro modulo, en la linea:
<extension type="module" version="2.5.0" position="status" method="upgrade">
Lo que estamos indicando es el tipo de extensión, la versión minima de Joomla que soportará, el destino del modulo y el método, si ponemos upgrade indica que se podrá actualizar el modulo sobre escribiendo el actual, de lo contrario dará un error si algún día queremos actualizarlo.

Los demás campos son de configuración y fáciles de entender, después viene una sección <files> donde debemos indicar que archivos contiene nuestro modulo.

Más adelante esta la parte <config>, que es donde definiremos los campos que se mostrarán en el administrador de módulos, en este punto es aconsejable que cheques la siguiente pagina: https://docs.joomla.org/Standard_form_field_types donde podrás conocer los diferentes tipos de campos que se pueden agregar en esta parte.

Hecho esto, pasamos al que será nuestro archivo principal de nuestro modulo, ya que el archivo mod_modulo.php solo lo usamos para indicar cual template utilizaremos en la vista de nuestro modulo, esto para permitir poder tener diferentes versiones de un mismo modulo.

Crearemos un archivo llamado default.php dentro de la carpeta de tmpl, este archivo tendrá el siguiente código:
<?php
defined('_JEXEC') or die('Restricted access');

// Tomamos los valores dados en el administrador del modulo
$clase = $params->get("moduleclass_sfx");
$texto = $params->get("texto");
?>

<div class="<?php echo $clase; ?>">

 Muestra del modulo en template "default": <br>
 <?php echo $texto; ?>

</div>​

Lo que hacemos aquí es llamar los datos que ingresemos en el administrador y los mostramos en la posición donde pongamos nuestro modulo.
 
Ya creado lo anterior,  podemos pasar a la instalación del modulo, lo cual es bastante fácil de hacer, simplemente comprimimos en un archivo .ZIP los archivos creados y si todo esta correcto, en nuestro Joomla nos dirigimos a Extensions -> Manage -> Install y en la pestaña Upload package file  (Dependiendo de la version de Joomla puede ser diferente la ruta) agregamos nuestro archivo ZIP y damos click en Upload & Install, si todo sale bien nuestro modulo deberá quedar instalado sin problemas.



Ahora solo restará, en nuestro gestor de módulos asignarlo a una posición y listo, deberá aparecer nuestro texto seleccionado en la posición indicada.

Para algo más avanzado te recomiendo que leas la documentación de Joomla al respecto en https://docs.joomla.org/J3.x:Creating_a_simple_module/Developing_a_Basic_Module/es

Si deseas agregar conexión a bases de datos te sugiero visites la siguiente pagina:
http://mundogeek.net/archivos/2010/01/17/bases-de-datos-en-joomla/

Espero te sirva esta pequeña guía para comenzar, te invito a visitar mi Github para ver más códigos.

Si tienes dudas búscame en twitter en @javi_mata

Javi Mata

Web Developer, especializado en PHP, Shopify, Joomla, Wordpress, HTML5, CSS, etc.

Donativos

Ver más formas de apoyar

Socio-certificado.jpg