How to create a form in WordPress without a plugin

WordPress is one of the most common ways to create and design a website. We wouldn’t be wrong if we defined WordPress as your website’s operating system.

Yet, WordPress plugins are sometimes difficult to maintain. Plugins can limit you. your ability to create things from scratch and produce goods that are most relevant to your requirements and tastes.

It is occasionally required to create a new WordPress form for a, particularly specific necessity while developing a WordPress website. Of course, plugins exist and are useful when working on a new site. But, you can also create a new, custom handcrafted WordPress form and learn how to create a form in WordPress without a plugin.

Yes, you can always rely on WordPress plugins. Yet, working without using the WordPress plugin will allow you to create more custom content for your WordPress site. It will give you more freedom to display whatever you want on your WordPress site.

WordPress plugins are not always the best answer for form installations. Thus, use Getform to create a simple and adaptable WordPress form on your site. Plugins are vital, but they can cause your WordPress site to run slow. This is why it makes sense to explore ways to add functionality without relying on plugins when possible. Each plugin adds its own code and files to the WordPress database. This can slow down the site’s speed and increase its memory usage. To avoid this, it is good to know how to create a form in WordPress without a plugin.

Managing an excessive number of plugins on a WordPress site is time-consuming. To keep the plugins up to current, you must update them. Furthermore, plugins might interfere with one another, causing your WordPress website to break.

As a result, using fewer plugins can help you resolve any difficulties with your site more quickly. Forms are an essential component of every website, as well as for any WordPress website. There are several WordPress plugins available for creating custom WordPress forms. But, most of them are inadequate. It is more simple to create a form in WordPress if you have a good understanding of PHP, HTML, and Javascript.

In this article, you will find out some of the crucial information about how to create a form in WordPress without a plugin.

Here, you will learn about:

  • working without plugins,
  • using custom HTML code,
  • creating page templates,
  • creating forms,
  • building the website WordPress form,
  • using the jQuery plugin,
  • what is the PHP file used for,
  • what are nonces,
  • how to enhance WordPress form,
  • what are some usual errors, etc.

Add a Custom HTML Section and Setup WordPress Form

Create a new page to house your WordPress Contact Form. Log in to your WordPress dashboard, and go to the Pages settings area. Step 2 is to select and click Add New. When creating a contact page, choose a meaningful name. For example: “Contact Us”.

More simple contact form – the better. This should be as simple as possible. You only need name, email, and comment boxes to create a simple contact form. It should be copied and placed into the page-contact.php file.

Step 3 is to create your WordPress form after you’ve named your Contact page. You may use the code block if you activate Bootstrap on your WordPress site.

If you desire to keep complete control over your site’s appearance, you may use the form code block without bootstrap. After selecting the appropriate code block for your WordPress site, add a Gutenberg custom HTML block. Paste the form code of your choosing.

If you’re using an older WordPress version that lacks the Gutenberg HTML block, go to the Text tab settings first. Paste the form code of your choice into the area.

Don’t forget to include the endpoint URL you found to the action property of the HTML block. As a result, submissions will be sent to the form you built on your Getform dashboard.

Creating a Page Template

Step 1 is to create a template for a WordPress page. To do so, copy the code from page.php into a new file called page-contact.php. To ensure that WordPress treats the contact.php file as a WordPress page template, we must include a comment at the top of the file.

Building the Form

We must now create a basic WordPress contact form. Simply copy and paste the code into the entry content. It’s not difficult using this self-explanatory HTML code for a form. It will be used later to determine whether or not the form has been submitted.

Data Pre-Processing

The created form will seem nice, but it will be completely worthless because it will not send any emails. What we need to do is take a look at the form that was submitted and recheck all the data. You need to check to see whether the fields were accurately filled out with proper data.

If the boxes are filled with the correct data, we will obtain the blog administrator’s email address and send them the email.

Otherwise, no email will be sent and the user will have problems. Check that the form was submitted and filled out with accurate data. If an error occurs, such as an empty field or an erroneous email address, a notice is displayed and the form is not submitted. You have to correct this data and try again.

Adding a jQuery Verification

Our form is now completely ready. But, we may improve it by incorporating client-side verification. To do this, we will use jQuery and the confirm jQuery plugin. This plugin is fantastic since it allows you to quickly verify if a form has been filled out with accurate data. The first step is to download and install the validate plugin into your theme file.

We must now connect the Javascript files to our theme. After that, the jQuery validates plugin will confirm the contact form on the client-side. How does it function? It selects form data that have the requisite CSS class and validates that they are appropriately populated. If this is not the case, a notice is displayed and you will have to correct all the wrong data entries.

Enhancing Form

Make use of WordPress’s capabilities to safeguard the use of our form using nonces. The functions will allow you to ensure that the content of a form request originates from the current site and not another. As a result, it is not ideal protection, although it does protect in many circumstances.

Its first parameter is an action, while its second argument is a name. These two words are utilized again later in our code to determine if the submitted nonce corresponds to these two inputs.

It is important to include nonce fields in your WordPress forms. Nonces can be used to verify a user intends to perform an action and is instrumental in protecting against Cross-Site Request Forgery (CSRF)”.

Data Interception With Template

Concentrate on the form’s processing logic: we leave the template and head to the functions.php file to handle the data received.

It is necessary to connect to a WordPress action that runs before the WordPress page headers are produced. It is to potentially redirect the user to another page after evaluating the form input.

