Rich text

The Rich Text section displays customizable promotional text with options for flexible sizing.

You can include large or short messages and add blocks with image, countdown timer, and buttons for a fully interactive, visually engaging experience. This section is perfect for highlighting special announcements, seasonal promotions, or any key messaging you want to emphasize on your store’s pages.

1, How to add section in theme editor:

1

In your theme editor (Customize), scroll to the bottom of the template and select Add section.

2

In the list, locate and select Rich text section. The section will now be added to your page, ready for customization.

2, Section settings:

Customize the layout, alignment, and width of the Rich text section with these settings:

• Desktop content alignment: Adjust the alignment of content and buttons within the section to Left, Center, or Right.

• Desktop content width: Set the width of the content area on desktop to Small, Medium, or Large. Content width will automatically adjust on mobile for optimal responsiveness.

• Mobile layout: Align content and buttons on mobile devices to the Left, Center, or Right.

3, Block settings

Each block within the Rich text section has customizable settings to adjust the appearance of the section’s content.

a. Heading block:

• Add a heading in rich text format. Change the color of highlighted words.

b. Text block: Add descriptive text to supplement the heading.

c. Buttons block: A Theme allows users to add up to 2 buttons in the Rich text section. Enter a label for each button. If the label is left blank, the button will not appear. Assign a link to each button. And choose a style for each button, and customize button colors using the options provided.

d. Caption block: Add a caption to provide additional context or emphasis. Choose the caption style, either Uppercase or Subtitle.

e. Countdown timer block: Add a countdown timer to create urgency around promotions or events.

• Specify the end date, end time, and size of the countdown timer.

• Enable "Hide when countdown reaches zero": Once the countdown finishes, the timer will automatically disappear from the section.

• Choose to add a border around the countdown timer if desired.

f. Image block: Select an image to display within the Rich text section. Adjust the size of the image, with options ranging from 30px to 200px.

4, Practical applications of the Rich text section

How to create a countdown timer on a solid or gradient background?

A countdown timer with a bold background can effectively create urgency for time-sensitive promotions or special events. Follow these steps to set it up in the Rich text section:

1

In the Theme editor, select the Rich text section to add it to your page.

2

Within the Rich Text section, add the Countdown timer block to display a countdown for your promotion or event.

3

Customize the background color of the section to either a solid or gradient color. Adjust the text and countdown timer colors to your preferred color (overriding the default theme color) for a cohesive look.

4

For guidance on creating gradients, refer to Shopify’s Color Gradient Guide.

5

Click Save to apply the changes.