Globo is the company specializing in website design and development in Vietnam.
45C, 210 Hoang Quoc Viet Street, HN
Follow Us

Customize product list template

You are here:
Estimated reading time: 1 min

Step 1:

Edit code of the theme:

Step 2:

Search for the file with text “globo.filter” and open it to edit file “globo.filter.product.liquid”:

Step 3:

Add text “{% comment %}Do not edit this file{% endcomment %}” to the first line of the file so that the app will not override this change in the future. It means that when you change settings in the App >Product Grid Layout, the layout will no longer be updated.

Step 4:

Edit file using product object only, including the following attributes:

  • product.available
  • product.collections
  • product.compare_at_price
  • product.description
  • product.featured_image
  • product.first_available_variant
  • product.handle
  • product.id
  • product.images
  • product.options
  • product.price
  • product.price_max
  • product.price_min
  • product.price_varies
  • product.tags
  • product.template_suffix
  • product.title
  • product.product_type
  • product.url
  • product.variants
  • product.vendor

Step 5:

Each time settings and Product Grid Layout settings are changed, the App will overwrite template files to update the latest settings. If a file contains the text “Do not edit this file”, the app will ignore and not update this file.

Was this article helpful?
Dislike 0
Views: 967