The first condition in our function assures us that a form entry has been submitted. There is a link between the function and the template redirect action. Because of this, whenever the šage loads, it will be called.

It is thus critical to filter the requests and ensure that it is time to parse the form input if it exists. This indicates that the submit button on the form was hit and that it is now time to test the request.

Processing the Data

Once we’ve completed our checks, it’s up to you to do anything you want with the form data stored in the variable. Save the gift amount as a variable.

After successfully updating the database, we need to redirect the user to a page. Also, you have to create a success message, which you can create using Dashboard.

Error Handling

You have to make sure you submit and fill out the form appropriately. If an error occurs, such as an empty field or an erroneous email address, you’ll get a notice and the form won’t be able to submit.

After this, you must create and display error warnings underneath the associated box. Create something simple, such as “Please enter your name.” You will get a complete form page template that you may use.

FAQ about WordPress forms

How do I create a form in WordPress?

Ah, so you want to create a form! Just start by installing a plugin like Contact Form 7 or WPForms. Once installed, you’ll be able to create forms from your WordPress dashboard.

Customize the fields and appearance as needed. When you’re satisfied, just copy the generated shortcode and paste it into the page or post where you want the form to appear. Voila, you’ve got a form!

Can I add conditional logic to my forms?

Absolutely, my friend! Most form plugins, like Gravity Forms and WPForms, offer built-in support for conditional logic. This lets you create dynamic forms that show or hide fields based on user input.

You’ll usually find this feature in the plugin’s form builder, under advanced settings or options. Just configure the rules, and you’re all set for a more interactive form experience.

How do I set up email notifications for form submissions?

No problem at all! In your form plugin settings, you’ll find an area for configuring email notifications. You’ll need to provide the recipient’s email address (usually yours) and customize the subject line and message body. Most plugins support dynamic fields, so you can include information from the form submission in the email. Don’t forget to save your settings, and you’ll start receiving email notifications for each submission.

How do I prevent spam in my forms?

Ah, spam – the bane of our online lives. To prevent spam in your WordPress forms, you can use built-in features like CAPTCHA, Google reCAPTCHA, or a custom question.

Most form plugins support these options, so just head over to the settings and enable your preferred spam-prevention method. This will add an extra layer of security, helping to keep those pesky spambots at bay.

Can I integrate my forms with third-party services?

You betcha! Many form plugins support integration with popular third-party services like Mailchimp, Salesforce, and Zapier.

This allows you to automate actions, like adding new subscribers to your mailing list or updating your CRM with lead information. Check your plugin’s documentation for instructions on setting up these integrations. The possibilities are endless!

How do I style my WordPress forms?

Wanna make your forms look snazzy? You can customize their appearance using CSS. Most form plugins generate unique CSS classes for each form element, allowing you to target specific fields and style them accordingly.

You can add your custom CSS in the WordPress Customizer or in your theme’s style.css file. If you’re not familiar with CSS, you can also look for form plugins that offer a built-in visual form styler.

How do I export form submissions?

Need your form data in a different format? Most form plugins offer an export feature that allows you to download your form submissions as a CSV, Excel, or other file formats.

You’ll usually find this option in the plugin’s settings or submissions page. Just select the desired format and hit the export button. You’ll have your data ready for analysis or import into other systems in no time!

How do I create multi-page forms?

Multi-page forms can help break up lengthy forms and improve user experience. Many form plugins, like Gravity Forms and WPForms, have built-in support for creating multi-page forms.

You’ll typically find a “Page Break” field or similar option in the form builder. Just add this field where you want to split your form, and you’re good to go!

Can I limit the number of form submissions?

Sure thing! Some form plugins offer the option to limit the number of form submissions. You can set a specific limit, or even configure the form to close automatically after a certain date.

You’ll usually find this option in the plugin’s settings or under form properties. Once the limit is reached, the form will either display a custom message or simply stop accepting new submissions.

This can be useful for managing event registrations, contests, or any situation where you need to cap the number of responses.

How do I add file uploads to my forms?

File uploads can be a great addition to your forms for collecting documents, images, or other files. Many form plugins, like Contact Form 7 and Gravity Forms, support file upload fields.

To add one, just drag and drop the file upload field into your form and configure any settings, like accepted file types or max file size. When users submit the form, their files will be uploaded and stored on your server or sent to you via email, depending on your plugin settings.

Ending thoughts on how to create a form in WordPress without a plugin

Using WordPress to create a website is a very popular choice for many. It offers various options for its users. The user is offered to choose a specific theme for the site, to organize what one wants to display on their site in the tiniest detail… It allows you to create and add new pages and content with or without using the plugins.

WordPress is a great choice to create a website or blog. It is good for beginners and also by people who are more familiar with building websites and working with the code.

In this article, we presented you with ways how to create a form in WordPress without a plugin for your WordPress site.

Creating forms is essential when designing a WordPress or any site. It might need a bit more knowledge about the code. But, there are always plugins to ease the job while you’re still learning how to work with the code. Be patient, learn, and you will create amazing WordPress or blog websites.

If you enjoyed reading this article on how to create a form in WordPress without plugin, you should check out this one about how to hide the author in WordPress.

We also wrote about a few related subjects like how to embed a google form in WordPress, how to upload an HTML file in WordPresswhere are WordPress pages stored and how to delete WordPress themes.

Milan Jovanovic
Milan Jovanovic

Product Lead

Articles: 214