loading..
< View all articles in Landing Page Design.

Properties Panel (For Normal Landing Pages)

The properties panel allows you to view and change the existing settings of the various blocks in the landing page.

Note: This article is related to the Normal Landing Page Designer which has been discontinued w.e.f. 24th August, 2016. The Responsive Designer will act as the main landing page designer. If you have landing pages already created in normal designer then you will be able to edit the pages in the same designer. For creation of new pages, the responsive designer will be the default.

You can view the properties panel by clicking on the Prperties button button in the landing page editor toolbar. Click on the block you want to change the property of, and you can view the panel on the right side.

Properties panel

The properties panel can be used to set the background and dimension of the canvas and page.  You can view the canvas and page properties panel if you select a blank template or click in a place where there is no block present.

Canvas properties

Below is the list of actions that you can perform in the properties panel:

1. Background: This allows you to select the type of background of the block. It is applicable to canvas and page properties as well.

  • If you select None, then the background remains plain.
  • If you select Solid, then you cam choose the background color by selecting the desired color in the color mixer pop up. (Alternatively you can specify the color by entering the HTML code for the color.)

Block

  • If you select Gradient, then you cam choose the background color by selecting the desired color in the color mixer pop up. (Alternatively you can specify the color by entering the HTML code for the color.)

Gradient

  • If you select Background Image, then you can insert an image as the background for the block. You can specify the position and tiling too. In the Image URL field, you must specify the location of the image, which might be present in LeadSquared image library or in an external location.

BG Image

2. Border: This allows you to select the border properties of the block.

border

  • Color: You can specify the color of the border by choosing the color in the color mixer pop up or by entering the HTML code of the color.
  • Width: You can select the thickness of the border and also select where the border is to be present.
  • Corner Radius: You can choose if the borders are to be sharp or curved using the slider.

3. Box Shadow: This allows you to give a shadow effect to the block. You can choose to give the effect in the horizontal or the vertical position. You can also choose to give the shadow effect a blur appearance along with the spread. It can either be inside or outside the block.

Box Shadow

3. Dimension: This allows you to specify the width and height of the block.