List element

In this article, you will learn about the List element and how to use it.

About List element

List element allows you to put a list of items on your page to help increase your conversion rate. You can use this element instead of using bullet points or numbered lists in the Paragraph element in order to have more customization options. It’s also faster.

Note that you can search this element by using the search function instead of finding it in the sidebar.

list element

List element comes with multiple variations covering most needs. But we will continue to add more variations to help you save time.

Drag a variation to the layout and see how it can be configured.

List element configuration

List element comes with plenty of parameters allowing you to fine-tune content appearance for the best possible conversion rate.

Select the element in the layout to see its parameters.

In this article, we will show the parameters of the General and Styling tabs for the List element.

General tab’s parameters
1. CONTENT
  • List Items: You can add, move or delete any item here. 
  • Marker Type: There are 5 marker types for you to choose for the list, includes in
    • Symbol
    • Number
    • Lower-case
    • Upper-case
    • Others

Each type has many different types so you can choose one you like. 

In case you don’t want to display the marker type, you can choose “None” option. 

  • Marker Position: You can choose position of the marker type so it can be shown outside or inside the list item. 
  • Item Spacing: You can adjust the spacing between the list items. By default, it is set for 10px. 
  • Text Indent: You can adjust the spacing between the text and the icon of the list item here. 
2.ATTRIBUTES This is a parameter that all elements have. You can read more here.
3. VISIBILITY This is a parameter that all elements have. You can read more here.
4. ANIMATION This is a parameter that all elements have. You can read more here.
Styling tab’s parameters
1. OVERALL You can read about the OVERALL parameter here.
2. SPACING You can read about the SPACING parameter here.
3. TYPOGRAPHY You can read about the TYPOGRAPHY parameter here.
4. BACKGROUND You can read about the BACKGROUND parameter here.
5. BORDER You can read about the BORDER parameter here.
6. DISPLAY You can read about the DISPLAY parameter here.
7. CUSTOM CSS You can read about the CUSTOM CSS parameter here.

Nested elements configuration

Please note that the List element is the combination of multiple List items. You can select it to see two additional parameters available for each List item.

ITEM SETTINGS
List Items You can add, move or delete any item here.
List Items You can add, move or delete any item here.
Show Icon You can choose to show icon of the list item or not
ACTION
Go to URL
  • Go to URL: Insert the target URL for the List
  • Scroll to Section
  • Send Email
  • Call Number

Was this helpful?

Try out all PageFly features with Free plan

.myshopify.com
Don’t have Shopify store yet? Create store
×