How to Use the Rich Text Element in Funnels and Websites
What Is the Rich Text Element?
The Rich Text Element gives you powerful formatting tools right inside your page editor. It’s a single, versatile text box that lets you create headings, quotes, code snippets, nested lists, and highlighted text—all without writing any code. It uses the same styling sidebar as the standard paragraph element, so you can work quickly and intuitively.
Key Benefits
Using the Rich Text Element offers several advantages:
- Effortless Formatting: Switch between headings, paragraphs, and other styles with ease.
- Advanced Lists: Build structured lists with different bullet types and numbering formats.
- Visual Emphasis: Highlight text with background colors or format block quotes to draw attention.
- Markdown Shortcuts: Use quick keyboard commands to create quotes and code blocks.
- No Coding Needed: Avoid custom HTML or third-party tools—everything is built in.
- Familiar Interface: The styling options match what you already know from the paragraph element.
Advanced Formatting Features
Switch Between Paragraphs and Headings
Change text style directly from the toolbar:
- Select the text inside the Rich Text Element.
- Click the Paragraph dropdown in the floating toolbar.
- Choose a heading style from H1 to H6.
Create Block Quotes
Format quotes or testimonials clearly:
- Type a greater-than symbol (>) at the start of a line.
- Press Enter to convert it into a block quote.
- Enter your text inside the quote block.
Inline Code Blocks
Display short code snippets within a sentence:
Wrap the text with single backticks (`) on both sides.
Full Code Blocks
Show longer sections of code:
- Type three backticks (```).
- Press Enter to create a code block.
- Paste or type your code inside.
Advanced and Nested Lists
Create organized lists with multiple levels:
You can make a list in two ways:
- Type an asterisk (*) followed by a space.
- Or, select text and click the Unordered List or Ordered List button in the toolbar.
Change the list style using the dropdown next to the bullet or number. Options include:
- Unordered: bullets, circles, squares
- Ordered: numeric, lowercase letters, uppercase letters, lowercase Roman numerals, uppercase Roman numerals
Press Tab to indent (create a nested level) or Shift+Tab to outdent.
Highlighting Text with Background Color
Emphasize important text:
- Select the text inside the Rich Text Element.
- Click the Color Picker icon in the floating toolbar.
- Choose your highlight color.
Keyboard and Markdown Shortcuts
- Toggle Paragraph/Heading: Ctrl+Alt+1-6 (Windows) or Cmd+Option+1-6 (Mac)
- Block Quote: Type > and space at the start of a line
- Inline Code: Wrap text with `backticks`
- Code Block: Type ``` and press Enter
- Highlight Color: Select text and choose a color from the toolbar
Sidebar Styling Options
Customize your Rich Text Element using the style panel:
- Typography: Adjust font, weight, size, and line spacing.
- Spacing: Set margins and padding for desktop, tablet, and mobile views.
- Effects: Add shadows or entrance animations.
- Visibility: Show or hide the element on specific devices.
- Advanced: Apply custom CSS classes for more control.
List Item Spacing
Control the vertical gap between list items without affecting line height:
- Select a Rich Text or Bullet List element.
- Open the Style panel and find List Item Spacing near Line Height.
- Drag the slider or enter a value to adjust the spacing.
Tip: Use Line Height for spacing within a list item, and List Item Spacing for gaps between items.
How to Add a Rich Text Element
- Open your funnel or website in the Builder.
- In the left panel, click Quick Add and select Rich Text.
- Drag the element into your desired row or column and click to start editing.
Frequently Asked Questions
Q: Can I convert an existing Paragraph element to Rich Text?
A: No. You must use a Rich Text Element to access features like switching between headings and paragraphs.