Smarty

Para las necesidades de nuestro art�culo, supongamos que tenemos una p�gina sobre un conjunto musical. Para que el trabajo nos resulte agradable, supongamos que es el grupo The Beatles. La parte en la que mejor se pueden aplicar las plantillas es la discograf�a del conjunto. Cada disco deber�a tener su propia p�gina con el nombre del �lbum, la descripci�n de las canciones, la fotograf�a de la portada adem�s de una breve descripci�n. Todos van a utilizar las plantillas preparadas por nosotros, lo que facilita a�adir r�pido los siguientes discos, y al mismo tiempo, las modificaciones posteriores de cada una de las p�ginas.

Para eso creamos una plantilla de ejemplo, cuyo contenido se presenta en el Listado 1. Como se puede ver ya a primera vista, es un documento com�n y corriente escrito en XHTML. Sin embargo, es f�cil encontrar el lugar donde aparecen las variables. En las plantillas de Smarty, el nombre de las variables va precedido por el s�mbolo del d�lar ($) y encerrado entre claves. Adem�s, en ellas no se tienen puntos y comas, que son tan comunes en los scripts de PHP. El archivo de la plantilla es un archivo de texto com�n, al cual le asignamos la extensi�n .tpl (del ingl�s: template, es decir, plantilla). Por supuesto, nada nos impide darle la extensi�n que queramos.

Listado 1: Contenido de la plantilla album.tpl
<!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>

<meta http-equiv="content-type" content="text/html; charset=iso-8859-2" />
<meta name="description" content="Discograf�a del conjunto The Beatles" />

<title>{$albumName}</title>

</head>

<body>

<h3>{$albumName}</h3>

<table>
  <tr>
    <td><img src="{$albumCover}" alt="" /></td>
    <td><b>�ndice de canciones:</b><br />{$albumSongs}</td>
  </tr>
</table>

<h4>Descripci�n del �lbum:</h4>
<p>{$albumSynopsis}</p>

<p><a href="">P�gina principal</a></p>

</body>
</html>

El archivo debemos almacenarlo en el directorio /templates.

Cuando ya tengamos lista la plantilla, debemos utilizarla en nuestro script. Para eso creamos un documento cuyo contenido lo muestra el Listado 2. Esta vez se trata de un archivo PHP com�n. Donde se definen los valores concretos de nuestras variables y la plantilla utilizada. Este archivo se coloca junto con otros documentos web.

Listado 2: Archivo sgtpep.php, el cual va a utilizar la plantilla album.tpl
<?
require ("Smarty.class.php");

$smarty = new Smarty;

$smarty->assign("albumName", "Sgt. Pepper's lonely hearts club Band");
$smarty->assign("albumCover", "grafika/sgtpep.jpg");
$smarty->assign("albumSongs", "Sgt. Pepper's Lonely Hearts Club Band;
   With A Little Help From My Friends;Lucy In The Sky Of Diamonds;
   Getting Better;Fixing A Hole;She's Leaving Home;
   Being For The Benefit Of Mr. Kite!;Within You, Without You;
   When I'm Sixty-Four;Lovely Rita ;Good Morning, Good Morning;
   Sgt. Pepper's Lonely Hearts Club Band (Reprise);A Day In The Life");
$smarty->assign("albumSynopsis", "El �lbum m�s famoso del conjunto y uno
   de los mejores �lbumes en la historia de la m�sica. Novedoso, genial -
   - una verdadera obra de arte. El disco fue introducido al mercado en�1967 y se convirti� en uno
   de los s�mbolos de esa �poca.");

$smarty->display("album.tpl");
?>

En este lugar debemos decir algunas palabras sobre el mecanismo de Smarty. En la primera etapa, tiene lugar la compilaci�n de la plantilla. Pero esto no tiene nada que ver con la compilaci�n conocida de tales lenguajes como, por ejemplo, Java, o la compilaci�n de scripts PHP a opcode. Su prop�sito es la conversi�n de la plantilla a un documento normal de PHP. Esto significa que, por ejemplo, la notaci�n {$var} ser� cambiada a:

<?php
echo $this->_tpl_vars['var'];
?>

El documento, de esta forma, es salvado autom�ticamente dentro del directorio /templates_c. En la siguiente llamada al archivo sgtpep.php, el servidor enviar� al navegador los archivos ya convertidos, lo que permite el ahorro de tiempo y de trabajo del parser.

Figura 2. Esquema del funcionamiento del mecanismo Smarty

El efecto del funcionamiento de todo eso se presenta en la Figura 3. Ahora, expliquemos en detalle de qu� es responsable cada m�todo presentado en el Listado 2.

Figura 3. Funcionamiento de la plantilla

Para empezar, tuvimos que cargar la librer�a y crear un nuevo objeto tipo smarty. Luego utilizamos el m�todo assign para crear las variables y asignarles valores concretos. Smarty maneja los mismos tipos de variables que PHP, as� que podemos utilizar n�meros, cadenas, arrays, etc. Al final, hicimos uso del m�todo display, que carga la plantilla dada y despliega todo el documento. Desde luego, el archivo sgtpep.php podr�a contener una secuencia de funciones complicadas que permitir�an la carga de datos desde una base de datos, archivos de texto, etc. Pero supongamos que aqu� ya las conocemos y que podemos asignarlas a variables de una vez. En este momento, debemos prestar atenci�n a un punto importante. Todo lo que se colocar� en la plantilla entre llaves, ser� tratado como una posible variable o funci�n. As� que, si deseamos introducir una llave en el texto, debemos utilizar {ldelim} para la llave izquierda y {rdelim} para la llave derecha. Lo mismo se refiere a colocar en el documento estilos o scripts, por ejemplo:

<style>
p {ldelim}color: #000000;
font-size: 12px{rdelim}
</style>

Es f�cil convencerse de que este m�todo resulta fastidioso en el caso de una gran cantidad de llaves. Entonces, podemos utilizar el tag {literal} disponible en Smarty. Todo lo que se encuentra entre {literal} y {/literal} no ser� interpretado por el mecanismo Smarty.E l ejemplo anterior del c�digo lo podemos cambiar por:

{literal}
<style>
p {color: #000000;
font-size: 12px}
</style>
{/literal}

De paso mencionar� que Smarty tiene su propio mecanismo de comentarios, que son eliminados durante la compilaci�n. Los comentarios en la plantilla se inician con {* y terminan con *}.

Volviendo a nuestra plantilla de ejemplo, vemos que se pueden mejorar en ella muchas cosas. Comencemos con algo sencillo: a�adamos algunos modificadores.

COMPARTE ESTE ARTÍCULO

COMPARTIR EN FACEBOOK
COMPARTIR EN TWITTER
COMPARTIR EN LINKEDIN
COMPARTIR EN WHATSAPP
SIGUIENTE ARTÍCULO