Sections

Visión general

En sections.txt creas colecciones (hasta 40 productos por colección) que el comerciante organiza en el panel y tú exhibes donde sea mejor (home, vitrina, banners, etc.).

Estructura del archivo

Sigue una jerarquía similar a settings.txt, pero más simple. Para cada colección:

  • Nivel principal: clave de la colección (usada en Twig).
  • Nivel interno: name y description para exhibición en el panel.
Ejemplo
Produtos em destaque
    name = home_featured
    description = Coleção da Home para produtos em destaque

Ofertas da semana
    name = home_offers
    description = Produtos com descontos especiais

Dónde aparecen en el panel

  1. En la edición del producto, en Destacar producto → elegir secciones.
  2. En el listado de productos, vía botón Organizar para agregar varios a la vez.


Integración con settings (opcional)

Es común exponer en settings.txt un dropdown para que el comerciante elija qué colección exhibir en un área del tema (ej.: vitrina de la Home):

dropdown
    name = home_section_to_show
    description = Qual coleção será exibida na Home?
    values
        home_featured = Produtos em destaque
        home_offers = Ofertas da semana

Luego, en el template, puedes incluir un snipplet pasando la clave seleccionada:

{% include 'snipplets/home/collection-grid.tpl' with { section_key: settings.home_section_to_show } %}
Observación

La forma de buscar y renderizar productos de la colección varía por tema. Usa el snipplet/patrón del tema para listar productos a partir de la section_key.

Buenas prácticas

  • Define nombres de claves descriptivos y estables (ej.: home_featured).
  • Usa descripciones claras para orientar al comerciante en el panel.
  • Evita duplicar colecciones con el mismo propósito.
  • Documenta en el tema dónde se usa cada colección.

Cómo el tema arma vitrinas múltiples

En el componente snipplets/home/home-featured-products.tpl creamos las vitrinas de la Home reutilizando el mismo snipplet para varias colecciones.


Podemos tener cinco vitrinas diferentes utilizando el mismo componente, solo cambiando la colección informada vía with:

{# no home-section-switch.tpl #}
{% include 'snipplets/home/home-featured-products.tpl' with { has_featured: true } %}
{% include 'snipplets/home/home-featured-products.tpl' with { has_secondary: true } %}
{% include 'snipplets/home/home-featured-products.tpl' with { has_tertiary: true } %}
{% include 'snipplets/home/home-featured-products.tpl' with { has_quaternary: true } %}
{% include 'snipplets/home/home-featured-products.tpl' with { has_quinary: true } %}

Dentro de home-featured-products.tpl normalizamos las flags y buscamos los productos:

{# garante false se não vier no with e verifica se há produtos #}
{% set has_featured    = has_featured    | default(false) and sections.primary.products %}
{% set has_secondary   = has_secondary   | default(false) and sections.secondary.products %}
{% set has_tertiary    = has_tertiary    | default(false) and sections.tertiary.products %}
{% set has_quaternary  = has_quaternary  | default(false) and sections.quaternary.products %}
{% set has_quinary     = has_quinary     | default(false) and sections.quinary.products %}

{% if has_featured %}
  {% set products = sections.primary.products | slice(0, 8) %}
  {% include 'snipplets/home/collection-grid.tpl' with { products: products } %}
{% endif %}

{% if has_secondary %}
  {% set products = sections.secondary.products | slice(0, 8) %}
  {% include 'snipplets/home/collection-grid.tpl' with { products: products } %}
{% endif %}

Seleccionando colección dinámicamente

Cuando la colección viene de un dropdown en settings, recupera la clave dinámicamente con attribute:

{% set key = settings.home_section_to_show | default('home_featured') %}
{% set products = attribute(sections, key).products %}

{% if products is not empty %}
  {% for product in products | slice(0, 12) %}
    {% include 'snipplets/product-card.tpl' with { product: product } %}
  {% endfor %}
{% else %}
  {% if show_help or show_component_help %}
    {% include 'snipplets/svg/empty-placeholders.tpl' %}
  {% endif %}
{% endif %}

Límite, offset y paginación simple

Controla la cantidad de ítems e implementa una paginación básica con slice:

{# primeiros 8 itens #}
{% set first_page = sections.primary.products | slice(0, 8) %}

{# próxima página (offset 8, tamanho 8) #}
{% set second_page = sections.primary.products | slice(8, 8) %}

Exhibiendo productos de una colección

Usa el snipplet de tarjeta del tema e itera sobre los productos de la colección:

{% for product in sections.primary.products | slice(0, 4) %}
  {% include 'snipplets/product-card.tpl' with { product: product } %}
{% endfor %}
Atributos útiles

Consulta los métodos y atributos soportados en docs. En general, product.name y demás atributos básicos están disponibles en los snipplets del tema.