Box options

Last updated: June 27, 2022 Written by: Justyna
Table of contents show hide
    Table of contents show hide

      Boxes are the elements thanks to which you can divide your landing page into parts. They are useful while adding the background under other elements to improve their exposition. 

      Add the box widget

      On the left side of the editor, find the Box widget, then drag and drop it into the active area of your landing page.

      Edit the box

      Click on the box to start editing. You will see its context menu (1) and toolbar on the right side of the editor (2).

      Context menu

      You can change the size of the box by clicking on the dots on the frame (1). The remaining icons let you change its position (2), duplicate the box (3), move it to the top/bottom (4), and delete it (5).

      Widget toolbar

      In the widget toolbar, you can turn on/off mobile or desktop view (by default, the box is visible in both views) and change the box size.

      Underneath, you will find tabs with some additional options. You can turn them on or off using the slider located in the right-hand corner of each tab (except the Other tab).

      • Background – choose the style of the background: full color, gradient, or image.
      • Border – adjust the parameters of the frame: thickness, line style, and color.
      • Rounded corners – set specific values to round corners (the value can be the same for all corners or different for each).
      • Shadow – set values for the shadow of the box.
      • Other – adjust box position, copy the button ID or add a class.


      You can apply a layer of color to the image (1) in the box background. Click on Under or Over, select the Color (2), and then set the transparency level.

      To get inspired and create even better landing pages, read our Landing Page Best Practices article.

      Was this manual helpful?