How to use the Default theme settings
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 the collection pages and the search page such as title, vendor, price, etc.
These settings will only work with our default theme on the latest versions of the new front-end lib V2 . Contact us at firstname.lastname@example.org if any issues arise.
For the front-end lib V1 version, please refer to this doc .
From our app admin, go to Theme menu > Default theme settings to access the default theme settings. There are two tabs: General and Product item.
Watch this tutorial video to know how to use Default Theme Settings:
1. General tab
Overview: General tab is where you could access all settings of Filter tree (see What is a Filter Tree) & Header section (including Header & Toolbar). The Preview section on the right of the page that has 2 types for desktop and mobile is for display purposes only.
1.1. Change Page layout
There are two types: Box and Fullwidth
1.2. Display collection & Search page header
Show/Hide/Edit collection image and collection description
1.3. Edit Toolbar
Show/Hide View as, Product count, Sort by on Desktop/Mobile and change View as type
2. Product item tab
Overview: Product item tab allows you to access all settings of Product list & Product item. The Preview section on the right of the page that has 2 types for desktop and mobile is for display purposes only. Within the Product item tab, there are 4 tabs below:
2.1. Listing tab
a. Edit Product item
Default type: Grid or List view
Border no padding
Border no padding image
Border has padding
Edit product text alignment
Show/Hide Product vendor, price, review, details on hovering and image swap on hover
b. Edit Product image
2.2. Detail tab
a. Edit Product title
b. Edit Product vendor
c. Edit Product price
d. Edit Product description
2.3. Swatch settings tab
a. Show item swatch
Tick/Untick to Show swatch name when hovering and choose how to interact with swatch icon to make the product image change
b. Edit Swatch by color
Choose the option that this swatch would be applied for and its shape
c. Edit Swatch by image
d. Edit Swatch by product image
e. Edit Swatch by text
2.4. Product label tab
a. Edit the Position and Type of label
b. Edit Sale label
Tick/Untick the box Show sale label and edit its display
c. Edit Sold out label
Tick/Untick the box Show sold out label and edit its display
d. Custom label by tag
Check the detailed guide here.