Filtros Liquid/Olist

Os filtros alteram a saída de um objeto ou variável. Na implementação da sua loja você pode utilizar os filtros nativos de Liquid e os filtros de Olist Ecommerce no seu projeto.

Utilize os filtros com chaves duplas {{ }} em [variáveis] (https://shopify.github.io/liquid/tags/variable/), separando-os com o caracter barra vertical |.

Filtros de Olist Ecommerce

A Olist Ecommerce possui filtros próprios criados para serem utilizados nas customizações das lojas. Confira a seguir a lista com os filtros e exemplos de uso:

• apply_discount e installments:
  • installments retorna o valor da parcela do produto conforme a quantidade máxima de parcelas.
  • apply_discount considera o preço promocional do produto caso tenha promoção.

{% if product.installments.size > 1 %}
  <p class="parcels">
    {% if product.on_sale %}
      ou {{ product.installments.size }}x de {{ product | apply_discount | installments | money_format }}
    {% else %}
      ou {{ product.installments.size }}x de {{ product.price | installments | money_format }}
    {% endif %}
  </p>
{% endif %}

• client_price: cria promoções para clientes categorizados por alguma tag de cliente.
  Exemplo:

{% assign client_price = product | client_price %}
{% assign product_price = product.price %}
{% if client_price != product_price %}
  {{ product | client_price | money_format }}
  {{ product_price | money_format }}
{% else %}
  {{ product | client_price | money_format }}
{% endif %}

• to_json: passa um objeto liquid para o formato objeto json

{% capture javascripts %}
    <script>
      variants_products.push({{ product.variants | to_json }});
    </script>
  {% endcapture %}

• group_images_by_url: agrupa as imagens do produto pela url.

{% assign product_images = product.images | group_images_by_url %}

{% for image in product_images %}
  {{ image }}
{% endfor %}

• max_with_interest e max_without_interest: retorna as parcelas do preço do produto com e sem juros, baseando nos métodos de pagamento da loja

{% assign installments_without_insterest = product.installments | max_without_interest %}
{% assign installments_with_insterest = product.installments | max_with_interest %}

{{ installments_without_insterest.number }}x de {{ installments_without_insterest.price | money_format }} sem juros
ou {{ installments_with_insterest.number }}x de {{ installments_with_insterest.price | money_format }} com juros

• money_format: formata um valor para dinheiro com R$.

{{ product.price | money_format }}

• plural: aplica plural ou singular a partir de um número.

{{ tag.products_count | plural: "item", "itens" }}

• resize: redimensiona uma imagem cadastrada no admin.

<img src="{{ image.url | resize: "50x50" }}" />
<img src="{{ image.url | resize: "50x" }}" />
<img src="{{ image.url | resize: "x50" }}" />

📘

Saiba mais sobre os filtros de Liquid em Liquid Filters.

Filtros de assets

• image_path : filtra imagens. Considera o caminho a partir de /images/.
  Exemplo de uso:

<img src="{{ 'image.png' | image_path }}" />

• favicon_path: filtro de favicon. Considera o caminho a partir de /.
  Exemplo de uso:

<link rel="shortcut icon" href="{{ 'favicon.ico' | favicon_path }}" />

• stylesheet_path: filtra estilos. Considera o caminho a partir de /stylesheets/.
  Exemplo de uso:

<link rel="stylesheet" href="{{ 'style.css' | stylesheet_path }}" />

• javascript_path: filtra scripts. Considera o caminho a partir de /javascripts/.
  Exemplo de uso:

<script src="{{ 'script.js' | javascript_path }}"></script>