Statistics
Use the Statistics section to display animated stats for your store or products.
Key features
Animated counter stats Multi-column layout Custom icons
Blocks
Statistic
Column layout
Set the the column width and space between columns.
Click section to find settings
Mobile layout
Stacked Carousel
Max column width
Full width Custom (250 - 750px)
Space between
Global Custom
Statistic blocks
Add blocks with statistics (numbers or text), subheading and paragraph text. You can change the statistic prefix (e.g. "$") or add a suffix (e.g. "%"). You can also display icons above the statistics.
Click (+) Add block to add columns of statistics. Use the drag handles ⋮⋮ to re-order blocks.
Statistic
Click statistic block to find settings
Statistic type
Number Text
Prefix
Add static text or symbols before the number.
Statistic number
Suffix
Add static text or symbols after the number.
Subheading and text
Click statistic block to find settings
Subheading
Add text below the statistic
Text
Add text below the subheading
Icon
Click statistic block to find settings
Icon
Use custom icon
Color scheme
Default Text Soft Color scheme 1 color scheme 2 Overlay Overlay soft
Color scheme
Override color scheme with custom Frame and Icon colors.
Statistics layout and style
You can customize the position and alignment of the content in the section settings.
Click (+) Add block to add headings, text, and buttons. Use the drag handles ⋮⋮ to re-order blocks.
Alignment
Click section to find settings
Alignment
Left / Center / Right
Mobile alignment
Left / Center / Right
Font
Click section to find settings
Statistic font
Heading Body
Statistic text size
20 - 100px
Mobile statistic text size
20 - 100px
Subheading font
Heading Body
Subheading size
1 - 6
Text size
1 - 6
Colors
Use the section colors for the statistic and heading, or set custom colors.
Click section to find settings
Text color
Use section Custom
Custom statistic
Custom heading
Statistics animation
By default, number statistics are animate to count up. You can adjust the style of the animation.
Click section to find settings
Enable counting animation
Duration
50 - 5000ms
Stagger direction
Start animating numbers from left to right, or right to left.
Speed
Control the jump between numbers when counting upwards. Higher speeds count up by smaller increments, making the animation appear more rapid for larger numbers.
Section styles
Customize general style options for the section and content area. Settings for Content area allow you to adjust the width, borders, and dropshadow of the container of the section content.
Click section to find settings
Content area
Full width
Section background and content span the screen's full width.
Full width padded
Section spans the screen's full width with some padding.
Page width
Section background and content span the page width.
Width
Full width Full width padded Page width
Full width on mobile
Available for Full width padded option.
Border
Top only Bottom only Both
Corner radius
Available for Full width padded and Page width options.
Dropshadow
Section
Top padding
0 - 27
Bottom padding
0 - 27
Dividers
None Top only Bottom only Both
Force dividers full width
Color scheme
Default Inverse Soft Accent Accent inverse Overlay Color scheme 1 Color scheme 2
Anchor ID
Link directly to the section on any page. Learn more
Last updated