product

Como utilizar o objeto product

O objeto {{ product }} é disponível na página de produto e através da tag [{% load_products %}]. O objeto possui todas as informações disponíveis para cada produto registrado através da plataforma.

Atributos do objeto:

active

Retorna true ou false, caso o produto esteja ativo ou não.

available

Retorna true ou false, caso o produto esteja disponível para compra.

{% if product.available %}
  <p>{{ product.price | money_format }}</p>
{% else %}
  <p class="product-unavailable">Produto indisponível.</p>
{% endif %}

created_at

Retorna a data e o horário de criação do produto. O formato de retorno dos dados é o ISO 8601.

A exibição desse atributo pode ser controlada através do filtro date.

description

Retorna o texto de descrição do produto, em HTML.

Você pode definir seções diferentes para a descrição, e controlá-los com filtros:

{% assign product_description_sections = product.description | split: "<hr/>" %}

{% for description_section in product_description_sections %}
<section>
  {{ description_section }}
</section>
{% endfor %}
<section>
  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec orci libero, blandit vitae tellus ut, rhoncus dapibus purus. Donec ullamcorper vehicula ligula.</p>
  <p>Nec cursus tortor interdum a. Sed vel lacinia sem. Fusce at velit ac urna pulvinar facilisis a ut ante. Curabitur pulvinar lacus neque, ac venenatis ante lobortis non.</p>
</section>

<section>
  <p>Interdum et malesuada fames ac ante ipsum primis in faucibus. Nullam ac laoreet ligula, quis imperdiet ante. Nullam auctor ipsum at tellus elementum bibendum.</p>
</section>

discount

Retorna a descrição da promoção aplicada.

discount_id

Retorna o ID da promoção aplicada ao produto.

discount_rule

Retorna a regra de desconto aplicada ao produto (se é em porcentagem ou em valor absoluto).

id

Retorna o ID do produto.

images

Retorna uma lista de URLs das imagens do produto, e os SKUs de variantes relacionadas em cada imagem.

image_url

Retorna a URL da imagem principal do produto.

<figure>
  <picture>
    <source srcset="{{ product.image_url | resize: '600x' }}" media="(max-width: 600px)" />
    <source srcset="{{ product.image_url | resize: '800x' }}" media="(max-width: 800px)" />
    <img src="{{ product.image_url }} alt="{{ product.name }}" />
  </picture>
</figure>

Cada imagem possui as seguintes informações:

  • SKU: retorna o SKU da variante relacionada à imagem
  • URL: retorna a URL da imagem

Se uma imagem for relacionada à duas SKUs diferentes, haverá um registro duplicado para a mesma URL. Você pode evitar que isso aconteça filtrando a lista com o filtro uniq.

{% assign product_image_urls = product.images | map: "url" | uniq %}

installments

Retona um array com as opções de parcelamento da variante. O array contém:

  • Quantidade de parcelas (number);
  • Preço de cada parcela (price);
  • Se há juros no parcelamento (interest) e a porcentagem de juros (interest_rate);
  • Valor total do produto se pago com esse número de parcelas (total).

Confira os detalhes em {{ installment }}.

intl_price

Retorna o preço internacional.

name

Retorna o nome do produto.

on_sale

Retorna true se o produto está em promoção.

{% if product.on_sale %}
  <p>De: {{ product.price | money_format }}</p>
  <p>Por: {{ product.sale_price | money_format }}</p>
{% else %}
  <p>Preço: {{ product.price | money_format }}</p>
{% endif %}
<p>De: R$ 99,90</p>
<p>Por: R$ 85,90</p>

price

Retorna o preço do produto.

reference

Retorna a referência do produto.

reference_lowercase

Retorna a referência do produto com letras minúsculas.

sale_price

Retorna o preço promocional do produto.

{% if product.on_sale %}
  <p>De: {{ product.price | money_format }}</p>
  <p>Por: {{ product.sale_price | money_format }}</p>
{% else %}
  <p>Preço: {{ product.price | money_format }}</p>
{% endif %}
<p>De: R$ 99,90</p>
<p>Por: R$ 85,90</p>

slug

Retorna o caminho do produto.

{{ product.name }}
{{ product.slug }}
  • Output:
    Camiseta Verão
    camiseta-verao

subscription

Retornar true se o produto está disponível para o modelo de venda de assinatura e false se o produto não está disponível para assinatura.

tags

Retorna um array de tags em forma de objetos. Cada tag possui as seguintes informações:

  • name: o nome identificador da tag
  • title: o título de exibição da tag
  • subtitle: o subtítulo de exibição da tag.
  • description: descrição da tag.
  • importance: ordem em que os produtos serão exibidos.
  • type: tipo de tag.
{% for tag in category_tags %}
<a href="{{ tag.name | prepend: '/' }}" rel="tag">{{ tag.tag_type }}: {{ tag.title }}</a>
{% endfor %}
<a href="/linho" rel="tag">Material: Linho</a>
<a href="/blusas" rel="tag">Categoria: Blusas</a>
<a href="/estilo" rel="tag">Estilo: Leve</a>

tag_names

Retorna o nome das tags relacionadas ao produto.

<!-- product.tag_names = ["camiseta", "verao", "amarelo", "promo"] -->
Tags: {{ product.tag_names | join: ", " }}.

Tags: camiseta, verão, amarelo, promo.

updated_at

Retorna a data e horário da última atualização do produto. O formato de retorno dos dados é o ISO 8601.

A exibição desse atributo pode ser controlada através do filtro date.

url

Retorna a URL do produto.

variants

Retorna uma lista de objetos com as variantes dos produtos. Veja a documentaçào do objeto {{ variant }} para mais informações.