Collection Slider
Updated 1 month agoIt displays collections in a horizontal scrollable format, making browsing more interactive. Use it when you want to showcase multiple collections without taking too much vertical space.
First, let’s talk about the Setting Tab
Header Title
Control the main title of your collections slider.
Enable or Disable
Click the eye button to show or hide the title.
If enabled, you can adjust:
-
Text — enter your title.
-
Font — choose a typeface.
-
Size/Weight — set the size and boldness.
-
Line Height — control vertical spacing.
-
Letter Spacing — fine tune spacing between characters.
-
Text Color — choose a color.
-
Alignment — position the title left, center, or right.
-
Capitalization — select how the title text appears.
Image Attribute
Manage how your collection images appear within the slider.
-
Ratio - Choose an image ratio for uniform sizing.
-
Adjust Ratio - Fine tune the ratio if needed.
-
Radius - Control how rounded the image corners are.
-
Image Scale - Choose whether the image fills or fits the container.
Layout Padding and Position
Tweak spacing and placement within the overall layout.
-
Padding - Adjust inner spacing for the slider block.
-
Vertical Position - Move the slider up or down within the section.
Background and Spacing
Design the visual container around the slider.
-
Color - Set the background color.
-
Radius - Adjust the corner roundness.
-
Padding - Control inner spacing.
-
Margin - Manage the spacing outside the section.
Border
-
Color — choose border color.
-
Width — pick border thickness.
-
Sides — select which edges show a border.
Now, the content tab
For each tab, you can change the following:
Image
Control the image displayed for each collection.
-
Upload Image - Add an image that represents the selected collection.
-
Select Collection - Choose which collection this tab should link to.
-
Overlay - Apply an overlay for better contrast or enhanced visual style.
-
For the collection title - You can edit text, font, size/weight, line height, letter spacing, text color, alignment, and capitalization
Benefits:
-
Saves space while still showcasing multiple categories
-
Encourages exploration through swiping behavior
-
Keeps the interface clean and modern
-
Increases chances of users discovering more collections
Related Articles
