Collection banner
Collection image
To set up a collection image section:
Go to Customize theme. At the top of the page, use the dropdown to select a template that contains a collection banner section.
Select Collections > Default collection.
From the side panel, select the Collection banner block.
Layout
Customization of the "Layout" in the collection banner is as follows:
Full width
Container
Default collection image
Use "Default collection image" to add the image to the section.
Show collection image
Enabling this checkbox will allow you to display the added image in the collection.
Banner height
Customization of the "Collection banner height" in this section is as follows:
Adapt to image
Small
Medium
Large
Collection list
Choose specific collections to display in the banner.
Desktop content placement
Customization of the "Desktop content placement" in the collection banner section is as follows:
Top
Middle
Bottom
Desktop content alignment
Customization of the "Desktop content alignment" in the collection banner section is as follows:
Left
Center
Right
Color scheme
You can change the background and foreground color of the Collection banner section using the color scheme.
Scheme 1
Scheme 2
Scheme 3
Scheme 4
Scheme 5
Scheme 6
Mobile layout
Mobile content alignment
Customization of the "Mobile content alignment" in the collection banner section is as follows:
Left
Center
Right
Adding Collection banner via metafield
Before you can add Collection image(metafield value) to specific collections, you need to add the necessary metafield definition for this information.
From your Shopify admin, go to Settings > Custom data > Collections
Click Add definition
In the Name field, enter
Collection image.In the Namespace and key field, entercustom.collection_image
Click Select type then select File.
Than select Accept all file types.
Click Save to save the definition.
You should see the Collection image in the list of definitions by now.
Last updated