Acá vas a encontrar:
Qué es twig
Twig es un motor de creación de plantillas para utilizar con PHP (que es el lenguaje en el que está desarrollado Tiendanube). Como podrán imaginar, se ocupa de brindar una solución al tratamiento de las cuestiones visuales alrededor de una aplicación desarrollada en este lenguaje.
Existen algunos motivos por los cuales las herramientas de este tipo son útiles, por ejemplo:
Usar Twig (o cualquier otro motor de template) para definir el layout de un sitio web hace que la experiencia de implementar un diseño sea mucho más limpio y menos engorroso.
Permite separar por completo el diseño de la lógica, evitando complejizar por demás el desarrollo de la propia plataforma.
Como ya se habrán dado cuenta, al independizar ambas capas (la de diseño y la de lógica) también brinda flexibilidad absoluta en relación con la imagen del sitio.
Por qué usamos Twig en Tiendanube
En el caso particular de Tiendanube, hay varios motivos por los cuales utilizamos Twig. Por empezar, un sitio de ecommerce maneja una lógica muy compleja: hay muchos productos, muchas categorías, distintas variantes para los productos, se los agrega al carrito, entre otras cosas. Si además, entre todo eso, hubiera que definir el diseño de cada página, sería poco menos que una pesadilla.
Por otro lado, por la naturaleza misma de una tienda online, hay páginas que se repiten muchas veces. Por ejemplo, la página de producto o la página de categorías. Gracias a nuestras plantillas diseñadas en twig, es posible diseñar cada una de estas una única vez y que se repliquen tantas veces como sea necesario. Práctico, ¿no?. No solo eso, sino que permite dar total libertad a cada uno de nuestros clientes en relación con la imagen de su tienda. Es precisamente esto lo que nos da la posibilidad de ofrecer flexibilidad absoluta en relación con el HTML, CSS y JavaScript de las tiendas. Por último, es muy fácil de aprender. Si eres diseñador y tienes conocimiento de HTML y CSS, Twig es la herramienta ideal para que puedas trabajar con nuestras plantillas sin necesidad de aprender PHP. Diseñas libremente, sin necesidad de programar.
Cómo modificar una plantilla
Ahora bien, ya sea que te interese modificar o crear una plantilla, o implementar un diseño totalmente a medida, hay algunas cuestiones que son importantes a tener en cuenta.
En primer lugar, debes saber que el código generado para una plantilla en Twig, es simplemente código HTML, pero con algunas particularidades. Por ejemplo, permite incluir variables o expresiones que luego serán reemplazadas cuando se ejecute la plantilla. También es posible crear una estructura de árbol para que un “layout” herede comportamiento de otro y a su vez extienda su funcionalidad si es necesario. En particular, las plantillas de los diseños de Tiendanube están organizados en una estructura de carpetas y archivos. En cuanto a los archivos, existe un archivo con extensión “.tpl” por cada tipo de página que existe dentro de la tienda. De acuerdo con esto, los archivos .tpl que existen son los siguientes:
layout.tpl: este archivo contiene el head y el body del html, y todo el contenido común a todas las pantallas de la tienda, como ser el menú de navegación, el footer, o la información de contacto.
home.tpl: contiene la información relativa a la página de inicio de la tienda.
category.tpl: contiene la estructura de la página del listado de productos de una categoría.
product.tpl: contiene la estructura de la página de un producto en particular.
cart.tpl: contiene la estructura de la página del carrito de compras.
contact.tpl: contiene la estructura de la página de contacto.
search.tpl: es la página de resultados de búsqueda.
page.tpl: contiene la estructura de las páginas de contenido que pueden ser creadas dentro de la tienda.
404.tpl: es la página de error 404 (página no encontrada).
Si quieres conocer más sobre las carpetas y archivos de nuestras plantillas, puedes leer nuestra Documentación para Diseñadores.