Icon with text
To add this section, please follow the below steps:
From your Shopify admin, go to Online Store -> Themes.
Find the theme that you want to edit, and then click Customize.
Click Add section and choose "Icon with text".
Setting | Description |
---|---|
Layout style | Select the layout style for the section:
|
Section width | Select the section width from the dropdown menu:
|
Custom width | Determines the width of the section when you choose 'Custom width' option at 'Section width' setting . Can be from 1000px to 1800px, increasing arithmetically of 50px (pixel) |
Show top separator line | Displays a line at the top to visually separate this section from the other sections |
Heading
Setting | Description |
---|---|
Heading | Add text to display as a section heading (Leave the field blank to hide the heading) |
Heading size | Font size of text:
|
Text | Add text to display as a custom content (Leave the field blank to hide the custom content) |
Text top margin | Determines the margin area on the top of the text. Can be from 0px to 100px, increasing arithmetically of 1px (pixel). |
Content alignment | Set horizontal alignment for content inside section containers:
|
Bottom margin | Determines the margin area on the bottom of the heading. Can be from 0px to 100px, increasing arithmetically of 1px (pixel). |
Icon with text
Caption Font Settings
Setting | Description |
---|---|
Typography for caption | Select the Font Style from Font Heading or Font body. These two font families are specified in the Theme settings > Typography |
Caption size | Font size of text:
|
Use custom color | Select this checkbox to use custom color for this caption (The 1 following settings only take effect if this checkbox is ticked) |
Caption (Color) | Set the color for the caption |
Caption top margin | Determines the height of the top outside space of the caption. Can be from 0px to 100px, increasing arithmetically of 1px (pixel). |
Caption bottom margin | Determines the height of the bottom outside space of the caption. Can be from 0px to 100px, increasing arithmetically of 1px (pixel). |
Heading font settings
Setting | Description |
---|---|
Typography for heading | Select the Font Style from Font Heading or Font body. These two font families are specified in the Theme settings > Typography |
Heading size | Font size of text:
|
Heading bottom margin | Determines the height of the bottom outside space of the heading. Can be from 0px to 100px, increasing arithmetically of 1px (pixel). |
Text font settings
Setting | Description |
---|---|
Text size | Font size of text:
|
Text bottom margin | Determines the height of the bottom outside space of the text. Can be from 0px to 100px, increasing arithmetically of 1px (pixel). |
Colors
Setting | Description |
---|---|
Color scheme | Select a color scheme to set the text and background colors for the section |
Use custom color | Select this checkbox to use custom color for this section. (The 3 following settings only take effect if this checkbox is ticked) |
Text | Changes the color of the text |
Background | Changes the color of the background (If a background gradient is set, the section's background will be set according to the background gradient setting) |
Background gradient | Changes the color of the background gradient |
Layout | Select the layout of the block:
|
Vertical
These settings apply for vertical layout
Setting | Description |
---|---|
Set background for icon | Enable/disable checkbox |
Layout | Select the layout of the list items:
|
Enable arrows | Display arrows on devices:
|
Animations
Setting | Description |
---|---|
Text animation | Select the text animation from the dropdown menu:
|
Section padding
Setting | Description |
---|---|
Top padding | Determines the height of the top inner space of the section. Can be from 0px to 100px, increasing arithmetically of 1px (pixel). |
Bottom padding | Determines the height of the bottom inner space of the section. Can be from 0px to 100px, increasing arithmetically of 1px (pixel). |
Top padding on mobile | Determines the height of the top inner space of the section on mobile. Can be from 0px to 100px, increasing arithmetically of 1px (pixel). |
Bottom padding on mobile | Determines the height of the top inner space of the section on mobile. Can be from 0px to 100px, increasing arithmetically of 1px (pixel). |
Last updated