Divider

About Divider ElementClick to copy

The Divider Element is the designed line break to separate two elements or sections on your page. This feature helps increase the conversation rates by improving the readability and scannability for visitors, especially on pages with multiple sections.

This article introduces you to the Divider Element and provides guidance on customizing it to suit your needs.

How To Access Divider ElementClick to copy

In the PageFly dashboard, follow the below steps to navigate to the Divider Element:

  • Step 1: Click Add element on the left toolbar.
  • Step 2: Select Divider and choose the desired style. Instead of browsing through the sidebar, you can also type Divider in the search box to quickly locate the feature.
  • Step 3: Drag and drop the chosen element onto the layout for editing.

Divider Element

Currently, PageFly offers four options of lines tailored to your preference. Additional options will soon be added to save your time.

Divider Element

Please read the below instructions to learn how to customize Divider Element.

How To Customize Divider ElementClick to copy

General CustomizationClick to copy

PageFly enables you to refine the appearance of the line for conversion rate optimal. Select the line to access its parameters.

Follow these steps to begin customizing your line:

Step 1: Click on your line to open a modal as shown below.

Divider Element

Step 2: Select the Divider Type. You can choose and customize one of the available options:

  • Plain: a simple straight line with no additional content.
  • Icon: a simple line with an icon.
  • Text: a simple line with a text.
  • Symbol: a simple line with a symbol.

Check the How to customize Divider Type section for more details on customizing Icon, Text, and Symbol types.

Divider Element

Step 3: Adjust the thickness of your line.

Note: The maximum value is 20 px and the default is 2 px.

Divider Element

Styling CustomizationClick to copy

Check here to explore the Styling Configuration guide.

How To Customize Divider Type (Icon, Text, Symbol)Click to copy

IconClick to copy

Step 1: Choose Icon from the Divider Type and select the position of the icon.

Divider Element

Step 2: Choose the icon you wish to display by one of two methods:

  • Click on the icon and select from available options.
  • Type the icon name into the search bar.

Divider Element

Step 3: Resize the icon by sliding the Size bar.

Note: The maximum value is 1000px, and minimum is 0px.

Divider Element

TextClick to copy

Step 1:  Choose Text from the Divider Type and select the position of the text.

Divider Element

Step 2: Click on the text and edit the content.

Divider Element

SymbolClick to copy

Step 1:  Choose Symbol from the Divider Type and select the position of the symbol.

Divider Element

Step 2: Click Select symbol to select from the available symbols.

Divider Element

Step 3: Resize the symbol by sliding the Size bar.

Note: The maximum value is 1000px, and minimum is 0px.

Divider Element

Frequently Asked QuestionsClick to copy

What Is PageFly Divider Element?Click to copy

Divider Element is used to segment your content, sections and other components, thereby enhancing the readability and scannability for page visitors.

Can I Add An Icon To The Line?Click to copy

Yes. Among four given Divider Types, there is an Icon option. Select the desired type and style it as you wish to display.

How Many Divider Types?Click to copy

There are four options for Divider Types.

What’s Another Term For “Line Weight”?Click to copy

Line Thickness.

Navigate this category

PreviousPrevious article

Thank you for your feedback!

Could not find the answer
to your question?

Chat with us