Collection with banner
Here is an amazing section that will allow you to design a custom Banner image and some collections. You can show both of Image and collections in this section.
It is usually located on Homepage. However, Shopify 2.0 allows you to add the Collection with banner section to any pages that you wanna use.
Steps
In the theme editor (Customize), click Add section
Search Collection with banner
Click Save
1. Collection with Banner content
The Collection with Banner section has a total of 8 content blocks, you can use those blocks to build the Collection with Banner layout that you wanna use, you can view the video below to know about Collection with Banner section blocks:
2. How to configure the Collection with Banner section?
- Banner Item (parent): You can upload the Banner image here, this section allows you to add 2 separate images for the Desktop and Mobile devices.
- Image position: You can configure to choose a position for the Banner image here. We have 3 positions for you to choose: Start, Center & End.
- Image hover effect: You can choose a hover effect for the image here. We have a total of 7 effects for you to choose. If you don't wanna use the hover effect, you can choose None.
- Banner effect when hovering: You also can choose an effect for the banner when hovering here, we have a total of 5 effects for you to choose. If you don't wanna use the hover effect, you can choose None.
- Content vertical/ horizontal position: You can configure the position for the content on the Banner image here. Our theme supports changing the content position on all devices: Desktop, Tablet and Mobile.
- Show background content color? checkbox: Tick on this checkbox to enable background color for the content here.
- Background color: You can set the color for the content here, this option also supports Metafiled.
- Background color opacity: Configure the opacity for the content on the Banner image here.
- Show border content color checkbox: Tick on this checkbox to enable border content color for the content.
- Border color: You can set the color for the border here, this option also supports Metafiled.
- Background border: You can set the color for the Background border here, this option also supports Metafiled.
- Border opacity: You can configure the opacity for the border content here.
- Border style: You can choose a style for the border content here. We have 3 styles for you to choose: Dash, Solid and Double. If you don't wanna enable border, you can choose None.
- Layout: You can choose the layout for the Collection with Banner section here. We have 3 layouts for you to choose: Container, Wrapped Container and Fullwidth.
- Margin/ Padding: You can configure the margin/ padding for the section here. You also can configure margin/ padding for other devices: Tablet and Mobile devices.
[Private offer] Unsen Partner Plan
Exclusively for Unsen users, 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, Sales Funnel page, Lead pages, & other custom pages tailored for your marketing campaigns.
Create advanced sections & add to Unsen with ease
Save up to 50 pages/sections
100+ professional, stunning pre-designed templates
Anyone can build pages with live drag-drop editor
How to claim offer: Install EComposer HERE. Then open chatbox icon in EComposer dashboard and leave a message with subject “Unsen+EComposer” to upgrade for free.
Cheers, The4.
Last updated
