How to config the product item layout in our default theme

When you install our app and have our default layout theme (see Default theme definition and Default theme demo), you could easily change some of the product item's elements on collection pages such as title, vendor, price, etc.

If you use customized themes, please contact us at support@boostcommerce.net

Display collection image

1
Go to Online store > Themes.
2
Choose the desired theme that you would like to make change > Customize.
3
Choose Collection pages in the header as well as Collection pages in Section tab.
4

Tick/untick  Show Collection Image and change Collection Image Text Color.

Config the product item layout| Display collection image


Change the product list

1
Go to Online store > Themes.
2
Choose the desired theme that you would like to make change > Customize.
3
Choose Collection pages in the header as well as Collection pages in Section tab.
4
You could choose how your product list display on desktop and mobile.

Config the product item layout| Change product list


Enable/disable product item elements

1
Go to Online store > Themes.
2
Choose the desired theme that you would like to make change > Customize.
3
Choose Collection pages in the header as well as Collection pages in Section tab.
4
Tick/untick the desired elements.
Config the product item layout| Change product item elements

Change the label (Sale, Sold Out)

1
Go to Online store > Themes.
2
Choose the desired theme that you would like to make change > Customize.
3
Choose Collection pages in the header as well as Collection pages in Section tab.
4

Rename the label based on your requests. Regarding the custom labels, please follow the instruction here.

Config the product item layout| Change sold out


Change color swatch & image height

1
Go to Online store > Themes.
2
Choose the desired theme that you would like to make change > Customize.
3
Choose Collection pages in the header as well as Collection pages in Section tab.
4

Enable/disable color swatch, image height & how they display.

Config the product item layout| Change swatch image & height

There are 3 display types of Color swatches under products:

Color Color Image Product Image
When to use Products have the basic color (Blue, Green, etc.) Products have special colors (Gradient Abyss, Gradient Citrus, etc.)

Note: Need to upload files of special color in format: color-[COLOR_NAME].png. Eg, color-gradient-abyss.png in Settings> Files > Upload files
(Optional) Basic color should be re-uploaded to avoid 404 issue.
Display all variant images in Shopify admin.

Note: Guide to add images to product variants.                                                                                                                                                                                                     

Data example

Frontend


Change style, position & default view as

Please kindly contact us at support@boostcommerce.net

Still need help? Contact Us Contact Us