2.1. Text
Last updated
English
Last updated
In landing page design, using Text effectively is crucial for conveying information clearly and engagingly to the viewers.
Click on Widgets in the sidebar of the editor.
Select Text from the Basic section.
Choose the Text element and drag it onto your landing page.
You can choose Heading, Title, or Paragraph for your landing page.
Heading: This is the most important text, usually the main title of a section or page. It is used to grab the reader's attention.
Use H1 (Main Title) for the primary title of the page; each page should only have one H1 to clearly define the main topic of the page.
Use H2 (Subheading) for the main sections within the content, helping to divide the content into manageable parts.
Use H3-H6 (Subheadings) to further break down sections in the content if necessary.
Titles (Subheadings): These are subheadings or other important sections that help break down the content into more readable parts.
Paragraphs: These are the main content of the page, consisting of text paragraphs to convey detailed information.
You can edit the text content of elements such as headings, paragraphs, buttons, or any other text components on your landing page.
To access the Content Editor, click on the Text widget you wish to modify on the screen and select Content from the quick settings bar.
Enter or edit the text content: Change the content, font, size, color, and text formatting.
Use formatting tools: Alignment, bold, italic, underline, etc.
Font Weight: Allows you to adjust the thickness of the font, from the lightest to the boldest font style.
Text Transform: Used to change the text display style, such as converting all text to uppercase, lowercase, or capitalizing only the first letter.
Text Shadow: Creates a shadow effect for the text, making it more prominent and adding depth.
Font Style: Adjusts the text style between italic and normal.
Text Decoration: Adds decorations to the text, such as underline, strikethrough, or no decoration.
Font Family: Choose the font for the text from the list of available fonts.
Font Size: Adjust the text size in pixels or centimeters.
Color: Choose a color for the text.
Alignment: Align the text in positions such as left, right, center, or justify.
Letter Spacing: Adjust the spacing between characters in the text.
Line Height: Adjust the spacing between lines of text in a paragraph.
Ordered List: Create a numbered list where the items are numbered sequentially.
Bullet List: Create an unordered list where items have bullet points.
Text Direction: Set the text display direction from left to right or from right to left.
Indent: Add indentation to the beginning of a paragraph.
Outdent: Reduce the indentation at the beginning of a paragraph.
Heading: Select heading levels from H1 to H6 to apply to the text.
To access the Design Editor, click on the Text widget you wish to modify on the screen and select Design from the quick settings bar.
Align: Align the entire text content to the left, right, center, or justify within the containing element. For more information, see details here.
Sizes: Adjust the size of the text container, including width and height. For more information, see details here.
Display on: Choose the devices on which the text will be displayed (Desktop, Mobile).
Styles: Allows you to change the background color of the selected text. For more information, see details here.
To access the Advanced Editor, click on the Text you wish to modify on the screen and select Advanced from the quick settings bar.
Events: Allows you to set events for click or hover actions on the widget, see details here.
Animation: Allows you to add dynamic animations to the widget on your landing page to make it more attractive and lively., see details here.
Desktop/Mobile sync design: Allows you to set synchronization options for the design between desktop and mobile, see details here.
Position type: Lets you choose the appropriate positioning style to optimize the webpage and provide the best experience for users, see details here.
Custom advance: Allows you to customize the appearance and behavior of the component using CSS layers and custom CSS code, see details here.
