Es fascinante como se puede cambiar la vista (y en parte la función) de los componentes y módulos de Joomla! con trucos simples. En este artículo quiero presentar algunas de esas ideas, en parte salidas de lo qué escuché en el JoomlaDay! Alemania.

Qué aprendí visitando el JoomlaDay! en Alemania

El 12 y 13 de septiembre tuvo lugar el JoomlaDay! en Colonia, Alemania. Y yo estuve presente!

Si no conté mal hubo 51 presentaciones. Cuatro temas se daban siempre en paralelo. Con semejante cantidad de información es muy difícil decidir qué escuchar. Yo me decidí sobre todo por presentaciones relacionadas con plantillas, overrides y layouts.

Es fascinante como se puede cambiar la vista (y en parte la función) de los componentes y módulos de Joomla! con trucos simples. En este artículo quiero presentar algunas de esas ideas.

Una presentación de David Jardin (uno de los organizadores del JoomlaDay! y muy activo en la comunidad Joomla!) me inspiró y quise aplicar algunas de sus ideas en mis proyectos.

La oportunidad se dió hace unos días cuando decidí actualizar un portal de información para padres que armé hace unos años (“Eltern wissen wo” - Padres saben donde). El portal todavía estaba en Joomla! 2.5 y lo pasé a Joomla! 3.3.

Lo primero que descubrí es que el nuevo sistema JLayout de Joomla! todavía no está presente en todas las vistas. Por ejemplo existe un layout para el bloque de información que aparece bajo el título de un artículo (categoría, fecha de creación, autor, etc.), pero el mismo no está integrado como Jlayout en todos lados.

Por ejemplo blog_item.php usa ya el JLayout:

<?php // Todo Not that elegant would be nice to group the params ?>
<?php $useDefList = ($params->get('show_modify_date') || $params->get('show_publish_date') || $params->get('show_create_date')
|| $params->get('show_hits') || $params->get('show_category') || $params->get('show_parent_category') || $params->get('show_author') ); ?>
<?php if ($useDefList && ($info == 0 || $info == 2)) : ?>
<?php echo JLayoutHelper::render('joomla.content.info_block.block', array('item' => $this->item, 'params' => $params, 'position' => 'above')); ?>
<?php endif; ?>

En la vista de artículos y artículos destacados lamentablemente todavía no está presente la parte de JLayout. Aquí el bloque de información está directamente codificado en el fichero de PHP.

Bien, entoncés lo que hice fué crear los correspondientes overrides:

/templates/mi_template/html/com_content/article/default.php
/templates/mi_template/html/com_content/featured/default.php

En los dos ficheros quité el código del bloque de información e inserté el llamado al JLayout:

<?php echo JLayoutHelper::render('joomla.content.info_block.block', array('item' => $this->item, 'params' => $params, 'position' => 'above')); ?>

Como me creé una plantilla propia que usa Bootstrap 3 (Joomla! todavía usa Bootstrap 2) tuve que hacer otros pequeños cambios en las vistas. Cuando creo mis propias plantillas uso como base el BlankTemplate de Alexander Schmidt.

Por ejemplo en la vista de blog cambié las definiciones para columnas de “span-?” a “col-md-?” para que funcionen bien con Bootstrap 3.

El bloque de información usa las definiciones de íconos de Bootstrap 2, así que aquí también tuve que hacer algunos cambios.

Overrides del bloque de información:

/templates/mi_template/html/layouts/joomla/content/info_block/

block.php: Aquí removí el título “Detalles” (como se puede ver en el comentario en el código, los desarrolladores de Joomla! tienen planeado poner este título también como parámetro, para que uno pueda decidir si lo quiere mostrar o no)

<dt class="article-info-term">
<?php // TODO: implement info_block_show_title param to hide article info title ?>
<?php if ($displayData['params']->get('info_block_show_title', 1)) : ?>
<?php echo JText::_('COM_CONTENT_ARTICLE_INFO'); ?>
<?php endif; ?>
</dt>

create_date.php: Aquí cambié la definición del ícono calendario para que se ajuste a Bootstrap 3 (lo mismo hice en los ficheros modify_date.php y publish_date.php)

<dd class="create">
<span class="fa fa-calendar"></span>
<time datetime="<?php echo JHtml::_('date', $displayData['item']->created, 'c'); ?>" itemprop="dateCreated">
<?php echo JText::sprintf('COM_CONTENT_CREATED_DATE_ON', JHtml::_('date', $displayData['item']->created, JText::_('DATE_FORMAT_LC3'))); ?>
</time>
</dd>

hits.php:  Aquí cambié el ícono de ojo para Bootstrap 3

<dd class="hits">
<span class="fa fa-eye"></span>
<meta itemprop="interactionCount" content="UserPageVisits:<?php echo $displayData['item']->hits; ?>" />
<?php echo JText::sprintf('COM_CONTENT_ARTICLE_HITS', $displayData['item']->hits); ?>
</dd>

Así aparece el bloque de información ahora:

Lo mejor para el final - Calendario de eventos con un override del módulo “mod_articles_latest”

La idea la presentó David Jardin en sus charlas. Yo adapté la idea para mi proyecto creando un override de “mod_articles_latest” que nombré events.php (no quiero que todos los módulos de últimos artículos aparezcan como calendarios de eventos).

Código original (default.php):

<ul class="latestnews<?php echo $moduleclass_sfx; ?>">
<?php foreach ($list as $item) :  ?>
<li itemscope itemtype="http://schema.org/Article">
<a href="/<?php echo $item->link; ?>" itemprop="url">
<span itemprop="name">
<?php echo $item->title; ?>
</span>
</a>
</li>
<?php endforeach; ?>
</ul>

Override (events.php): Cambié la lista “ul” por una “dl” y agregué un llamado a la fecha de creación del artículo. De esta manera se pueden usar los artículos de una determinada categoría (p.ej. Eventos) para mostrarlos como calendario. La fecha del evento se puede ingresar manualmente como fecha de creación del artículo. Además agregué el ícono de calendario delante de la fecha.

<dl class="latestnews<?php echo $moduleclass_sfx; ?>" itemscope itemtype="http://schema.org/Event">
<?php foreach ($list as $item) :  ?>
<dt itemprop="Date">
<span class="fa fa-calendar">&nbsp</span><?php echo JHtml::_('date', $item->created, "d.m.Y"); ?>
</dt>
<dd>
<a href="/<?php echo $item->link; ?>" itemprop="url">
<span itemprop="name">
<?php echo $item->title; ?>
</span>
</a>
</dd>
<?php endforeach; ?>
</dl>

El módulo terminado se vé así:

Pienso que con un poco de fantasía se pueden cambiar muchas cosas sin necesidad de sobrecargar Joomla! con componentes y módulos de terceros.

En otra charla del JoomlaDay! Sven Schultschick presentó su idea de crear un repositorio en github, para intercambiar Joomla! Overrides. En este repositorio espero poder compartir pronto los overrides que presenté en este artículo (y otros también). Hasta entonces los ficheros explicados se pueden bajar desde mi blog.

La mayoría de las charlas del JoomlaDay! se dieron en alemán, pero varias fueron en inglés, por ejemplo las de Brian Teeman, Oliver Nolbert, Peter Martin, Michael Babker y Sander Potjer. Recomiendo echarle una vista al canal de videos en YouTube!

Saludos desde la ya otoñal Alemania!