Skip to main content

Mobile collections

  • Updated

How to find these settings...

  1. Online Store
  2. Customize (Theme Editor)
  3. Add section
  4. Mobile collections

Mobile collections is a unique section that is only visible on screens smaller than 640px. NOTE: To edit this section, use the Mobile/Desktop/Fullscreen icon at the top of the Theme Customizer, and set it to Mobile

Recommended reading

In this section...

 

Text

Heading

Title of the section or feature

 

Use h1 tag

For SEO purposes, set the 'Heading' to use an h1 tag. NOTE: This should only be used once per page

 

Heading outline

Text defaults to the solid state, but can be customized with 3 outline thicknesses

 

Heading size

Set the heading size with the slider. 18px is the minimum, and it steps up by 6 to a maximum of 96px

 

Subheading

Secondary title of the section or feature

 

Subheading outline

Text defaults to the solid state, but can be customized with 3 outline thicknesses

 

Subheading size

Set the heading size with the slider. 18px is the minimum, and it steps up by 6 to a maximum of 96px

 

Text alignment

Text can be aligned to the left, right or centered to the container

 

Text color

Choose a custom color for the text

 

Text color hover *

Choose a custom color for the text hover

 

Line color *

Choose a custom color for the lines and borders

 

* May not be available in all Sections or Pages

 

Options

Show images

Display the collection images

 

Lazy load image(s)

Disable for "above the fold" images. Enable for any image that is not visible on the initial page load

 

Display

Choose 1 of 3 options for the collection display:

  • Tags
  • Products
  • Titles only

 

Truncate list

The tag or product list can be shortened to a set amount. If unchecked, up to 50 items will be listed

 

Display list length

If 'Truncate list' is enabled, set the list limit. 1 is the minimum, and it steps up by 1 to a maximum of 15

 

Section

Background color

Choose a custom color for the background

 

Background color gradient

Choose a custom gradient for the background

 

Top padding

Add padding to the top of the section. Padding is applied to the inside of the container. 0px is the minimum, and it steps up by 10 to a maximum of 60px

 

Bottom padding

Add padding to the bottom of the section. Padding is applied to the inside of the container. 0px is the minimum, and it steps up by 10 to a maximum of 60px

 

Bottom margin

Add a margin to the bottom of the section. Margins are applied to the outside of the container. 0px is the minimum, and it steps up by 10 to a maximum of 60px

 

Add a bottom border

A 1px border will be added between the 'Bottom padding' and the 'Bottom margin'

 

COLLECTION CONTENT BLOCKS

Access content blocks using black arrow next 'Mobile collections'

 

Collection

Use the collection picker to assign a collection

 

Custom title

Revise the default collection title with a custom title

 

Insta filter

App like filters can be applied to your images

 

Custom image

Select a background image. NOTE: Background images can use Focal Points to specify the main focus of the image. Learn more about Focal Points