Rich Text
To add this section, please follow 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 "Rich Text".
Section settings
General
Settings | Meaning |
---|---|
Layout | Select the layout width of the whole section. The options are: Default (same as the body width), 1170px, 1770px, Full Width (the 100% of the viewport width). |
Padding Container Full Width | Determine the left and right spacing of the Full Width layout. |
Enable Border Top? | Toggle the top border. |
Enable Border Bottom? | Toggle the bottom border. |
Border Color | Apply a color to the border top and bottom. |
Spacing Top / Spacing Bottom on Desktop, Tablet, Mobile | Determine the spacing of the section from its top and bottom sections on Desktop, Tablet and Mobile separately. |
Background Color - Background Gradient | Set color (or gradient) for the section background. |
Background Image | Upload/Select an image as the section background. |
Enable Column? | Toggle Column |
Alignment | Select the alignment of the header text to be either to the Left, Center or to the Right of the section. |
Block settings
[BLOCK] Heading
Settings | Meaning |
---|---|
Heading | Enter in the heading for the block. |
Heading Font Size | Specify the font size of the heading on desktop. |
Heading Font Size Mobile | Specify the font size of the heading on mobile. |
Line Height | Determine the line height of the heading text. |
Heading Color | Apply a color to the heading for the block. |
[BLOCK] Text
Settings | Meaning |
---|---|
Description | Enter the text for the description. |
Description Font Size | Specify the font size of the description on desktop. |
Description Font Size Mobile | Specify the font size of the description on mobile. |
Line Height | Determine the line height of the description text. |
Description Spacing Top | Determine the spacing of the description from top. |
Description Color | Apply a color to the description for the block. |
Content Width | Determine the width of the content. |
[BLOCK] Button
Settings | Meaning |
---|---|
Button Style | Select the style of the button:
|
Button | Enter the text for the button. |
Button Link | Enter URL for the button to redirect to. |
Button Spacing Top | Determine the spacing of the button from top. |
Button Color - Button Border Color - Button Background Color - Button Background Gradient - Button Color Hover - Button Border Hover - Button Background Hover - Button Background Gradient Hover | Set the text color, background and border color for both the normal and hover states of the buttons. |
Button Width | Determine the width of the button. |
[BLOCK] Social Media
Settings | Meaning |
---|---|
Spacing Top | Determine the spacing of the block from top. |
Spacing Bottom | Determine the spacing of the block from bottom. |
Icon color - Background Color - Background Gradient - Hover / Active Color - Hover / Active Background Color - Hover / Active Background Gradient - Ring Color | Set the color, background and ring color for both the normal and hover states of the icons. |
[BLOCK] Sub Heading
Settings | Meaning |
---|---|
Sub Heading | Enter in the sub heading for the block. |
Font Weight | Select the font weight of the sub heading |
Sub Heading Font Size | Determine the font size of the sub heading. |
Sub Heading Spacing Top | Determine the spacing of the sub heading from top. |
Sub Heading Color | Apply a color to the sub heading. |
[BLOCK] Content
Settings | Meaning |
---|---|
Description Top | Enter the text for the description top. |
Description Bottom | Enter the text for the description bottom. |
Alignment | Select the alignment of the block content to be either to the Left, Center or to the Right. |
Description Font Size | Specify the font size of the description. |
Description Spacing Top | Determine the spacing of the description from top. |
Description Color | Apply a color to the description. |
Content Width | Determine the width of the content. |
Read More | Enter the text for the Read More button. |
Read Less | Enter the text for the Read Less button. |
Button Font Size | Determine the font size of the "Read more/Read less" button. |
Font Weight | Select the font weight of the "Read more/Read less" button. |
Button Spacing Top | Determine the spacing of the "Read more/Read less" button from top. |
Button Color - Button Border Color - Button Background Color - Button Background Gradient - Button Color Hover - Button Border Hover - Button Background Hover - Button Background Gradient Hover | Set the text color, background and border color for both the normal and hover states of the "Read more/Read less" button. |
Button Width | Determine the width of the "Read more/Read less" button. |
Button Padding Top | Set the top padding top for the "Read more/Read less" button. |
Button Padding Bottom | Set the top padding bottom for the "Read more/Read less" button. |
Last updated