Install #1 Page Builder App for FREE and get deal 6 months of Standard Plan. Hurry up! See Detail  

Header background

Gecko - Collection group

Mie Tran

Written by Mie Tran

Last updated

180 views

On this page


This section helps you to show the categories as columns. To add the collection group section, please go to Theme sections > Add section > Collection Group.

collection group.gif

1. Collection Item

You can click on Add Collection Item to add more collection columns for this section.

item.gif
  • Heading item: Enter the content of the heading item.

  • Collection: Select a collection that you want to show on the collection item

  • Product list: You can choose the specialty products to show here. If you use Product list, the Collection option will not be applied.

  • It helps you configure the collection item with options for Product content align, Maximum products to show, Space between products (desktop, tablet & mobile).

2. How to configure the Collections list section?

2.1. HEADING OPTIONS

  • Heading design: There are totally of 15 heading designs.

  • Center heading align: check this option to align the title center

  • Heading: Enter the content of the heading.

  • Enter a icon name on heading: Go to LineAwesome to get the icon that you want to show on design 6.

  • Subheading: Enter the content of the subheading.

  • Space bottom (px): This allows you to change the space between the heading and content.

spaces_tdDF4h55NE3bVEDpck0F_uploads_0XRohpl7RqutgoRwyERv_heading.webp

2.2. OPTIONS IMAGE PRODUCTS

  • Image ratio, Image size, Image position: It helps you configure the image products

  • Group items per row, Space horizontal items, Space vertical items(both on desktop, tablet and mobile): you can choose how many items per row and configure the spacing for them.

spaces_tdDF4h55NE3bVEDpck0F_uploads_Vs5sYgRfcw9s96qzCGah_2022-12-23_11-26-10.webp

2.3. DESIGN OPTIONS

  • Layout: You can choose between Container, Wrapped Container, and Full width. Besides, you can also upload a background image, and choose a background color, or a background gradient for the layout.

  • Margin, Padding: You are allowed to change both of them for both Mobile and desktop devices.

    Please follow this guideline to config Layout, Background, Margin/Padding for the section.

[Private Offer] EComposer Partner Plan

ecomposer.jpg
Exclusively for The4 users, when you bougth any theme from us, you can get Ecomposer - Theme Partner Plan for ZERO and start making beautiful, high-converting store pages today:

  • FREE 100% EComposer Standard plan for 6 months (save you $114)
  • Build ANY Shopify pages: Landing page, Sale Funnel page, Lead pages, & other custom pages tailored for your marketing campaigns.
  • Create advanced sections & add to your theme with ease
  • 100+ professtional, stunning designer-made templates
  • Build pages with a love drag-drop editor, no coding required

How to claim offer. Install EComposer HERE. Then open chatbox icon in EComposer dashboard and leave a message with subject "Theme name+EComposer" to upgrade for free

Ecomposer1.jpg
Cheers, The4.

We highly recommend Shopify apps from our partners.

We uses cookies to ensure you get the best experience on our website.