Desde el 2011 tengo un cliente que me ha costado muchos nervios y sudor, pero al mismo tiempo me ha ayudado muchísimo en mi desarrollo con Joomla, hasta el punto de programar mis propios plugins!

Problema

Uno de los problemas que hemos tenido es la necesidad de escribir letras voladas en el título de un artículo (por ejemplo: 3rd World Congress = 3^rd World Congress ). Eso no funciona en Joomla, cualquier intento de utilizar una etiqueta HTML en un título será ignorado o la etiqueta será eliminada.

Idea 1 = Quick and dirty

La primera solución fue publicar los artículos sin mostrar el título y escribir el título comocomo primera línea del artículo. No es la solución más elegante ya que si por ejemplo se muestra el ícono para imprimir la página, este aparecerá sobre el título y no debajo como en el resto de las páginas. Otro problema es que si se muestra el artículo en otra parte del sitio, por ejemplo en un módulo o en un archivo, el título seguirá siendo incorrecto sin las letras voladas.

Idea 2 = Overrides

En una charla de David Jardin en el JoomlaDay Alemania 2014, ví un código que me dió una idea de cómo solucionar el problema.

La idea fue así:
En el título del artículo uso un carácter especial (que no suele ser usado normalmente) para marcar la parte del texto que tiene que aparecer como letras voladas. Por ejemplo "3||rd|| World Congress". En un override agregué un código que me permite separar las distintas partes del título:

En la cabecera de com_content/article/default.php 

$suptype = $this->escape($this->item->title); 

// Creo una variable nueva para el título

if (strpos($suptype, "||") !==false) {

	$parts = explode("||", $suptype, 3);

	$suptype = $parts[0] . '' . $parts[1] . '' . $parts[2];

}

else {

	$suptype = $suptype;

}


// Se separan las distintas partes del título usando mi marcador "||" y se vuelve a escribir el título pero con la etiqueta HTML correspondiente para letras voladas (<sup>)

Y un poco más abajo reemplazo el título con mi nueva variable:

<?php if ($params->get('show_title')) : ?>
<h2>
<?php if ($params->get('link_titles') && !empty($this->item->readmore_link)) : ?>
<a href="/<?php echo $this->item->readmore_link; ?>">
<?php echo $suptype; ?></a>
<?php else : ?>
<?php echo $suptype; ?>
<?php endif; ?>
</h2>
<?php endif; ?>

En ese momento todavía estaba usando Joomla 2.5 que todavía no tenía el tema de layouts en uso. Quiere decir que tenía que escribir ese código en diferentes overrides: para artículos, para blog layouts, para archivos.... No era lo ideal.

Idea 3 = Plugin

A fines del 2014 me compré el libro "Programming Joomla! Plugins" de Jisse Reitsma. Un libro muy recomendable para todos los que quieren empezar a programar extensiones para Joomla! Después de leer algunos capítulos me salió la idea de crear mi propio plugin para modificar el título de un artículo.

Probando y fallando se aprende!

Mi primer intento programando un plugin de contenido no funcionó y Jisse Reitsma me ayudó a entender por qué:

En Joomla un título se presenta usando una función (<?php echo $this->escape($this->item->title); ?>) que retira las etiquetas HTML. No importa cómo cambie el contenido del artículo usando mi plugin, la plantilla del artículo me quitará los cambios.

La solución para este problema fué el crear un plugin de sistema que utiliza el evento onAfterRender() para reemplazar mi marcador directo en el "body" del HTML. De esta manera el plugin sirve no sólo para reemplazar el título de un artículo sino también de categorías, en módulos, etc.

Después de muchas idas y venidas (y con la ayuda de mi marido) logré crear un plugin que permite agregar clases CSS dentro del título de un artículo (o donde sea necesario), de esa manera no sólo se pueden crear títulos con letras voladas (que era el problema principal) sino también con partes en otro color o con otra fuente de tipografía, etc., todo depende de las definiciones que le demos a la clase CSS.

Ejemplo de uso

En el campo de título escribimos la parte del texto que debe ser formateado de otra manera entre llaves, usando "titlechange:" como marcador, más el nombre de la clase ({titlechange:mi-clase texto a formatear}).

Título en {titlechange:title1 cursiva} y {titlechange:title2 subrayado} de color {titlechange:title3 rojo}

El resultado en HTML es así:

<h2 itemprop="name">Título en <span class="title1">cursiva</span> y <span class="title2">subrayado</span> de color <span class="title3">rojo</span></h2>

En nuestra hoja de CSS creamos las clases correspondientes:

.title1 {
font-style: italic;
}
.title2 {
text-decoration: underline;
}
.title3 {
color: #cc0000;
}

Y este es el resultado final:

Las posibilidades y combinaciones son múltiples!

Conclusión

Puedes tomar un problema como un dolor de cabeza sin solución o te dejas incentivar por él y tratas de solucionarlo de la mejor manera posible. Un problema puede tener diferentes soluciones, lo importante es tratar de desarrollar la mejor solución y seguir avanzando con los conocimientos de Joomla!

El plugin puede ser descargado de mi repositorio de Github: https://github.com/drmenzelit/Joomla-Plugin-Title-Change