How To Create A Ninja Form In Wordpress

Introduction

Building A Form

Creating the Form

In your WordPress dashboard, click "Add New" under the "Ninja Forms" menu. (You can also click "Add New Form" on your "All Forms" page.)

Using a Template

When you create a new form, you will be presented with several template options. Click one to automatically apply fields (and styling!) to your form.

image of template selection options in the ninja forms dashboard

Building from Scratch

Adding Fields

To add your own fields, choose the "Blank Form" template and use the blue "Add Field" button in the bottom right to open the fields drawer.

Single-click or drag the fields from the drawer into the builder.

When you have finished adding fields, click "Done".

Editing Field Settings

To change the field label, label placement, force a field to be required and more, simply click on the field to open its settings drawer. You may also click the blue gear icon to open the field settings drawer. This drawer is different for each field type. For a detailed breakdown of field types, see the documentation here.

Duplicating or Deleting Fields

Hover over the blue gear icon in each field to expand the duplicate and delete icons.

Preview the Form

Preview any form changes without impacting users on the front end of your site with the preview button here:

Publish the Form

Once you are ready to push your form changes live to the front end of your site, click "Publish."

Adding the Form to your Page or Post, or Creating a Public Link

Method 1: "Add Form" Block

WordPress versions 5.0 and higher

With the introduction of Gutenberg, you now have the ability to add a form to your Page or Post using a Ninja Forms Block.

While editing the page or post, click the block icon and search for 'Ninja Form'

Ninja Form Block

When you click the "Ninja Form" block, a dropdown will appear where you can select your desired form.

Ninja Form dropdown

Once you select a form, the block will refresh, inserting it within the page/post.

Method 2: Form Shortcodes

On the Ninja Forms Dashboard, note that each of your Ninja Forms have a unique shortcode.

Within your page or post editor, you can insert the shortcode of your Ninja Form in order to embed it within your page or post.

Method 3: Append a Ninja Form

While editing your post or page, in the sidebar on the right side of the editor, there is also an option to "Append a Ninja Form". Choose your Ninja Form from the dropdown menu to have your form appear at the end of the page or post.

Method 4: Create a Public Link

Instead of embedding your form onto a post or page on your site, you may prefer to have users access it directly by using a link. You can do this by clicking the link icon next to the Publish button:

In the window that slides open, toggle ALLOW A PUBLIC LINK to on (green), and then copy the URL from the field below it. This URL can be shared and will allow anyone with the link to access the form directly.

Tips and Tricks

Save a Field to Reuse Later

To save all field settings including label, list values, styling classes, and more to reuse later, click the "star" icon in the field settings drawer. That will add a copy of your field to the "Add Field" drawer to be added to the current form (or even a different form) at a later time.

The field appears in the "Add Field" drawer: