Estructura de Carpetas

Layouts

Contiene el archivo layout.tpl que contiene el html común a todas las pantallas.

En este archivo se abre y se cierra la etiqueta <html>, se incluye el <head>, y los componentes del body que no son específicos de cada pantalla, como la navegación, el header o el footer.

Este archivo funciona como un marco para tu diseño, el contenido específico de cada sección se carga con la etiqueta {% template_content %}, que se reemplaza por el contenido de la sección, como por ejemplo: home.tpl para la página de inicio.

Para ver en detalle el contenido de esta carpeta visitá Base | Layout

Static

En esta carpeta se guardan todas las imágenes, css, scss y javascript que quieras usar en el diseño. 

También contiene el archivo checkout.scss.tpl que tiene los estilos gráficos que se aplican al checkout. Es importante que este archivo no cambie de ubicación ya que la plataforma lo buscará en esta carpeta.

Para ver en detalle el contenido de esta carpeta visitá Base | Static


Templates

En esta carpeta están los html específicos de cada pantalla. Recordá que no tenes que abrir la etiqueta <html> dentro de estos archivos, ya que se abre y cierra dentro del layout.tpl.

Esta carpeta debe contener:

  • home.tpl — Página de inicio
  • category.tpl — Página de listado de productos de una categoría
  • product.tpl — Página de un producto
  • cart.tpl — Página del carrito de compras
  • contact.tpl — Página de contacto
  • search.tpl — Página de resultados de búsqueda
  • page.tpl — Modelo de página interna que se crea desde el administrador de contenidos
  • 404.tpl — Página de error 404 (página no encontrada)
  • password.tpl — Página en construcción
  • /account
    • login.tpl — Página de inicio de sesión de una cuenta de usuario
    • register.tpl — Página de registro de una cuenta de un usuario.
    • info.tpl — Página con información personal del usuario
    • address.tpl — Página con form para completar la dirección del usuario
    • addresses.tpl — Página con el listado de direcciones del usuario
    • order.tpl — Página del detalle de una orden.
    • orders.tpl — Página con el listado de ordenes de un usuario.
    • newpass.tpl — Página de ingreso de nueva contraseña.
    • reset.tpl — Página de reinicio de contraseña de un usuario.

Snipplets

En esta carpeta tenés porciones de html reutilizables. Pueden ser componentes, secciones y elementos.

Existen tres formas de llamar a un snipplet: {% snipplet %} {% include %} {% enbed %}

En este artículo mostramos cuándo y cómo utilizar cada tipo.

Config

En esta carpeta vas a encontrar los archivos .txt de configuración de tu theme.

  • settings.txt — Acá van los valores que el administrador de la tienda puede modificar. Por ejemplo, podés pedirle que elija un color para utilizar en el html, o en style-colors.scss.tpl
  • variants.txt — Si quieres ofrecer variantes, podés determinar valores para diferentes settings en este archivo.
  • defaults.txt — Acá puedes poner los valores por defecto de los settings.
  • sections.txt — Acá puedes definir secciones, que permiten crear niveles de destacados. Podés tener, por ejemplo, una sección "Principal" y otra "Secundaria". El administrador de la tienda puede decidir en qué sección quiere destacar sus productos.
  • translations.txt — Si tu theme soporta múltiples idiomas, acá debes incluir las traducciones de los textos que utilizas en el diseño.