Using Bullet Lists for Clear and Engaging Content

Bullet lists provide an efficient way to organize information, allowing you to present content in a clear and concise manner. This format helps maintain audience engagement while enhancing the overall user experience.

Setting Up Bullet Lists

Adding bullet lists to your page is straightforward. Simply drag the bullet list element into the editor's workspace. Once placed, a dedicated editing toolbar will appear on the left side of the editor for easy customization.

Renaming the Element

For improved navigation during funnel creation, you can rename the default title of your element. This ensures each step of your funnel is clearly labeled, making it easier to move between stages.

Customizing Background Colors

To change the background color of your bullet list, select the desired content and choose a color. You can also enter a custom color code if the available options don’t suit your needs. 

Adjusting Opacity

Control the transparency of your text or content with the opacity feature, which offers a range of fade levels. This helps enhance the visual appeal of your page by adding depth and texture. 

Adding Text Shadows

Create a more dynamic look by applying shadow effects to your text. You can adjust the thickness of the shadow to achieve a more subtle or bold appearance. 

Modifying Letter Spacing

Fine-tune the readability of your text by adjusting letter spacing. This allows you to alter the distance between individual characters, improving the visual layout. 

Text Alignment Options

Align text to the left, center, right, or justify it to meet your design needs. This feature gives you control over the overall presentation of your content. 

Responsive Font Size Adjustments

Change the font size for mobile and desktop views by using the size sliders for each element. You can toggle between views to preview the changes for different devices. 

Font Style Selection

Select a custom typography for your text, or use the default headline or content font options. You can choose from a list of available fonts to match your design. 

Adding Icons

Incorporate icons into your page design by browsing available options or using the search feature. Icons can enhance both the functionality and aesthetics of your content. 

Text and Icon Color Customization

• Text Color: Adjust the color of non-bold text.

• Bold Text Color: Change the color for bold text.

• Italic Text Color: Customize the color for italicized text.

• Underline Text Color: Modify the color for underlined text.

• Link Text Color: Change the color of linked text.

• Icon Color: Adjust the color of icons without changing their position.
  
  

Spacing Adjustments

You can tweak the spacing for individual elements or rows by adjusting the padding and margin settings.

• Padding: Modify the inner spacing (left, right, top, or bottom) within an element.

• Margin: Adjust the outer spacing (top or bottom) around an element.
  
  

Advanced Customization Options

• Border Styles: Choose between solid, dashed, or dotted borders. You can also adjust the width and color of the border. 

• Border Radius: Round the edges of your borders by adjusting the radius, with the option to apply it to all corners or specific edges.

• Line Height: Drag the slider to expand or condense the height of the element box as needed. 

• Text Transform: Easily switch your text to uppercase, lowercase, or capitalize each word for a unique look. 

Visibility Settings

Control which elements appear on desktop, mobile, or both. Hide or display content based on the platform for an optimized user experience. 

Adding Custom Classes

You can add a custom class to your design by entering a specific class name in the designated field. This helps you apply personalized styles or attributes. 

Copying CSS Selectors

Easily duplicate the CSS Selector for any reference number by clicking the copy icon next to it. This copied selector can be used across different sites.