Icomoon en Joomla 3

Generalidades

Icomoon ofrece íconos para utilizarlos en nuestros sitios web, podemos hacer uso de estos iconos a través de los diferentes packs que ofrece, sin embargo Joomla 3 ya trae integrado los íconos que ofrece Icomoon a través de archivos fonts (archivos de tipo de letra)

Icomoon y Joomla

Podemos hacer uso de Icomoon en la plantilla protostar, que es una de las plantillas que tiene por defecto Joomla 3, si accedemos al archivo  : /templates/protostar/css/template.css , veremos que se definen clases para hacer uso de los íconos, clases como icon-user , icon-locked , etc.

Para hacer uso de estas clases debemos utilizar la siguiente sintaxis

<span class="icon-class"></span>

 Reemplazando icon-class por la clase que deseamos , por ejemplo icon-locked, luego esto lo podemos utilizar en algún artículo o módulo personalizado html, debemos colocar estas etiquetas en vista de código del editor.

Modificando la plantilla protostar

Una aplicación práctica es que los títulos de los módulos tenga un ícono, y que para indicar que ícono mostrar hacerlo a través de la configuración del módulo; ingresar la clase a usar desde la configuración del módulo , en las opciones avanzadas, por ejemplo icon-user, tal como se muestra en la siguiente imagen

Luego necesitamos modificar el archivo /templates/protostar/html/modules.php , en la función que hace referencia al stylel well: modChrome_well, línea 44 aproximadamente, agregamos las etiquetas span y la referencia a la variable definida en la pantalla de configuración anterior.

echo "<h3 class=\"page-header\"><span class='".$params->get('header_class')."'></span> ". $module->title . "</h3>";

Con esto obtendremos un resultado similar a : 

En el siguiente video se explica de manera práctica cada uno de los puntos explicados anteriormente.