Advertisement
  1. Web Design
  2. WordPress
  3. WordPress Plugins

How to Create Custom Forms in WordPress

Scroll to top
Read Time: 4 min

Forms enable you to collect information from your site visitors. Whether it's registering for an account, logging into your site, giving you feedback about your product, contacting you, or signing up for your newsletter—you collect the data through forms.

With WordPress, it's quite easy to integrate a form in your website. Most themes will provide you with common forms like login, register, and contact forms right off the bat.

The problem, though, is that you might not like the ones included by default. Perhaps you want one that blends better with your overall theme or collects other data.

In this article, I'll show you how to create nice-looking forms that match your theme's design and color scheme, without having to write any HTML or CSS code.

Install a WordPress Membership Form Plugin

There are dozens of free and paid plugins that you can use to create custom forms. In this example, we'll use a free plugin named Ultimate Member.

The best thing about this plugin is that it creates everything for you—forms, pages, email newsletters, and so on. It also has a super customizable form builder that provides a vast collection of field types (e.g. date picker and file upload), as well as thousands of icons that you can include in your form to make it eye-catching.

Before we get started, you'll need to first install the plugin. To do that, follow these steps:

  • Sign in to your WordPress admin dashboard.
  • Navigate to Plugins > Add New
  • Use the search bar to search for "Ultimate Member"
  • Install and activate the plugin (the highlighted option in the image below)
Ultimate Member PluginUltimate Member PluginUltimate Member Plugin
Ultimate Member Plugin

Once the installation is complete, you'll find the Ultimate Member tab on your dashboard. Navigate to Ultimate Member > Settings to see all the options.

Custom Pages and Newsletter

As I mentioned at the start of this article, the Ultimate Member plugin helps you create the different kinds of pages you'd typically need in your website.

Sample pagesSample pagesSample pages
Sample pages

You can also include newsletter sign-up prompts in your website and customize the welcome email (Account Activation Email) to suit your taste.

Welcome email templateWelcome email templateWelcome email template
Welcome email template

You can customize the various pages and forms from the Appearance tab. Now, let's see how to create forms in your website.

Creating Forms

Navigate to Ultimate Members > Forms in your WordPress dashboard. There you should find the default Login, Register, and Profile forms.

FormsFormsForms
Forms

You can edit one of those forms or create a new one from scratch. Clicking on edit on any of the forms will take you to the form builder.

Form fieldsForm fieldsForm fields
Form fields

Here we have fields for username, first name, last name, email address, and password. The first four are all text boxes, whereas password is a field of type password—like a text field but with masked input.

You can add a new field or customize an existing field. To customize an existing field, you simply click the pencil icon next to the field name, and a modal containing the field details will appear.

Edit fEdit fieldieldEdit fEdit fieldieldEdit fEdit fieldield
Edit field

Here you can see a bunch of input customization options. You can get more information on each option by hovering on the question mark icon above it. That will display a tooltip.

To add a new field, click the + icon below the other fields to open the fields manager.

Field typesField typesField types
Field types

Choose the type that matches what you want to collect using that input. You can also choose a custom field below (if you have previously created any).

After you choose a field, a new modal will be displayed where you can provide details about your input (title, placeholder, etc.) and add an icon. Once you're done, click the Add button to add the field to your form.

To see how the form looks, click on the Live Preview button located at the top of the form builder.

Live Form PreviewLive Form PreviewLive Form Preview
Live Form Preview

You can also add things like margin, padding, border color, and border radio. You can even link a CSS class to each input using the row editor (click on the pencil icon just beneath Live Preview).

Edit rowEdit rowEdit row
Edit row

With these tools, you can easily create appealing forms and make them blend with your overall theme design.

Conclusion

Though there are many other plugins that you can use to create forms, Ultimate Member is definitely among those with the richest features. Not to mention that it's free!

Advertisement
Did you find this post useful?
Want a weekly email summary?
Subscribe below and we’ll send you a weekly email summary of all new Web Design tutorials. Never miss out on learning about the next big thing.
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.