Shopify Theme Base GitHub

Filter by tag

Este snippet filtra en un template de colecciones por medio de los tags en la colección (dependen de los tags presentes en los productos).

La estructura para administrar los tags específicos para los filtros, lo asignaremos por medio de la letra f-. Por ejemplo, un tag válido puede estar asignado de la siguiente forma: f-mask.

Filtro con API

Este filtro trabaja junto al API de section rendering.

La solicitud al API recibe un parámetro con la url de la colección + handle del tag, por ejemplo:

  • /collections/all/f-mask

Al final, la respuesta retorna un nuevo DOM con la lista de productos actulizada según el tag.

Acepta:

  • order_tags: (Object) Contiene una lista de los tags ordenados.
  • collection_tags: (Object) Contiene los tags de la colección.
  • text_all_products: (String) Contiene un texto para asignar el label de “Ver todos los productos”.
  • type_filter: (String) Contiene el identificador del tag.

Uso:


{% render "filter-tag"
  order_tags: [object],
  collection_tags: [object],
  text_all_products: 'All products',
  type_filter: 'f-'
%}

Archivos:

  • js:
  • liquid: