How to Add Powerful Forms to Your WordPress Site

If you are a frequent reader of this blog, you know that I talk about forms all the time. Not only do I love sharing the options out there for you, but I feel that most forms are underused. There is so much you can do with forms to grow your site and help your readers and customers. And being able to show you all the amazing options out there is what we are all about here on the blog.

And when it comes to powerful contact forms, Ninja Forms falls into that category.

Ninja Forms for WordPress

You can find a free version of Ninja Forms on WordPress.org, but I am going to share here three of their add-ons that come with the premium subscriptions or can be purchased separately. I want to include a few in this post because they cover some specific needs you may have at some point.

Ninja Form Dashboard

On installation, there is a Contact Me form. I can use it, edit it or delete it, but I do like the UI of the dashboard listing the forms. Nice and clean.

Ninja Form Settings

As with most form plugins, the general settings are pretty basic:

Creating Your Form in Ninja Forms

I will be sharing just a few of the add-ons, but for an initial look at building your form, let’s walk through the basics.

When you first click to add a new form, you can start with four basic types.

As an example, if we chose Event Registration, we get a form with the suggested fields already set up.

This saves you a ton of time because you can edit these existing fields.

Creating a Form from Scratch

Creating a form without a template is very easy. Here you see all the default fields you can add:

Now it’s just a matter of just clicking on any field to add it to your form, and then reordering the fields via drag-and-drop.

And each field has its own settings. For example, here are the address field settings:

And here, the options for the date field.

Obviously, it would be too much to go through every field setting, but you get the idea of the flexibility you have with each field.

As I looked at these options, one feature of Ninja Forms that caught my eye was the ability to add a help field, which could be very helpful to your readers or visitors.

And on the final form, this is what it looks like:

Once you get that form just the way you want it, you need to set up your email and actions.

Success Message

This is what you use to control the message to the user once the form is submitted.

Admin Email

And the email that will be sent to you and anyone else who needs to get the form submission.

Advanced Settings

There are also a few advanced settings.

Display Settings

Here you can toggle the form title, clear and/or hide completed forms, and add your own custom labels.

Restrictions

These could come in very handy in certain instances where you would want to set a submission limit.

Calculations

Having not used this I was a bit apprehensive because math is not my strong point. But if it is something you are looking for, you might find it useful. But combining this with conditional logic (which I will touch on soon) will give you quite a bit of power.

Previewing Your Form

I have worked with some form plugins that show me a preview in a simple screen. But one thing I liked about preview for Ninja Forms is it shows you the form as it will look on your site.

Inserting a Form Into a Page or Post

You can always add a form using the shortcode, but you can also insert the shortcode using the option in your editor tools.

Then you can choose the form you want to place.

Inserting a Form Into a Widget

And with any widget area in your theme, you can easily add a form there as well.

Ninja Forms Premium – a Powerhouse

As you can see, the basic features in the free version will get you by for a simple contact form. In fact, it could be quite the substantial form with as many fields that come with the free version. But from experience, with myself and with clients and others I have taught over the years, there will likely be a point where you need something more dynamic.

Even if you don’t think that now, once you learn the power of forms, you will find lots of creative and useful ways to use them. And having the add-ons will help you do just that when the time comes.

Several add-ons that come with the premium version let you extend your forms, add payments, and integrate with CRM’s or mail providers, just to name a few. I’d like to share three of them with you here.

Conditional Logic

I’ve more than once touched on the importance of conditional logic. When it comes to contact forms, it’s huge. Conditional logic can essentially streamline a long form.

All it means is this: if you do this one thing, this other thing will happen.

For example, you might have a list of choices. When they select number 1, a new field appears where you ask for more details. When they select option 2, that field does not show, but 3 new ones show up specifically asking for more information that pertains to only that choice.

When you implement this add-on, you get this option in the advanced settings of any form. And by clicking on it you can create a condition for a form.

When creating a condition, you get a screen that looks like this. As an example, I am setting this to happen here. If someone selects Send The Info Via Mail in the checkbox on my form, then the address field will show. Otherwise it will stay hidden.

As you might guess, you can even get more fine-tuned by adding additional conditions to this one. For example, if I also wanted to add a required email fields so I could email them when it is shipping, I would do this:

Conditional logic can also be used for other parts of your form. For example, in your admin email, you can have it process if only a certain condition is met, or a field is filled out for sure.

Conditional logic is a must-have if you are going to create any long forms with fields where all users will not need to fill out every single area.

Layout and Styles

As you see in the above example, all fields are stacked horizontally. You may want to tweak that layout, allowing two fields on the same line, either for the reason of saving space or if a specific field just doesn’t need an entire space across the form. This is where the add-on Layout and Styles comes in.

The layout option is a cool, easy-to-use feature. In this short video, you can see how I created columns and controlled the width with some simple drag-and-drop.

The options for changing the Styles are pretty extensive as well. In the screenshot below, I have opened up the options for the Container Styles and each one of the choices here have the same options for what you can edit. Note that most of the fields are blank and you will need to use a little CSS in order to edit the form. For example, in the font size, you would use something like 16px. Their helpful documentation gives you an example of most of the basic CSS, so no need to worry.

Form Styles

Default Field Styles

Field Type Styles

Error Styles

Date Picker Styles

PDF Form Submissions

Some people prefer getting a pdf that they can read over. This add-on makes it easy to do a couple of things:

Automatically Convert Form Results to PDF

As the admin who gets form submissions sent to you, maybe you would rather get it in a PDF. With this add-on, you simply toggle that option in your email. When you are in your Email and Actions tab, open up your admin email and you will find it:

Download a PDF

The other option is to export a PDF of a submission:

These are just three of the add-ons you can get to extend Ninja Forms. You can get them all by purchasing one of their licenses or you can buy them separately. But as you can see, they cover most of your needs.

If you are looking for one of the top-notch forms plugin for WordPress, I would certainly check out Ninja Forms and get the most out of the forms on your WordPress site. And if you already have the free version installed, check out those add-ons. You just might find something you have been missing with your own forms.