Introduction #
Adding a form to your WordPress website is a great way to collect information from your visitors. Whether you want to create a simple contact form or a more complex survey, WordPress provides several options for adding and customizing forms on your site. In this guide, we will walk you through the steps to add a form to your WordPress website using three popular plugins: Elementor Pro, Contact Form 7 and WPForms
Elementor Pro is available from Orbi Hosting from just £8.99 p/m. Sign up today
Elementor Pro #
Elementor Pro is a powerful drag-and-drop website builder plugin for WordPress. It is an upgraded version of the free Elementor plugin and offers a wide range of additional features and functionalities to enhance your website design and development experience.
1. Install and Activate Elementor Pro: First, make sure you have Elementor Pro installed and activated on your WordPress website. You can purchase and download Elementor Pro from the official Elementor website.
2. Create a new page: Go to your WordPress dashboard and navigate to “Pages” > “Add New” to create a new page where you want to add the form.
3. Edit with Elementor: Once you have created the new page, click on the “Edit with Elementor” button to launch the Elementor editor.
4. Drag and Drop the Form Widget: In the Elementor editor, you will see a sidebar panel on the left-hand side. Search for the “Form” widget and drag it onto your page canvas.
5. Customize the Form Fields: With the Form widget selected, you can now customize the form fields according to your requirements. You can add fields like Name, Email, Phone, Message, etc. by simply clicking on the “+” icon next to the Form Fields option in the sidebar.
6. Configure Form Settings: After adding the desired form fields, click on the “Actions After Submit” tab in the sidebar. Here, you can configure various settings such as the email recipient, subject, and message.
7. Styling the Form: Elementor Pro provides extensive styling options to customize the appearance of your form. You can change the colors, typography, spacing, and more using the Style tab in the sidebar.
8. Add Submit Button: To complete your form, make sure to add a submit button. You can do this by dragging and dropping the Button widget from the Elementor sidebar onto your form.
9. Publish the Form: Once you are satisfied with your form design and settings, click on the “Publish” button to make your form live on your website.
10. Embed the Form: After publishing the form, you can either use the generated shortcode or the Elementor Pro form widget to embed the form on any page or post on your website.
Congratulations! You have successfully created a form using Elementor Pro. Feel free to further customize the form and explore other advanced features offered by Elementor Pro to enhance the functionality and design of your forms.
Contact Form 7 #
Contact Form 7 is a popular and widely used plugin that allows you to create and manage multiple forms on your WordPress site. Here’s how you can add a form using Contact Form 7:
1. Install and activate the Contact Form 7 plugin from the WordPress plugin repository.
2. Once activated, you will see a new menu item called “Contact” in your WordPress dashboard. Click on it to create a new form.
3. In the form editor, you can customize various fields such as name, email, subject, message, etc. You can also add additional fields or remove existing ones as per your requirements.
4. After customizing your form, copy the shortcode provided by Contact Form 7.
5. Create a new page or edit an existing page where you want to add the form. Paste the shortcode in the editor where you want the form to appear.
6. Update or publish the page, and the form will be displayed on your website.
WPForms #
WPForms is another popular form builder plugin for WordPress that offers a user-friendly interface and a wide range of customization options. Here’s how you can add a form using WPForms:
1. Install and activate the WPForms plugin from the WordPress plugin repository.
2. Once activated, you will see a new menu item called “WPForms” in your WordPress dashboard. Click on it to create a new form.
3. WPForms comes with pre-built form templates that you can choose from and customize according to your needs. You can also create a form from scratch if you prefer.
4. After customizing your form, save it and copy the shortcode provided by WPForms.
5. Create a new page or edit an existing page where you want to add the form. Paste the shortcode in the editor where you want the form to appear.
6. Update or publish the page, and the form will be displayed on your website.
Both Contact Form 7 and WPForms offer additional features such as spam protection, email notifications, and form submissions management. You can explore these features and customize your forms further to suit your specific requirements.
Remember to test your forms after adding them to your website to ensure they are functioning correctly and capturing the information as intended.
