Catalog allows you to put Catalog Feature on the page and select a category to display in this catalog.
Please Note: There is a limit of one Catalog Feature per page.
Hover over the Catalog Feature and click Edit to configure the Catalog settings:
Layout settings of the Catalog Feature include the following items:
- Category. Select the category to display from the drop-down:
- Sort by. Choose the default sorting order for products:
- Price: High to low
- Price: Low to high
- Featured first (You will see the products in the same order as in the Store → Product sidebar)
- Name: A-Z
- Name: Z-A
- Products Per Row. Use Slider to set how many products will be presented in each row:
- Total Rows. Select how many rows will be presented in the catalog:
- Margin. Set the outer spacing for the catalog:
- Products Spacing. Set the spacing between items in the catalog grid (inner spacing):
View settings allow configuring the following options:
- Image Aspect Ratio. Choose image aspect ratio for product cards:
- Switches. Configure what data will be displayed on the product cards:
- Product Badges. Turn on the Badges toggle to enable the On Sale, Sold Out, and Few Left badges for your Online Store.
- Product Name.
- Excerpt (short description of the product).
The data is taken directly from your store.
Button settings include several options:
- Toggle to Show/Hide Button. Turn on the toggle to show the Button on a product card. Turn off the toggle to disable the Button and remove it from the card:
- Button Text. Specify the text that will appear on the Button:
- Button Width. Turn on the toggle to stretch the button for the entire available width of the card:
- Button On-Click Action. Choose which action should be performed when you click on the button:
- Buy Now: Opens cart with product added.
- Add to Cart: Adds a product to the cart.
- Open Product Page: Opens product page with product details.
Please Note: Clicking on a product card (for example, on a photo) will open the product page.
- Catalog Background. Set the background color of the catalog by clicking the Color square:
- Catalog Border. Adjust the color and size of the border around the catalog:
- Card Background. Click the Color square to set the background color of the product card:
- Card Border. Configure the color and size of the border around the product card:
- Hover Effects
Set the effect when you hover the mouse over the product card, the following options are available:
- Show Additional Images.
- Highlight Border.
- Highlight Background.
- Highlight Shadow.
If the toggle is turned off, no effects are applied.