Image with scrolling text
This section is a highly flexible and customizable solution for displaying important messages alongside imagery. With extensive options, it fits a variety of design needs, from announcements to promotional banners.
Section settings
Add and organize various section blocks within the layout, allowing you to customize the structure of your content by arranging different elements such as the section heading and buttons, to create a visually engaging and well-structured page.
Content
Image
image_picker
Main desktop image (Recommended: 3200 x 1200px, JPG).
Image link
url
Optional URL to make the image clickable.
Space between messages
range
Controls the spacing between scrolling messages.
Autoplay speed
range
Adjusts the scrolling speed of the text.
Text typography
Text alignment
select
Vertical text position: Top, Center, or Bottom.
Scrolling text typography
Font
font_picker
Font style for scrolling text.
Text size
range
Font size for scrolling text.
Letter spacing
range
Controls spacing between letters.
Uppercase
checkbox
Transforms scrolling text to uppercase.
Position
select
Alignment for scrolling text: Top, Center, or Bottom.
Text direction
select
Marquee direction: Right-to-left or Left-to-right.
Desktop
Height
select
Choose height: image-based or fixed screen ratios.
Mobile
Image
image_picker
Alternative image for mobile (Recommended: 1200 x 1600px, JPG).
Height
select
Mobile height options similar to desktop.
Colors
Color scheme
color_scheme
Choose a color scheme from predefined options.
Overlay opacity
range
Background overlay opacity to improve text readability.
Overlay behind text only
checkbox
Applies overlay only behind text (requires opacity > 0).
Padding
Top
range
Padding at the top.
Bottom
range
Padding at the bottom.
Advanced
Show placeholder image
checkbox
Show placeholder if metafield image is not used.
Last updated