fbpx

Table Of Contents

How to Use Simple Contact Form Widget

Contact form is one of the most vital components of the website. In this article, I’m going to tell about the Simple Contact Form Widget by Element Pack and how to use it. I’ll include some instructions and pictures detailed to help you get started.

So, let’s start.

To Insert Widget

Inserting Simple Contact Form Widget

Inserting widget, it is just a matter of dragging and dropping. As you see in the screenshot above.

Content Tab

Using the content tab, you’ll be able to make a layout of a particular part of a website. And in this regard, some handy sections in the tab will assist you a lot

From Layout

You’ll find here a few switcher buttons (Label, Contact Number Field, Name/Email Field Inline) that will allow you to manipulate the form. In addition, Input Size from where you can select any size with default one (Small, Large ) as well as alignment of Text (left, center, and right).

One important thing to note is that nothing is showing in the form. And for that you have to enable some switcher buttons (Custom Text, Additional Bottom Message, and Hide reCAPTCHA Badge) from the section Additional.

Simple Contact Form Widget layout

Go to the Content tab > Forms Layout.

Submit Button

This section will allow you to add text to the Submit Button and also to determine size and alignment.

contact form button

So, go to the Content tab > Submit Button.

Additional Options

This section includes some additional options. If an option is needed, from here, you can enable the option. That’s it.

additional contact forms wordpress settings

Simply, go to the Content tab > Additional Options.


Style Tab

Now, let’s work with the Style Tab. The tab will confidently have you style the web content (text, image, video, etc.) of the page you require to design. 

Styling with the Style tab in Elementor will always give you a fantastic experience.

Let’s have a look.

Form Style

form style options by Element Pack

From this section, the thing you can do is to increase the field space. So, go to the Style tab > Form Style.

Label

contact form label

Label is used to define something (in terms of form Name, Email, Contact Number, Subject, etc are label.). This section will allow you to set spacing, text color, and typography to the form.

Therefore, follow Style tab > Label.

Fields

Normal:

contact form fields

There are two modes(Normal and Focus) in the Fields section. In the Normal mode, you’ll be able to set text, placeholder, and background color.

In addition, border type and radius, box-shadow, padding, and typography. Look at the screenshot above and follow the flow below.

Go to the Style tab > Fields.

Focus:

focus fields

This mode will let you set background and border color to be focused on every single field.

Just go to the Fields > Focus.

Submit Button

Here is the submit button. To style the button, there are two modes (Normal and Hover). Just, see the screenshot below.

Normal:

contact from button style

Hover:

Additional Message

additional message style

From here, you will be able to style the additional message. Simply, go to the Additional Message.


Video Assist

In conclusion, though there are various contact form plugins in the WordPress repository, I hope our Simple Contact Form Widget will be one of the best solutions for making a contact form. Watch video assist and to get more ideas about the usage of the widget by Element Pack, take a jump into the demo page.

SIGNUP NEWSLETTER

Don’t worry we hate spam and we promise you will get only quality news and offer from us.

Enjoy Black Friday Exciting Deals Right Now. Check Here
© Copyright 2021 All Rights Reserved by BdThemes

Enjoy Black Friday Exciting Deals Right Now. Grab The Deals Before The Time Ends!

Day
Hour
Min
Sec