Image 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 "Image 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) |
Color scheme | Select a color scheme to set the text and background colors for the section |
Image | Upload an image |
Heading | Add text to display as a section heading (Leave the field blank to hide the heading) |
Heading size | Font size of text:
|
Link label | Add text to display as a link label on the section (Leave the field blank to hide the link) |
URL | Set the link, for example the customer service page |
Text (Color) | Set the color for the text |
Show top separator line | Displays a line at the top to visually separate this section from the other sections |
Show bottom separator line | Displays a line at the bottom to visually separate this section from the other sections |
Content
Setting | Description |
---|---|
Set background for content box | Select this checkbox to background for content box. (The 3 following settings only take effect if this checkbox is ticked) |
Text (Color) | Set the color for the text or icon |
Background | Set the background color for content box (If a background gradient is set, the section's background will be set according to the background gradient setting) |
Background gradient | Set the background gradient for content box |
Desktop layout
Setting | Description |
---|---|
Desktop image placement | Select desktop layout from the dropdown menu:
|
Desktop content position | Select desktop content position from the dropdown menu:
(Position is automatically optimized for mobile. This setting applies to the position of the entrie content block) |
Desktop content alignment | Select desktop content alignment from the dropdown menu:
|
Mobile layout
Setting | Description |
---|---|
Mobile image placement | Select mobile layout from the dropdown menu:
|
Mobile content alignment | Select mobile content alignment from the dropdown menu:
|
Animations
Setting | Description |
---|---|
Reveal sections on scroll | Apply effects to the images on scroll. Select the images animation from the dropdown menu:
|
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