How to add and configure contact forms in WordPress

How to add a contact form in WordPress with Contact Form 7

Now let’s try it with a different WordPress plugin.

Step 1: Add a new form

From Contact, go to Contact forms. After selecting “add new,” enter your chosen name.

You’ll get a new form with pre-added fields like name, email, subject, and message.

You might want to keep these fields and add a few more. To add a date field, for example, choose a tag from the list at the top of the form editor panel to add a new field. This is what it looks like:

To add a date field, click on the date tag.

You’ll get some options in the popup that appears, out of which you can keep the Name, Default value, Class attribute, and ID attribute.

Check the Required field box. Then choose “insert tag.”

Step 2: Configure mail delivery settings

You can personalize what happens when someone contacts you through the form. This is a crucial step since you will be notified when someone fills out the form only if the emails are properly configured.

Let’s examine each of the options.

• To: The plugin will send an email to this email address whenever someone fills out the form. Contact Form 7 utilizes the site administrator’s email by default.
• Subject: This lets you customize the subject of the email.
• From: This allows you to change the emails’ from field. It’s recommended to put the name of your website here. The email address of the sender is also included.
• Additional headers: Here, you add the cc and bcc recipients.
• Message body: Here’s where you put the message you’d like to send.
• File attachments: Include your file tag here if you’ve checked the option to upload files on your contact form.
• Mail (2): This lets you craft an automated message that visitors receive when they use the contact form.

Step 3: Publish the form

From Contact, go to Contact forms. Here, you get the short code that you can include on your website.

Go to the page where you want the contact form to be displayed. In the post editor, paste the short code in the space for text.

Make sure to preview the page and make changes, if needed, before publishing.

Creating forms without plugins

If you’re worried about overloading your site with plugins, you have other options for creating contact forms: using page builders and doing it manually with code.

Using page builders

If you’re already using a page builder on your WordPress site, chances are it can also build fully functional contact forms. As usual, you can use them to create contact forms with drag-and-drop interfaces and pre-built templates without needing to code.

They focus on customization, allowing you to adjust form fields, layouts, and designs to match your site’s needs.

Many page builders integrate directly with email marketing platforms, CRM systems, or databases, allowing for efficient management of form submissions and customer data.

Additional features like spam protection, conditional logic (where form fields change based on user input), and multi-step forms offer enhanced functionality. These tools also ensure forms are responsive, working seamlessly across devices.

Elementor’s form builder, for example, provides full design control, integrates smoothly with third-party services, and includes advanced features such as dynamic field validation and automated actions after submission.

Using custom code

If you’re after as much control as possible and don’t mind a little elbow grease, you can code a contact form for your site:

1. In your theme’s folder, create a new template file, e.g., contact-form.php
2. Add HTML to define the form’s structure:

<form method="post" action="">
	<label for="name">Name:</label>
	<input type="text" id="name" name="name" required>
	<label for="email">Email:</label>
	<input type="email" id="email" name="email" required>
	<label for="message">Message:</label>
	<textarea id="message" name="message" required></textarea>
	<input type="submit" name="submit_form" value="Send Message">
</form>

3. Add PHP code at the top of the form to handle submissions:

if ($_SERVER['REQUEST_METHOD'] == 'POST' && isset($_POST['submit_form'])) {
	$name = sanitize_text_field($_POST['name']);
	$email = sanitize_email($_POST['email']);
	$message = sanitize_textarea_field($_POST['message']);
    
	$to = get_option('admin_email');
	$subject = 'New Contact Form Submission';
	$headers = 'From: ' . $email;
    
	wp_mail($to, $subject, $message, $headers);
	echo '<p>Thank you for your message!</p>';
}

4. In the WordPress admin, create a new page or edit an existing page, then insert this PHP template into the page via a custom template or shortcode.

5. Check the form on your website and test submissions.

WordPress contact form security

To keep your WordPress contact forms from becoming a security liability, implement the following measures:

Integrate CAPTCHA to prevent bot submissions and ensure your forms are filled out by real users only.

Validate inputs both on the client and server side to confirm the data submitted is correct and secure.

Add challenge tokens to your forms to protect against cross-site request forgery attacks by verifying legitimate submissions.

Limit submission attempts from the same IP address to avoid brute-force attacks and spam submissions.

Sanitize user data before processing it to eliminate any potentially harmful scripts or malicious content.

Encrypt data using SSL/TLS to secure sensitive information during transmission and protect against interception.