Skip to main content

How to Add Divider to Your Page ?

Through this document , you will uncover the 'Divider' feature properties in site editor page through these key elements:

1. Adding a Divider
2. Feature Settings Window
3. Style Settings Window

Adding a Divider

  • Drag the divider icon from the available features

image.png

  • Drop the divider icon into the desired location on your website page

image.png

Feature Settings

____________________________________________________________________________

  • Settings

    • Determine how your divider is visible on devices (Mobile , Tablet , Desktop , Large desktop).

____________________________________________________________________________

  • Icons

    • Select the icon of your divider that align with your website. 

____________________________________________________________________________

  • Animations

Style Settings

Design Features

  • Access the "Design" feature to customize your divider appearance. Within this feature, you can determine the following properties:

    • Margin: Set the spacing around your divider to control its placement on the page.

    • Border: Define a border for your divider to add a distinct visual element.

    • Color: Choose the color that best complements your website's theme or design.

    • Style: Apply different styles to your divider, enhancing its visual appeal.

    • Gradient: Add gradient effects to your divider for a more dynamic and modern look.

Background Features

  • Navigate to the "Background" feature to enhance the backdrop of your divider.

    • Upload Images: Insert images as a background for your divider, providing visual interest.

    • Sample Images: Explore pre-loaded image samples for quick and easy background selection.

    • Background Styling: Customize the divider background further with options like:

      - Background Repeat: Control how the background image repeats.
      - Background Fill: Adjust how the background fills the space around the divider.
      - Background Position: Define the positioning of the background image for optimal display.

Style Customization

  • Within the "Style" section, further refine your divider presentation by adding classes from a dropdown list with a plethora of options.
  • Determine how your divider is visible on devices (Mobile , Tablet , Desktop , Large desktop.