Vista Smarty
1Presentación
Smarty es un motor de plantillas popular. Ofrece la ventaja de una sintaxis fácil de entender para
personas sin formación informática (diseñadores gráficos, diseñadores web).
Empieza por consultar la presentación hecha en la introducción.
Aquí te presentaremos algunas instrucciones básicas. Para más información, visita la documentación de Smarty.
2Instalación
Esta vista es compatible con las versiones 4 y 5 de Smarty.
Consulta la documentación de instalación de Temma para saber cómo instalar Smarty.
3Archivos de plantilla e inclusión
Los archivos de plantilla son simples archivos de texto, destinados a contener código HTML.
Puedes segmentar tus páginas muy fácilmente haciendo inclusiones de plantillas.
Por ejemplo, supongamos que tienes dos acciones, list y show, que muestran
páginas diferentes usando respectivamente los archivos list.tpl y show.tpl.
Si estas dos páginas muestran la misma cabecera de página, es mejor separarla para no tener que copiarla en cada página.
Smarty ofrece la posibilidad de incluir plantillas unas dentro de otras gracias a la instrucción
include.
Así, podrías tener el archivo header.tpl, que se vería así:
<html>
<head>
<title>Título genérico de página</title>
</head>
<body>
Nuestras dos plantillas de página se verían entonces así:
<!-- archivo list.tpl -->
{include file="header.tpl"}
<h1>LISTA</h1>
</body>
<!-- archivo show.tpl -->
{include file="header.tpl"}
<h1>MOSTRAR CONTENIDO</h1>
</body>
4Variables
Una de las primeras necesidades es poder mostrar el contenido de una
variable.
Imagina que el controlador contiene el siguiente código:
$this['name'] = 'Anakin';
Puedes mostrar muy fácilmente el valor de la variable name en tu plantilla:
{$name}
Esto tendrá el efecto de mostrar el siguiente texto:
Anakin
5Listas
Supongamos que tu controlador define una variable de plantilla que contiene una lista:
$this['fruits'] = [
'naranja',
'plátano',
'fresa',
];
Puedes mostrar fácilmente cualquiera de los valores de la lista:
{$fruits[2]}
Y obtendrás:
fresa
6Arrays asociativos y objetos
Es posible mostrar el contenido de un elemento de un array asociativo a partir de su clave, o de un atributo de un objeto a partir de su nombre. Por ejemplo:
$this['colors'] = [
'red' => '#ff0000',
'green' => '#00ff00',
'blue' => '#0000ff',
];
Para mostrar un color, basta con escribir:
{$colors.red}
Lo que dará:
#ff0000
7Condiciones
Para hacer un tratamiento condicional, puedes usar la instrucción if, que usa variables siguiendo la sintaxis vista anteriormente.
Por ejemplo, si tu controlador define una variable de plantilla que contiene información de un usuario:
$user = $this->_dao->get($userId);
$this['user'] = $user;
Entonces podrás mostrar un enlace solo si el usuario es administrador:
{if $user.roles.admin}
<a href="/user/show/{$user.id}">Ver mi cuenta</a>
{/if}
8Bucles
Muy a menudo, necesitas aplicar un tratamiento a un grupo de elementos. Esto suele tomar la forma de una lista de elementos
obtenidos de la base de datos, que quieres mostrar uno tras otro.
Para hacerlo, Smarty ofrece la instrucción
foreach.
Imagina que el controlador obtiene una lista de usuarios de la base de datos:
$users = $this->_dao->search();
$this['users'] = $users;
Es muy fácil recorrer todos los usuarios para mostrar su nombre:
<ul>
{foreach $users as $user}
<li>{$user.name}</li>
{/foreach}
</ul>
9Escape
Si una variable contiene caracteres especiales ("<", ">", "&", ...), no debes arriesgarte a escribirla tal cual en la plantilla,
ya que de lo contrario generarás un flujo HTML no conforme.
Para lograrlo, Temma activa por defecto la opción de auto-escape
de Smarty. Esto significa que todos los caracteres especiales se convierten automáticamente (< en <, > en >,
& en &, etc.).
Para que una variable no se escape automáticamente, debe usarse el filtro raw.
Ejemplos:
{$txt = "a & b"}
{* variable escapada automáticamente: escribe "a & b" *}
{$txt}
{* variable no escapada: escribe "a & b" *}
{$name|raw}
Para desactivar el auto-escape, añade una directiva a la configuración extendida x-smarty (archivo etc/temma.php):
<?php
return [
'x-smarty' => [
'autoEscape' => false
]
];
Smarty también ofrece el filtro escape, que escapa los caracteres especiales. Por defecto, con el auto-escape activado, este modificador no hace nada (no hay doble escape). Pero es posible usar este modificador con diferentes opciones (“htmlall”, “url”, “urlpathinfo”, “quotes”, “hex”, “hexentity”, “javascript”, “mail”) que tendrán un impacto en la variable modificada. También es posible usar el parámetro “force”, que provocará un doble escape cuando el auto-escape esté activado.
Se usa de la siguiente manera:
{$name|escape}
{$user.name|escape:'hex'}
{$user.firstname|escape:'force'}
No puedes colocar directamente caracteres de llave ("{", "}") en una plantilla, ya que serán interpretados por las instrucciones de Smarty. Por tanto, debe usarse la instrucción literal, que impide la interpretación por parte de Smarty.
Por ejemplo, para escribir código JavaScript en una página, podrías escribir:
{literal}
<script>
function something() {
...
}
</script>
{/literal}
10Plugins
Smarty tiene su propio sistema de plugins, que permite por ejemplo crear filtros de manipulación de datos.
Por ejemplo, podrías crear un filtro que se use para reemplazar todas las letras "T" por un punto (no sirve de nada, pero es para el ejemplo):
function smarty_modifier_warp($text) {
return str_replace('T', '.', $text);
}
Lo usarías así en tus plantillas:
{$variable|warp}
Para que tu plugin sea utilizable por Smarty, debes colocar tu función en un archivo llamado modifier.warp.php.
Este debe ubicarse en el directorio lib/smarty-plugins de tu proyecto.
Si tienes otro directorio que contenga plugins de Smarty, deberás añadir su ruta en la configuración
del proyecto (archivo etc/temma.php):
<?php
return [
'x-smarty' => [
'pluginsDir' => '/path/to/the/directory'
]
];
Si tienes varios directorios que contienen plugins de Smarty, puedes listarlos todos:
<?php
return [
'x-smarty' => [
'pluginsDir' => [
'/path/to/the/directory1',
'/path/to/the/directory2',
'/path/to/the/directory3',
]
]
];