The “Contact Form 7 Widget“ for Elementor helps you to create stunning popups and increase your website’s engagement for free. Easily create custom popups on the fly right within the Elementor page builder. You can customize each element separately to fit the design of your website.
Let’s look at each of the options in the “Contact Form 7 Widget” below.
To use this widget requires downloading and activating the plugin Contact Form 7 from the WordPress Plugin Directory.
Add a Free Contact Form 7 for Elementor
This widget requires Unlimited Elements Free version to be installed and activated on your WordPress website.
- Go to Unlimited Elements Widget Library
- Search in the search bar for “Contact Form 7”
- Hover over the widget in the search results and click install
- Add your “Contact Form 7″ widget to any Elementor Page
General Settings for Elementor Contact Form 7
Select Form
Choose an form created with form 7 plugin.
Show Form Title
Show/Hide the form title.
Show Form Description
Show/Hide the form description.
Textarea Style
Enable/disable the text area styling.
Placeholder Style
Enable/disable the placeholder styling.
Date Style
Enable/disable the date styling.
Radio Button Style
Enable/disable the radio button styling.
Checkbox Style
Enable/disable the check box styling.
Dropdown Style
Enable/disable the dropdown styling.
Button Style
Enable/disable the button styling.
Field Validation Error Style
Enable/disable the field validation error styling.
Acceptance Style
Enable/disable the acceptance styling.
Alert Style
Enable/disable the alert styling.
Widget Styling for Elementor Contact Form 7
A lot of styling options are given to give your website an exact look and feel you want. You can modify the text, fonts, and layout until it functions exactly as you desire.
Form Container Styling for Elementor Contact Form 7
Style the width, alignment, margin, padding, background, border and border radius of form container.
Label Styling for Elementor Contact Form 7
In this section, style the label display, gap, typography, alignment, color, and text shadow.
Input Styling for Elementor Contact Form 7
Style the input height, width, spacing, padding, typography, alignment, background, text color, border, and border radius.
Textarea Styling for Elementor Contact Form 7
Set the text area width and height.
Placeholder Styling for Elementor Contact Form 7
You can set the placeholder typography, color, and text shadow.
Button Styling for Elementor Contact Form 7
Style the button typography, alignment, width, padding, gap, text color, background and border.
Usage Examples of Elementor Contact Form 7
Here are some live use cases for the Contact Form 7 Widget.
Contact Form 7 with a Custom Background
Contact Form 7 with Advanced Fields
Thank you for using the Contact Form 7 Widget for Elementor! With its seamless integration and flexible customization options, this is the best Contact Form 7 Widget for Elementor, making it easy to create and style forms for your website. We hope it helps streamline your communication. If you have any questions or need assistance, feel free to reach out.
