Hello everyone, today we are going to talk about the free Lead Form builder and its newly launched styler for Elementor.

Lead form builder is a free WordPress plugin that has a ton of features. It also has a pro version which you can buy for better control over the forms. The Lead form has various input fields that will fulfill all your needs for creating a beautiful and powerful unique form. Once the form is created attach it to any post or page using the shortcode generated for that form. To know more about Lead form builder, navigate to this Post.

Lead form Builder Pro

Free Lead Form Builder for Elementor

Now let us move on to talk about its highly customizable styler for Elementor– Lead Form Styler for Elementor

You need to have Elementor installed for the styler to work. You also should have created a unique form using the Lead form builder. Open any post or page of your choice to edit with Elementor. Now go to the search area and type Lead form Styler there you will see the widget named Lead Form Styler.

Free Lead Form builder

Content Tab-

Drag and drop that widget to the Elementor content area. Now all the styler settings are visible in the Elmentor editor panel. In the content tab, you can see that it displays the list of already created forms. Select the form that you wish to edit.

Free Lead Form Styler for Elementor Builder

Style Tab-

In the style tab, you can see separate sections for each control. 

Lead Form General Style – Here you can adjust the whole width of the form. If the form is reduced in width, alignment ( Left, Center, Right) can be applied to the form.

Free Lead Form Styler

Label and Title Styling – You can change the color and manage the typography of all the form labels and the title of the form as well. If needed you can hide the title. 

Field Styling-   This section has two separate tabs. The first is for color and the second is for dimensions.  In the color tab, you will find many color controls. The color of all the fields can be changed. After this, you can adjust the color and typography for input text, placeholder text along with select (dropdown ) option text. In the dimensions tab, you can set the alignment for the field label. Adjust the spacing between the label and input field as well as the spacing between fields.

Manage the height and width of various input fields with text area. You can give a border-radius to these fields and margin around them.

lead form field styling

Radio and Checkbox Styling- Styled radio and checkboxes look very attractive. You can create those good-looking and interactive radio buttons and checkboxes from here. Change the switcher to yes to change the default style. Here again, as in the previous section, you will see two tabs color and dimension. You can change the size of the button. You can adjust the spacing between buttons and their respective label. Apply the background color for the checked and unchecked state of these buttons.

The border radius of radio buttons and checkboxes can be adjusted which can make the checkbox circular and the radio button rectangular.

Lead Form Styler for Elementor

Color options for radio and checkbox ( Pro )

1. Radio and checkbox label color and font size.
2. Border width and color control for radio and checkbox.
3. Background color option for checked and unchecked state of radio and checkbox.
4. Symbol color option for checked and unchecked state of radio and checkbox.

Button Styling- The padding inside the button and the margin around it can be set. You can also change the typography and color of the button text. There are options for changing the size of the button along with its alignment.  You can give the hover color to your button and also you can give the Border-radius to make the button look oval in shape. You can set the type of border, give color and adjust the width of the button.

Lead Form Styler for Elementor

Form Submission Message- ( Pro )When the form is submitted by the user a message is displayed, which you might not see at the moment because the form is not submitted yet. To preview the message without submitting the form for styling purposes, enable the preview option for unique form submission messages. You can style this message box as per your need.

Give it a nice background color along with suitable text color. If you want to apply a border around this message box, you can do so by choosing the type of border, its color, and width along with border-radius.

Lead Form Styler for Elementor

Recommended Theme – There are a lot of base themes available for page builders like Elementor. I recommend Hello, ShopMania, and Zita WordPress themes. These themes are fast and easy to use.

Conclusion –

Elementor opens up a sea of possibilities for designing. Using Lead Form Styler for Elementor, Now you can utilize those fantastic Elementor features to design your favorite lead form and make it look lovely. You check our demo for styled unique forms here. If you like the styler and want to customize your own form you can download the free version from here and if you want complete control over every element of the form get the pro version here.

Read More –