Overview #
The Rich Text section is designed to provide a simple yet versatile way to display text and icons with various customization options. This section allows users to add rich text content, including links and basic formatting, to enhance the visual appeal and functionality of their site.
Key components and functionality #
Content settings
This group of settings allows you to customize the text and icon display within the section, providing flexibility in presentation.
Text alignment
Align the text within the section to best fit your design needs. Options include left, center, and right alignment.
Icon position
Determine where the icon will be placed relative to the text. Options include top, bottom, center, left, and right.
Icon
Specify an icon to be displayed alongside the text, enhancing the visual interest of the section.
Caption
Add a caption to provide additional context or information about the text content. This can be useful for headings or subheadings.
Heading
Define a title for the section. The default heading is Rich text.
Heading type
Choose the type of heading to use, ranging from paragraph to heading levels 1 through 6. The default is h2.
Content
Add the main text content using the rich text editor. The default content includes a placeholder text with formatting examples.
Text size
Select the size of the text to ensure it fits well within your design. Options include small, medium, large, and extra large, with the default being medium.
Button settings
These settings allow you to customize the appearance and functionality of buttons within the section.
Button icon
Specify an icon for the button to make it more visually appealing.
Button text
Define the text that will appear on the button. This is crucial for guiding user actions.
Button link
Set the URL that the button will link to, allowing users to navigate to other pages or resources.
Open link in a new tab
This checkbox option determines whether the button link opens in a new tab. The default setting is false.
Button style
Choose from various button styles to match your site's design. Options include primary, secondary, extra large, plain, small, and small secondary.
Button layout
Decide how the button and icon are arranged. Options include icon left, icon right, and icon only.
Usage examples #
-
Creating a promotional banner: Use the Rich Text section to highlight a special offer or announcement. Customize the heading, text size, and button style to draw attention.
-
Adding a call-to-action: Encourage users to take action by adding a button with a clear label and link. Use the button icon and layout settings to make it stand out.
-
Enhancing content with icons: Add icons to your text to visually represent key points or features, making the content more engaging and easier to understand.
By utilizing these settings, you can create a visually appealing and functional Rich Text section that enhances your site's content and user experience.
Align v1.7 is out now! Learn more about our best release yet →