In this article, you will learn about Collection list element – one of the most popular Shopify elements in PageFly.
About Collection list element
Collection list element can present a list of collections on your page. Indeed, it works like a charm for cross-sell or up-sell purpose, especially to increase conversion rate.
Yet, you can use it anywhere from Collection page to Landing page and Blog post.
Above all, you can use the Collection list element to display collections that are related to each other. They can work in terms of category (Spring, Summer, Fall, Winter collections) or sales-related (Sale, Promotion, Special discount collections), etc.
By default, this element comes with only one variant at the moment. However, we will add more options soon so you have more choices.
To start, let’s drag the element to the layout and see how it works.
Collection list element setting
Collection list element comes with many variables, allowing you to design content layout so you can achieve better conversion rate.
First, select the element in the Editor to see its variables.
The variables in General tab are specific for this element.
However, those in Styling and Advanced tabs are common for all elements. Read about them here.
|Columns||Choose how many columns to display collections|
|Retina||Enable / Disable retina display for featured image of collections|
|Image Size||Featured image size. Unit is pixel, left input is the width and right is the height|
|Add Collection||Add a new collection to the list.|
|The list of collections.
You can hold and drag the Move icon to reorder the collection; select the Duplication icon to duplicate collection; choose the Trash icon to delete the collection; and the Arrow icon to open Collection setting to select a collection.
Contained elements setting
Notice: Collection list element is a group of multiple collections. Although each collection can be selected independently, the setting is universal to the whole list.