Documentación Bootic

Todo la información para empezar a vender en línea.

¿Qué es una variable?

Una variable es, esencialmente, un objeto que representa un valor. Este valor puede ser una cadena de texto, un número, o bien un conjunto de elementos. En el primer y segundo caso, para desplegar su contenido debemos encerrar el nombre de la variable con los caracteres {{ y }} (también llamados bigotes):

{{ product.url }}

A este tipo de variables se les puede aplicar los filtros de texto.

Ahora, en caso de que la variable represente un conjunto de elementos, necesitamos poder iterar sobre ellos para entonces usar los bigotes sobre los atributos que queramos usar o desplegar. Para esto usamos la etiqueta for. Ejemplo:

{% for collection in collections %}
  {{ collection.url }}
{% endfor %}

A este tipo de variables, que corresponden a conjunto de elementos, nos referimos como variables iterables. A ellas se les puede aplicar los filtros de conjunto.

Variables globales vs. locales

En el sistema de plantillas de Bootic, hay ciertas variables que son "globales", es decir, están disponibles para usarse en cualquier plantilla.

Una variable global, por ejemplo, es shop, que contiene la información asociada a la tienda -- como su nombre y URL -- y por lo tanto es muy útil tenerla a mano para utilizarlo en cualquier plantilla, ya sea un formulario de contacto (form.html) o bien, la portada del sitio (home.html). Por ejemplo:

<p>Bienvenido a {{ shop.name }}!</p>

Sin embargo existen otras variables que dependen del contexto y que sólo están disponibles en algunas plantillas. A éstas nos referimos como variables locales.

Un ejemplo de esto es product, que no está disponible en un formulario de contacto pero sí en la plantilla del detalle de un producto (product.html).

Esto es porque al mostrarse el detalle de un producto, Bootic sabe cuál producto es el que está mirando el usuario y por tanto asocia ése producto específico a la variable product. Por el contrario, al visitar un formulario de contacto, al no estar mostrándose un producto específico Bootic no sabría qué producto asociar a la variable product.

Listado de variables globales

  • template: Nombre de la plantilla actual (home, products, page, etc)
  • resource: Variable especial que representa al objeto principal de la plantilla. Más infomación abajo.
  • current_page: Entrega el número de la página actual, en caso de que haya paginación.
  • shop: Contiene el nombre, la URL y la descripción de la tienda.
  • menus: Conjunto de menús de la tienda.
  • all_products: Conjunto de todos los productos visibles de la tienda.
  • product_types: Conjunto de tipos de producto de la tienda.
  • collections: Conjunto de colecciones de productos de la tienda.
  • vendors: Conjunto de marcas/fabricantes asociados a los productos.
  • pages: Conjunto de páginas de la tienda.
  • forms: Conjunto de formularios de la tienda.
  • blog: Conjunto de noticias publicadas.

Cómo usar las variables globales

all_products

Este ejemplo muestra cómo crear un listado paginado de 5 productos por página. Más información en sección [Paginación](/es/diseno/recetas/paginacion).
{% paginate all_products by 5 %}
  {% for product in paginated_list %}
    <p>
      <a href="{{ product.url }}">{{ product.model }}</a> |
      <span class="price">{{ product.price.format }}</span>
    </p>
  {% endfor %}
  {{ paginated_list | pagination }}
{% endpaginate %}

collections

{% for collection in collections.all %}
  <a href="{{ collection.url }}">{{ collection.title }}</a>
{% endfor %}
También es posible acceder a una colección por nombre, usando la manilla o título normalizado. Este ejemplo itera los productos de la colección "ofertas".
{% for product in collections.ofertas.products %}
  <a href="{{ product.url }}">{{ product.model }}</a>
{% endfor %}

pages

{% for page in pages.all %}
  <a href="{{ page.url }}">{{ page.title }}</a>
{% endfor %}

forms

{% for form in form.all %}
  <a href="{{ form.url }}">{{ form.title }}</a>
{% endfor %}

menus

blog

{% for post in blog.posts %}
  <a href="{{ post.url }}">{{ post.titl }}</a>
{% endfor %}

product_types

{% for product_type in product_types.all %}
  <a href="{{ product_type.url }}">{{ product_type.name }}</a>
{% endfor %}
Este ejemplo itera los productos del tipo "zapatos":
{% if product_types.zapatos.has_products %}
  {% for product in product_types.zapatos.products %}
    <a href="{{ product.url }}">{{ product.model }}</a>
  {% endfor %}
{% endif %}

vendors

{% for vendor in vendors.all %}
  <a href="{{ vendor.url }}">{{ vendor.name }}</a>
{% endfor %}

resource

Referencia al objeto principal de una página. Por ejemplo, en la plantilla collection.html, resource es la colección actual. En product.html, resource es el producto actual, también disponible en el objeto product. resource es útil para comparar con objetos en una lista, por ejemplo, y destacar la página actual en un menú.
<ul>
  {% for link in menus.sidebar %}
  <li class="{{ 'current' | print_if_equal: resource, link }}">
    {{ link.title | link_to: link.url }}
  </li>
  {% endfor %}
</ul>

Crea tu tienda hoy mismo. Sin compromisos. Ver planes