Collections

Author: Jimmy 309 views

The Collections element will show the collections as a list on your Collection template. You can select the specific collections to show, select from the collection metafield, or from the menu.

Notice: This element should only be use for Collection template.

1. Add Collections element

From the Shopify tab, drag and drop the Collections element to the place you want to show the collections.

2. Configure Collections

2.1. Show the Specific Collections

This is really easy, you just need to select the collections that you want to show and add it.

2.2. Show the collections from the Shopify menu

To show the Collections from a menu, you must create a menu in Shopify first, then select it in EComposer to show.
Step 1: Go to Shopify admin -> Online store -> Navigation to create a menu.
Step 2: Create your menu and link it to a collection that you want to show.
Step 3: Save the changes in Shopify and refresh the Collection page in EComposer (Publish the page first so your changes are saved).
Step 4: Select the collection according to the menu name you set in the Shopify navigation.

2.3. Add Sub-collection through Collection metafield and show in EComposer

Note: The metafield only works in the collection template. It only shows on the live page and only shows when assigning that template to the collection.

For example: You can use this choice when you want to show sub-collections on a main collection.

You can follow the steps below for details:

Step 1: From the Shopify admin, go to Products -> edit Collections -> Metafield -> Show all. Add the collection URL to the Define sub-collections for the current collection field. Separated by commas.
Step 2: From the Collection element, you have to select the “From metafield of current collection” option in Collection Source. Then you can assign the collection template to the collection that you want and check it in the preview. You can follow this video below for details.

2.4. Other settings

All of the settings below, like Show image/Show title, are self-explanatory and can easily be customized.

3. Design

3.1. Items

Helps you configure the style of the items with options for Background, Box Shadow, Border, Border Radius, Padding and Layout Flow.

3.2. Image

Here you can set the width, height or opacity for the collection images.

3.3. Title, Counter

It includes AlignmentTypographyText ColorText Shadow fields that are applicable to the text. Alignment and Typography can be set for all devices.

You can learn more about design options here.

Leave a Comment

On this page