desarrollando con joomla i

5/10/2018 Desarrollando Con Joomla I - slidepdf.com

http://slidepdf.com/reader/full/desarrollando-con-joomla-i 1/26

Desarrollando Con Joomla I

Relator: Pablo Bustamante

1



2



1. Introducción a Joomla

¿Qué es Joomla?

Joomla es un Sistema de Administración de Contenidos (CMS en sus siglas en ingles), estadesarrollado bajo plataforma PHP en su versión 5 y su motor de Base de Datos es Mysql.

¿Orígenes de Joomla?

A mediados de 2005, los administradores del equipo de desarrollo de Mambo (CMS antecesor de

Joomla!) decidieron limitar las condiciones de la licencia de uso de su software.

Ante tal hecho, los principales desarrolladores de la organización estuvieron en desacuerdo y fue asíque más de 30 miembros principales del equipo renunciaron de inmediato y fundaron Joomla!® unapalabra de origen africano que significa “todos juntos”, un CMS que funcionaba con el núcleo de Mambo,pero con cambios importantes en el código y lo mejor de todo es software libre.

No sólo los desarrolladores de Mambo migraron al nuevo proyecto; miles de colaboradores,diseñadores y comunidades enteras lo respaldaron desde un principio, sobre todo al difundirse la noticiade la acción ejecutada por Mambo y sus propietarios.

De esta manera el proyecto Joomla! tomó aún más energía, llegando a ser la aplicación Web que hoy

conocemos, no sólo con excelentes características de gestión integral, sino con un futuro bastantepromisorio en el ámbito de la Web 2.0.

En el presente, el fenómeno Joomla! representa más que la existencia de una aplicación Web deavanzada. Es la demostración palpable de la superioridad que puede alcanzar el software libre cuandoestá presente el esfuerzo común, activo y organizado de una numerosa comunidad global.

3



2. Estructurando el CMS

Características del Diseño

- Programación Orientada a objetos.- Separación marcada de Modelo-Vista-Controlador (MVC).- Modelo Escalable, en breves paso puede ser extendido sin necesidad de tocar su

framework- API’s completas que permiten acceder de manera rapida a funcionalidadescomplejas (Feed RSS, PDF, ZIP, etc.).

4

Framework

Módulos

Plugins

Componentes

Templates

Estructura de Joomla



2.1 API’S mas usadas

A continuación expondre una lista con las Apis mas usadas para el desarrollo de aplicaciones:

JFactory::getDBO() = Este objeto nos genera una instancia de Base de Datos, con esto podemos realizar

consultas.Metodos:

- setQuery : Asigna una consulta SQL al objeto.- Query : Ejecuta la consulta, en general se utiliza para comandos sql (insert, delete,update)- loadObjectList: Nos devuelve una matriz de tipo DBO con el resultado de nuestraconsulta.- loadObject: Nos devuelve una matriz de tipo DBO con la primera fila de nuestra consulta- loadAssocList: Nos devuelve un Array con los valores entregados por el DBO.- loadAssoc: Nos devuelve un Array con los valores de la primera fila de nuestra consulta- loadResult: Nos entrega una columna especifica de la primera fila de nuestra consulta.

Ejemplo:

JFactory::getDate() = Este objeto nos genera una instancia de tipo Date.Metodos:

- toFormat: Nos entrega la fecha cargada en un formato especial definido- toString: Nos devuelve la fecha en una cadena de texto.

Ejemplo:

JFactory::getApplication: Esta instrucción nos instancia el objeto de tipo Sitio, esto nos permite accedera información del sitio.

Metodos:- getCfg: Obtiene valores desde el configuration.php del sitio- getPageTitle: Obtiene el titulo de la pagina actual- getTemplate: Obtiene el nombre de la plantilla actual- login: Ejecuta la función login- logout: Ejecuta la función logout- redirect: Redirección a una url especificada- setPageTitle: Modifica el Titulo de la pagina actual

5

