Collection Products

Author: administrator 54 views

What can you do with Collection Products Element?

Collection Products Element helps you to customize how your Collection should look on the live page. Let’s find out what Collection Products Element can offer!

1. Adding Collection Products

  1. Click into Elements –> Single Product –> Products
  2. Drag the Collection Products element from the left sidebar and Drop it wherever you want it to appear.

2. Configure

2.1. Content

  • General: With General option, you can customize your Production layout, size of Product images and the quantity of products shown in the screen.
  • Product card: You can choose what to show together with your products such as: vendor’s name, sale badges, 3rd party apps (reviews, quickviews, wishlist),… and even a short description.
  • Product variant: Product variant provides you abilitiy to custom variant options of your products (variant picker, layout show, quick shop buttons ,…).
  • Countdown Promo:
  • Pagination: Allow you to add or remove page number as well as “next” and “previous” buttons
  • Change text: Allow you to change text of badges, countdown promo, etc.
  • Product card items ordering: If you want to bring price or description of product on top, Product card items ordering definitely could help.

2.2. Design

You can even make your Collection Products page coloful with:

  • General: This function allows you to set the basic ones such as Alignment, Background color, Box Shadow or Border, Border Radius and Hover Animation.
  • Product items & Product image: You may want to set Width, Max Width, Height, Image fit, CSS Filter, Box Shadow, Border, or Border Radius.
  • Title, Price, Compare at price & Sale price: All changes for these element related to Alignment, Typography, Text color, Border and Spacing can be done here.
  • Add to cart button, Sold out button, Unavailable button, View more button: these functions help you to customize how your button looks with Typography, Background color, Border Hover, and move them around by Spacing, Alignment and position and options.
  • Badges:

Leave a Comment

On this page