1. Text Styles are used to create consistent and reusable formatting for text across the website. Text Styles help define the appearance of headings, paragraphs, and links, ensuring uniformity and making it easier to update the design in one place without needing to edit each instance manually.
Click the Text Styles tab.
Overview
2. Click "Add" to create a new text style or click the text style name if you want to edit an existing text style.
3. Use the Sort By feature to change the order of the existing text styles. You can sort them by creation date, font size, and alphabet.
4. Important: Specify the new text style by name so that you can easily find it in the text dropdown when you need to use it on a page.
5. You can see that the "Preview" field shows you what your text style will look like after applying all settings to it.
You can type an entire sentence in the "Preview" field to get an understanding of what the text will look like when being used on a page.
6. To change the color for the text style, click the "A" icon to bring up the color selector.
7. You can see that there are 25 preset colors and 5 additional colors. If you need a specific color, click "More Colors" to set the color with the color picker
8. Optional: Select the "Enable Shadow" checkbox to add a shadow to your text. Specify the X offset, Y offset, and blur for the shadow.
9. Specify the color of the shadow
10. Select a font for the text style. If you want to set a custom font, please refer to this fonts guide
11. Specify the font style, you can select regular, italic, bold, bold italic. The custom fonts may have other styles than these.
12. Specify the font size for the text style. Additionally, you can set the line height and letter spacing.
Important: Click device icons to set different font sizes for desktop, tablet, and mobile.
13. Use normal and hover buttons to specify link properties in your text style. The hover state is when the visitor points the mouse at the link.
You can specify the link style, color, and underline for both states.
14. Click the "Save" button to save the changes to the text style you created.
Duplicating a text style
15. If you need to duplicate an existing or a newly created text style, you can do so with the duplicate icon next to the style name field
Applying a text style
16. Navigate to the "Pages" tab and select the page where you want to apply a new text style
17. Left-click the Text Widget twice and select the new text style from the dropdown in the Text Editor
18. This is how it will look as a result. You've successfully applied a text style
The Text Editor is a common feature in most widgets in the website builder. Please refer to this guide on how to use the Text Editor
19. Click "Save" to confirm the changes