$db = JFactory::getDBO();$db->setQuery(“select * from #__content order by ordering”);$contenidos = $db->loadObjectlist();

$fecha =JFactory::getDate(‘2010-07-29’)->toFormat(‘%d de %B de %Y’);Echo $fecha;

Resultado 29 de Julio de 2010



3. Modelo-Vista-Controlador (MVC)

Es un estilo de arquitectura de software que separa los datos de una aplicación, la interfaz de

usuario, y la lógica de control en tres componentes distintos. El estilo de llamada y retorno MVC(según CMU), se ve frecuentemente en aplicaciones web, donde la vista es la página HTML y el códigoque provee de datos dinámicos a la página. El modelo es el Sistema de Gestión de Base de Datos y laLógica de negocio, y el controlador es el responsable de recibir los eventos de entrada desde la vista.

La nueva versión 1.5 de joomla! Incluye novedades en la elaboración de componentes, entre ellas laposibilidad de incorporar un patrón de diseño MVC , que a la larga facilitará el mantenimiento denuestro componente, y lo hará más fácil de extender al mismo tiempo que resultará más fácil de leerpor otras personas.

Lo primero que hay que tener claro es el funcionamiento del modelo MVC.

Una aplicación web basada en este patrón separa su código en tres partes diferenciadas:

• El controlador: el controlador es el punto de entrada de la aplicación, se mantiene a laescucha de todas las peticiones, ejecuta la lógica de la aplicación, y muestra la vistaapropiada para cada caso.• El modelo : el modelo contiene todo el código relacionado con el acceso a datos. Esimportante que sea un código lo más genérico posible y se pueda reutilizar en otrassituaciones y proyectos. Nunca incluiremos lógica en el modelo, solamente consultas a labase de datos y validaciones de entrada de datos.• La vista : la vista contiene el código que representará lo que nosotros veremos porpantalla, en este caso se trata de código HTML.

6



4. Módulos

Los módulos son pequeñas extensiones que nos permiten entregar información a los usuarios sin

necesidad de programación compleja, estos en general dependen de los componentes que alimentan lainformación que estos muestran.

Estos se encuentran situados en el directorio modules dentro del directorio de instalación de Joomla ypor cada módulo hay una carpeta con nombre mod_nombredelModulo .

Los módulos en Joomla 1.5 utilizan una estructura que emula la separación entre modelo-vista-controlador. A continuación vamos a crear un modulo que consulte a la base de datos y muestre el titulode los artículos con un enlace al articulo completo.

Nuestro módulo se va a llamar anyo, por lo tanto la carpeta del módulo se llamará mod_anyo.

La estructura de un módulo es muy simple, tiene un fichero php con el mismo nombre que el módulo, elcual es el punto de entrada, que tomará en control del módulo cuando este sea llamado.

Para separar la lógica de la presentación se ha creado la clase helper, en la cual escribiremos nuestrasfunciones y de esta forma nuestro código quedará más ordenador y legible. La clase helper se encuentraen el fichero de nombre helper.php en la raíz del directorio del módulo.

Desde mod_anyo.php ejecutaremos las funciones de la clase helper simplemente llamándolos comométodos estáticos .

Por ultimo, tenemos el layout, o template, que se encuentra dentro de la carpeta tmpl de nuestromódulo , el cual puede tener cualquier nombre que se te ocurra, pero le asignaremos default.php, que es

el nombre por defecto que buscara Joomla si no le indicamos lo contrario.

Para la parte de Back-End disponemos del fichero mod_anyo.xml , donde definiremos los parámetros delmódulo y mediante el cual podremos parametrizar el modulo para hacerlo mas configurable y

reutilizable.

7



Vamos a ver el código de nuestro punto de entrada:

Controlador

La primera línea, como siempre que hacemos una extensión para Joomla, es una línea de comprobación,que asegura que no se este accediendo al modulo sin estar usando Joomla.

La segunda línea importa el fichero de la clase helper, donde almacenamos nuestras funciones.

En la tercera línea, ejecutamos la función getArticulos() de nuestro helper que devuelve una lista deobjetos con los resultados de la consulta SQL.

Por último, hacemos un require del layout, que en nuestro se llama default y lo hacemos usando elmétodo getLayoutPath de la clase JModuleHelper, que devuelve la ruta del layout pasándole comoparámetro el nombre del módulo y al nombre del layout.

En el helper almacenamos nuestras funciones, donde accedemos a datos para recuperar la lista deartículos que se escribieron hoy hace un anyo. Vamos a ver el código:

Modelo

8

<?php // no acceso directodefined( '_JEXEC' ) or die( 'Restricted access' ); // incluir al helper que devolverá los datos, solo una vez require_once( dirname( __FILE__).DS.'helper.php' ); $articulos = modAnyoHelper::getArticulos( $params );require( JModuleHelper::getLayoutPath( 'mod_Anyo','default') );?>

<?phpclass modAnyoHelper{ function getArticulos( $params ) {

jimport('joomla.utilities.date');$jnow = new JDate();$now = $jnow->toMySQL();

$db = &JFactory::getDBO();$consulta = "select title,id from #__content where

datediff( #__content.created, '".$now."' ) = 365 limit 0,30";$db->setQuery($consulta);$categorias = $db->loadObjectList();return $db->loadObjectList();

}

}?>



La clase helper ha de llamarse con el nombre del modulo sin “_” seguido de helper, es decir, en nuestrocaso seria modanyoHelper.

Mediante jimport importamos el fichero necesario para instanciar una clase de tipo JDate.

Jimport admite como parámetro un string que apunte al “package” donde se encuentre la clase. Es unconcepto similar al import de java . Los paquetes se importan según el árbol de clases existentes en elFramework.

Después creamos el método getArticulos que será el que devuelva una lista de artículos que tengan unaño de antigüedad.

Utilizamos un objeto de tipo JDatabase para realizar la consulta y después simplemente obtenemos lalista de objetos mediante el método loadObjectList .

El meollo de la cuestión esta en la consulta SQL, donde se utiliza la función datediff para consultar losartículos con una antigüedad de 365 días

Finalmente , en el layout, sacamos por pantalla una lista HTML con enlaces a los artículos que seescribieron hace justo 365 días:

Vista

9

<?phpif($params->get('asignarCss')){

$css = $params->get('clase');} ?>

<ul <?php if(isset($css )){ echo 'class="'.$css.'"';} ?> ><?phpforeach ($articulos as $articulo) {

echo '<li><a href="index.php?option=com_content&id='.$articulo-">id.'>'. $articulo->title.'</a></li>

';}

?></ul>



Fíjate que para acceder a los parámetros del fichero mod_anyo.xml se utiliza $params->get() .

Estos parámetros se definen previamente en el fichero xml que acompaña el modulo.

10

<?xml version="1.0" encoding="utf-8"?><install type="module" version="1.5.0">

<name>Hoy hace un año</name><author>David Noguera</author><version>1.5.0</version><creationDate>30.07.2006</creationDate><description>Modulo que carga los artículos de tal dia como hoy

pero hace un año</description><authorEmail>[email protected]</authorEmail><files><filename module="mod_anyo">mod_anyo.php</filename>

<filename>helper.php</filename>

<filename>mod_anyo.xml</filename><filename>tmpl/default.php</filename><filename>tmpl/index.html</filename>

</files><params><param name="clase" type="text" default="mod_anyo"

label="Clase Css para el ul"description="La clase que se

aplicara al ul" /><param name="asignarCss" type="radio" default="1"label="Clase css" description="Determina si se debe asignar la clasecss o no"><option value="0">No</option><option value="1">Si</option></param></params></install>



5. Creando mi Componente MVC

Siguiendo el patrón MVC, vamos a crear un componente simple para joomla 1.5 al que llamaremos prueba. El objetivo de esta primera toma de contacto es entender la metodología de trabajo paracrear el componente de joomla! 1.5.

Lo primero que haremos será ir a la carpeta principal de Joomla en nuestro servidor web. Dentro deesa carpeta localizar el directorio components .

Observa que dentro del directorio existen otros directorios que empiezan por com_xxxx . Esta es laprimera norma que pone Joomla!: los componentes se deben de ubicar en un directorio cuyo nombreempieze por com_ seguido del nombre del componente, por ejemplo para el componente pruebaseria com_prueba (este aspecto es similar a la parte de módulos que hemos visto anteriormente)

Por lo tanto creamos un directorio dentro del directorio components y lo llamamos com_prueba.Cuando llamemos a nuestro componente, lo primero que hace Joomla es buscar el archivo php quehay dentro con el mismo nombre que el componente y ejecutarlo. Este es el punto de entrada delcomponente. Creamos el fichero prueba.php dentro del directorio y de momento lo dejamos enblanco. Por ahora solo estamos creando la estructura del componente. Lo siguiente es crear elarchivo controller.php, y de momento también lo dejaremos en blanco. Ahora necesitamos crear losdirectorios en los que ubicaremos nuestro Modelo y nuestra Vista.

Crea un directorio con nombre models y otro con nombre views.

Dentro del directorio views, hay que crear un directorio por cada vista y el directorio tiene que tenerel nombre de la vista; crea el directorio prueba dentro del directorio views.

Dentro del directorio views/prueba crea el directorio tmpl , aquí es donde se guardarán los layoutsde la vista. El layout es el fichero final que se mostrará por el navegador, más adelante explicaréesto.

Crea el fichero views/prueba/view.html.php , este fichero también es necesario. Ahora crea elfichero prueba.php dentro de models.

Ya tienes la estructura básica del componente, aunque aún no hemos introducido código.

11



Como podrás imaginar el modelo del componente irá dentro de la carpeta models , las vistas seubicaran dentro del directorio views, y el controlador en el archivo controller.php .

Joomla! 1.5 sabe qué componente tiene que cargar porque busca en la query string de la petición elparámetro “option”, del cual obtiene el nombre del componente a cargar. Es decir, nosotros parallamar a nuestro componente prueba, introduciremos en joomla la URL acabada con index.php? option=com_prueba. Esto muestra la pagina principal de nuestro componente, que por defecto cargala vista con el mismo nombre del componente, es decir, la vista con nombre “prueba”.

Cuando se carga el componente, se ejecuta el punto de entrada a este, prueba.php, y en el punto deentrada será donde nosotros crearemos una instancia de nuestro componente.

12



Introduce el siguiente código en el punto de entrada de tu componente:

Vamos a comentar el siguiente código paso a paso:

La primera línea comprueba si esta definida la variable “_JEXEC”, y si no esta definida se muestra unmensaje de error por pantalla mediante la función “die”. Esto es una medida de seguridad que

incluye el marco de trabajo Joomla! y que es recomendable usar en todos nuestros archivos .php quetengamos en el sitio, y que evitara que la gente acceda a las paginas directamente sin hacer antes lascomprobaciones de seguridad que lleva incluida Joomla!

Seguidamente se importa el fichero controller.php donde crearemos nuestra clase que contendrá elcontrolador.

JPATH_COMPONENT y DS son constantes que define el marco de trabajo de Joomla! y que contienenel path al componente en el sistema y el separador de directorios adecuado para el sistema que seeste utilizando, “\” para Windows y “/” para sistemas Unix. Utilizar estas constantes nos facilitara eltrabajo más adelante y hará nuestras aplicaciones portables e independientes de la plataforma dondese estén utilizando.

Después de importar el controlador, se comprueba si existe el parámetro “controller” en la querystring, y si existe establece la variable path a JPATH_COMPONENT/controllers/$controller.php, paraluego hacer un require_once de path, e importar el controlador que se especifica en la petición y quese sitúa en la carpeta controllers .

Nosotros no hemos creado la carpeta controllers, por que de momento solo crearemos uncontrolador, pero también se pueden crear varios controladores y se instanciará uno u otro según elparámetro controller que se establezca en la query string.

Después de importar el fichero correspondiente a nuestro controlador, lo instanciamos y ejecutamosel método execute del controlador, y le pasamos como parámetro un string que contiene el valor del

parámetro task que hayamos establecido en la query string.

13

defined( '_JEXEC' ) or die( 'Restricted access' ); require_once( JPATH_COMPONENT.DS.'controller.php' ); if($controller = JRequest::getWord('controller')) { $path = JPATH_COMPONENT.DS.'controllers'.DS.$controller.'.php'; if (file_exists($path)) { require_once $path; } else { $controller = ''; }} $classname = 'pruebaController'.$controller;$controller = new $classname( ); $controller->execute( JRequest::getVar( 'task' ) ); $controller->redirect();



Después de esto se ejecuta el metodo redirect() del controlador, que redigirá el flujo del programa ala vista adecuada.

Parece complicado, pero no lo es tanto simplemente recuerda:

• Se comprueba si viene un parámetro en la query string que establezca un controlador, ysi viene se importa el fichero con el controlador.• Se instancia el controlador.• Se ejecuta el método execute del controlador.• Se ejecuta el método redirect del controlador.

Después de esto, lógicamente, tendremos que incluir el código del controlador que acabamos deinstanciar.

Vamos al fichero controller.php y copiamos el siguiente codigo:

Esta vez lo único que hemos hecho es crear la clase que hará la función de controlador, y es

obligatorio que herede de JController .Hemos sobrescrito el metodo display , pero lo único quehacemos es ejecutar el metodo display de la clase padre, es decir, que básicamente no hacemosnada.

En un componente más complejo, antes de ejecutar parent::display(); incluiríamos lógica de negocioen la aplicación, con acceso a datos , etc..

El controlador da paso a la vista correspondiente, que en este caso es la que se llame prueba.

Se le puede especificar la vista que se quiere ver pasándole a la petición un parámetro en la query string , es decir, si en vez de ver la vista por defecto quieres que el controlador redirija a una vistacon nombre “noticias”, haremos una petición como la siguiente : index.php?

option=com_prueba&view=noticias.

Lo mismo se puede hacer con el parámetro controller, pero en ese caso lo que haría sería instanciarel controlador con el nombre especificado en lugar de el controlador por defecto que se instancia.

Después de crear nuestro controlador, vamos a crear nuestra vista.

14

defined( '_JEXEC' ) or die( 'Restricted access' );jimport('joomla.application.component.controller');

class pruebaController extends JController{

function display(){

parent::display();}

}



Vamos al fichero view.html.php en el directorio views/prueba y copiamos el siguiente código:

Observa la definición de la clase. Como puedes observar tiene un nombre un poco peculiar, estenombre no se lo he puesto así por que he querido, sino que he seguido una norma que establece elmarco de trabajo Joomla!, y que consiste en poner primero el nombre del componente que lo llama,seguido de view y seguido del nombre de la vista NombreComponenteViewNombreVista.

Esta norma es la que se sigue también para el modelo.

Lo que vamos a hacer en este caso es sobrescribir el método display y utilizar assignRef para crearreferencias que utilizará el “layout”.

La primera línea del método display obtiene el modelo, Joomla busca un modelo con nombrePruebaModelPrueba debido a que no se le pasa ningún parámetro a la función getModel() y loinstancia. Si le hubiéramos pasado el nombre de algún modelo como parámetro, nos hubiera devueltoel modelo especificado.

Una vez tenemos el modelo ejecutamos el método getMensaje de este, que devuelve un string. Elstring se le pasa al layout por referencia mediante assignRef .

Finalmente se ejecuta el método display de la clase padre, al cual se le puede pasar como parámetroel nombre del layout que se quiere visualizar, en nuestro caso no le pasaremos ninguno y visualizaráel layout con nombre default.php .

Crea el fichero views/prueba/tmpl/default.php . Este será el layout que se visualizara por defectoen nuestra vista. Añade el siguiente código:

Observa que recogemos la referencia que hemos asignado antes mediante asignRef() simplementecomo si fuera una variable local del script php. Yo he puesto este código muy simple, pero tu puedesponer todo el código html que se te ocurra.

Solo nos queda preparar el modelo e implementar el método getMensaje() que hemos usado antes enla vista,

15

defined( '_JEXEC') or die( 'Restricted access');jimport( 'joomla.application.component.view');

class pruebaViewprueba extends JView

{ function display($tpl = null) {

$model =& $this->getModel();$mensaje = $model->getMensaje();$this->assignRef('mensaje',$mensaje);

parent::display($tpl);

}

}

<h1> <?php echo $this->mensaje ?> </h1>



Ves a la carpeta models y en el fichero prueba.php escribe el siguiente código :

El código habla por si solo, ten en cuenta que yo he devuelto una cadena de texto por simplicidad,pero en una aplicación más compleja nos se devolvería una cadena obtenida de una base de datos o

un resultSet, p.e.

Ya está finalizada la creación del componente. Para llamarlo tendremos que pasarle en la url comoargumento el nombre del componente, y Joomla lo mostrará por pantalla. Como es lógico, Joomlasólo podrá mostrar un componente simultáneamente por pantalla.

Así quedaría la estructura de directorios para la parte de front-end de los componentes de Joomla!:

En el caso del componente que acabo de diseñar, después de introducir en el navegador la direcciónhttp://localhost/sitioJoomla/index.php?option=com_prueba , debería mostrar, si todo ha ido bien :“Hola soy un valor que ha devuelto el modelo”.

16

defined('_JEXEC') or die("Invalid access");jimport('joomla.application.component.model');

class pruebaModelprueba extends JModel{

function getMensaje(){return "Hola, soy un valor devuelto por el modelo";

}}



6. Plugins: Extendiendo el Core Joomla

Los plugins nos permiten modificar el comportamiento estándar de Joomla!, pudiendo interceptarciertos eventos prefijados para ejecutar nuestro código antes o después del evento.

Los plugins pueden llegar a ser muy utiles y potentes.

Por ejemplo, se puede interceptar el evento de publicar un articulo y hacer que joomla imprima un

mensaje personalizado antes de cada articulo, o lo que a ti se te ocurra, simplemente tienes quetener a mano la lista de eventos (hooks) definidos y tu imaginación para hacer con joomla! lo quequieras.

Existen varios tipos de plugins, por cada tipo de plugin existe un directorio dentro del directorioplugins, por lo tanto tenemos el directorio plugins/content para los plugins de tipo content y así contodos los tipos. Existen varios tipos, mira en tu carpeta plugins y comprueba los tipos.

Un plugin es un objeto que deriva de la clase JPlugin. Esta clase tiene unos métodos definidos queson ganchos (hooks) , también se les podría llamar listeners , y que se ejecutaran cuando el eventoasociado a cada clase se dispare, por lo tanto tendremos que sobrescribir las funciones gancho quenecesitemos y escribir nuestro código allí.

Por ejemplo, si sobrescribimos el método onLoginUser y escribimos una sencilla rutina que envié unemail a nuestra cuenta de correo, estaremos modificando el sistema para que cada vez que unusuario haga login, envié un email a nuestra cuenta indicando quien se ha logueado y a que hora.

Esto es simplemente un ejemplo, ya que , lógicamente , seria inútil hacer una cosa así, además dellenar de correo inservible nuestra bandeja de entrada.

Vamos a crear un plugin sencillo que se va a llamar HolaMundo y que va a imprimir por pantalla,antes de que se visualice el contenido un mensaje, que previamente va a ser fijado en los parámetrosdel plugin.

Los parámetros del plugin se fijan como siempre en Joomla!, mediante el fichero xml deconfiguración.

17



Esta es la estructura de nuestro plugin :

Primero vamos a ver el fichero xml de configuración, en el que definiremos nuestro parámetro.

Como puedes observar, le estamos diciendo a Joomla que muestre en la sección de parámetros delplugin , una caja de texto de 50 de ancho, donde podremos especificar el mensaje que queremos quese muestre. Y le hemos dicho que el fichero donde se encuentra el plugin es HolaMundo.php .

18

<?xml version=”1.0″ encoding=”utf-8″ ?><install version=”1.5″ type=”plugin” group=”content”><name>Content – Hola Mundo</name><author>David Noguera</author><creationDate>15-02-2008</creationDate><authorEmail>[email protected]</authorEmail><authorUrl>www.nosolocodigo.com</authorUrl><version>1.0</version><description>Muestra un mensaje antes de mostrar elcontenido</description><files>

<filename plugin=”HolaMundo”>HolaMundo.php</filename><filename>HolaMundo.xml</filename></files><params><param name=”mensaje” type=”text” size=”50″default=”Hola, me llamo David”label=”Introduce el mensaje a ser mostrado aquí :”description=”Mensaje que se mostrará antes del contenido”/></params></install>



Vamos a crear nuestro plugin :

En Joomla 1.5 se ha introducido una nueva forma de hacer los plugins, más orientada a objetos.

Para que nuestro plugin funcione, en el fichero HolaMundo.php tendremos que crear la claseplgContentHolaMundo y decirle que derive de JPlugin.

El nombre de la clase es muy importante, si no se pone bien no funcionará.

Después crearemos el constructor de la clase, el cual invoca el constructor de la clase padre.

El constructor ha de crearse con una función de igual nombre que la clase, ya que si lo hacemos conel método __construct de php5 no será compatible con php4.

Esto se hace siempre igual en todos los plugins.

Después crearemos el metodo onBeforeDisplayContent , donde introduciremos el código quequeremos que se ejecute antes de mostrar el titulo.

Si te has fijado, el método admite como parámetro las variables $article, $params y $limitstart. Estadefinición de parámetros la tendremos que hacer siempre.

19

defined( '_JEXEC' ) or die( 'Acceso Restringido' );jimport( 'joomla.plugin.plugin' );

class plgContentHolaMundo extends JPlugin { function plgContentHolaMundo( &$subject ) {

parent:: __construct( $subject );} function onBeforeDisplayContent(&$article, &$params,$limitstart=0) {

$plugin =& JPluginHelper::getPlugin('content','HolaMundo');

$pluginParams = new JParameter( $plugin->params );

$mensaje = "";

$mensaje = $pluginParams->get('mensaje', 'HolaMundo');

$salidaPantalla = '<h2>' . $mensaje . '</h2> ';

return $salidaPantalla;}

}?>



El contenido del articulo se almacena en $article->text, es decir, que si queremos modificar algo enel contenido del articulo, deberemos modificar $article->text.

Vamos a ver el cuerpo de la función :

Con el metodo getPlugin de JPluginHelper, obtenemos el plugin pasandole como parámetro el tipo y

el nombre, por este orden.

Después en la variable $pluginParams almacenamos una instancia del objeto JParameter al que letenemos que pasar como parámetro la propiedad params del objeto plugin que previamente hemosobtenido.

Acto seguido almacenamos en la variable $mensaje el parámetro ‘mensaje’ que hemos definido en elfichero xml y que podremos cambiar en la parte de Back-End de Joomla!.

Por último almacenamos en la variable $salidaPantalla lo que queremos que se muestre antes demostrar el contenido , y la devolvemos como valor de retorno.

Crea un zip con los dos ficheros, e instálalo con el instalador de extensiones de Joomla!, después vesal Plugin Manager y actívalo, allí también podrás cambiar el mensaje que se imprime por pantalla.

Este es el resultado:

Puedes consultar los eventos disponibles en la documentación oficial de Joomla enhttp://docs.joomla.org/Tutorial:Plugins

20



7. Plantillas en Joomla

Básicamente un template puede estar formado por las siguientes carpetas y archivos:

Carpetas

cssEs la carpeta que contiene los estilos en cascada del template.

htmlEsta carpeta posee los archivos que funcionaran como plantilla especifica para módulos ycomponentes. Su uso no es prioritario pero es una funcionalidad a explotar si deseamos uncódigo personalizado para componentes/módulos.

imagesContendrá las imágenes usadas para el diseño.

21



Archivos

index.phpEl archivo principal, contendrá todo el HTML y directivas PHP de Joomla! para cargar elcontenido (artículos, componentes, módulos, etc.)

templateDetails.xmlDeterminante para que la plantilla sea reconocida en el back-end del CMS. Posee diversosdatos como licencia, autor, e-mail, etc. En Joomla! 1.5 la plantilla podrá tener parámetrosmanejables desde el back-end para cambiar la visualización del template. En este archivo seagregaran los parámetros y las posiciones de disponibles para mostrar los módulos.

template_thumbnail.pngEs la imagen que actuará como previsualización del template en la administración.

params.iniContendrá los valores para configurar los parámetros del template. Si la plantilla no poseeparámetros para configurar, este archivo no será necesario.

template.cssEs el estilo en cascada principal que se encuentra dentro de la carpeta 'css'. En la rama deJoomla! 1.0.x este archivo tenía el nombre de template_css.css

favicon.icoEs el favicon que usaremos en nuestro sitio.

Imágenes variasConformaran el diseño de la plantilla.

Dentro de la carpeta 'html', como decía más arriba, estarán archivos y carpetas específicospara los módulos y componentes del sitio. Con esto podremos manejar a nuestro gusto laapariencia y el output de dichos componentes y módulos. La idea es que la plantilla prevalezcapor encima del output HTML que genera Joomla! De esta forma, por ejemplo, podremosreemplazar todas las tablas que genera tal componente y reemplazarlas por DIVs.

Creación de la carpeta para nuestro template

Lo primero que haremos será crear la carpeta en donde se alojaran los archivos de nuestraplantilla. Para eso vamos al directorio 'templates' de Joomla! y creamos una carpeta con elnombre que queramos, en minúscula, y en caso de ser varias palabras, sin espacios. Luegopodemos crear las subcarpetas necesarias: css, images y/o HTML

22



Creación de templateDetails.xml

Podemos dividir en cuatro partes el contenido de templateDetails.xml: Datos, Archivos,Posiciones y Parámetros.

Datos

Aquí, entre cada etiqueta pondremos los datos específicos de la plantilla como su versión,autor, email, página web, año, licencia y descripción:

Archivos

Cuando hayamos terminado nuestro trabajo, aquí deberemos especificar todos los archivosque hemos utilizado para el diseño, para luego comprimir todo en ZIP y tener un instalador dela plantilla. Como ahora no necesitamos un instalador (ya que estamos creando el templatedentro del mismo Joomla!) podemos dejar estos campos incompletos, pero es muyrecomendable que al terminar el trabajo lo completemos debidamente:

Posiciones

Es importante saber con anticipación que posiciones usaremos y cuantas en nuestro sitio paraplanificar en donde mostrarlos en la plantilla.

23

<?xml version="1.0" encoding="utf-8"?><install version="1.5" type="template"><name>Nombre del template</name><creationDate>Fecha de creación</creationDate><author>Nombre del autor</author><copyright>Licencia</copyright><authorEmail>E-mail del autor</authorEmail><authorUrl>Web del autor</authorUrl><version>Versión</version>

<description><![CDATA[Aqui va la descripción, puede usarse HTML o texto plano.]]></description>

<files><filename>index.php</filename><filename>templateDetails.xml</filename><filename>template_thumbnail.png</filename><filename>favicon.ico</filename><filename>css/template.css</filename><filename>images/imagen.png</filename></files>

<positions><position>left</position><position>right</position><position>user3</position></positions>

Parámetros

Si deseamos realizar una plantilla más versátil, podemos agregarle parámetros para sermanejados desde el Back-end. Por ejemplo, si nuestra plantilla cuenta con la posibilidad deconfigurar los colores de fondo, esta opción estará habilitada para ser activada desde laadministración de Joomla!.

Creación de index.php

Para la creación del index.php, lo primero que haremos será insertar el HTML que formará lamaquetación de la plantilla. Para eso partiremos desde un layout básico de tres columnas,barra de navegación, header y footer. Entonces en index.php creamos el HTML:

24

<params><param name="color" type="list" default="blanco" label="Color de latipografia" description="Color de la tipografia"><option value="azul">Azul</option><option value="rojo">Rojo</option><option value="verde">Verde</option></param></params>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head></head><body>

<div id="contenedor"><div id="header"></div><div id="navegacion"></div><div id="izquierda"></div>

<div id="contenido"></div><div id="derecha"></div><div id="footer"></div></div>

</body></html>



Lo siguiente será ir incorporando las directivas que cargaran toda la información para que laplantilla funcione. Veamos las básicas:

<jdoc:include type="head" />

Esta directiva irá dentro de la cabecera HTML. Cargará el título de la página en cuestión,

metatags, feed, y framework javascript. Joomla! a partir de la versión 1.5 decide usar comoframework javascript a Mootools. Y esto lo hace de forma nativa, es decir que no nos dá laposibilidad de elegir entre cargarlo o no (a menos que editemos algún archivo fuente).Obviamente no hay que tomarlo para mal, sino al revés, entre líneas el equipo de Joomla! nosesta diciendo que echemos rienda suelta a nuestra imaginación y utilicemos a Mootools paraañadir efectos, nuevas propiedades o lo que queramos a la plantilla. En otras palabras, queexplotemos todo su potencial.Otro hecho es que para mostrar nuestro favicon, tendremos que añadir las líneas manualmentepara mostrarlo.

$this->template

Obtendremos el nombre de la carpeta contenedora de nuestra plantilla. Se puede utilizar para

cargar el estilo en cascada, favicon y cualquier archivo que queramos y se encuentre dentro deesta carpeta.

<jdoc:include type="modules" name="posición"style="estilo" />Con esta directiva estamos indicando la carga de un módulo en particular y de una maneraespecifica.Esto se establecerá a partir de los parámetros 'name' y 'style'. En el caso del primero,escribiremos la posición de módulo que queremos cargar. Por ejemplo, si deseamos todos losmódulos derechos, el parámetro será 'name="right"'. El segundo parámetro posee algunasvariantes, el uso de cada una va a depender de nuestras necesidades. Las variedades de estilopueden ser 'table', 'horz', 'xhtml', 'rounded' y 'raw'. Tanto con 'table' como con 'horz' elcontenido del módulo será cargado a través de tablas, la diferencia es que el primer parámetrolo hará de forma vertical (a través de una columna) y el segundo lo hará de forma horizontal (através de una fila). Si utilizamos 'xhtml' el contenido en vez de ser cargado en tablas seráinsertado en DIVs. El parámetro 'rounded' es similar a 'xhtml' con la diferencia que carga elcontenido en varios DIVs anidados. Este último se suele utilizar para realizar bordesredondeados a través de imágenes. Finalmente el parámetro 'raw' cargará el contenido neto,sin contenedores ni título.Ejemplo: Queremos insertar en DIVs todos los módulos izquierdos en determinada parte delsitio, la directiva quedará conformada por:

<jdoc:include type="component" />Con ella cargaremos el contenido principal del sitio (artículos, secciones, categorías, etc.). A

diferencia de la inclusión de módulos, esta directiva no posee parámetros para manejar endonde cargar el contenido.

25



Edición de template.css

Vamos a la carpeta 'css' y creamos el archivo template.css. Lo primero que haremos seráinsertar los estilos para la maquetación de la plantilla:

26

* {padding: 0;margin: 0;}body {font-size: 62.5%;font-family: 'Lucida Grande', Verdana, Arial, Sans-Serif;color: #333;background-color:white;}#contenedor {margin: 0 auto;width: 922px;

}#header {width: 900px;float: left;padding: 10px;margin: 10px 0px 5px 0px;}#navegacion {float: left;width: 900px;padding: 10px;margin: 0px 0px 5px 0px;}#izquierda {margin: 0px 5px 5px 0px;padding: 10px;width: 195px;float: left;}#contenido{float: left;margin: 0px 5px 5px 0px;padding: 10px;width: 456px;display: inline;

}#derecha {color: #333;margin: 0px 0px 5px 0px;padding: 10px;width: 195px;float: left;}#footer {width: 900px;clear: both;margin: 0px 0px 10px 0px;padding: 10px;

}

desarrollando con joomla i

Documents