Enabling Entry Previews

Want to show users previews of their entries before or after they submit your form? Our Entry Preview field lets you easily add a preview page to any form on your site. Plus, our form confirmations settings enable you to display entry previews in your confirmations, too.

This guide will show you how to use the Entry Preview field and confirmations setting in WPForms.

Step 1 of 2

Try this Form Demo!

Before you dive into the tutorial below, make sure WPForms is installed and activated on your WordPress site. Then you can create a new form or edit an existing one to open the form builder and access the Entry Preview field.

Adding an Entry Preview Field to Your Form

First, you’ll need to add an Entry Preview field to your form. This field is only available with a paid license, so you’ll find it under Fancy Fields in the form builder.

The Entry Preview field in the form builder

Click on Entry Preview or drag and drop it into the preview area to add it to your form.

Adding an Entry Preview field to your form will also automatically add a Page Break field and split your form into multiple pages.

The Entry Preview field with page break in the form builder preview area

Note: For details on the options available for page breaks in WPForms, please see our tutorial on multi-page forms.

The Entry Preview field requires a multi-page form to work, and you cannot remove the Page Break field it adds to your form unless you first remove the Entry Preview field.

In most cases, we recommend placing the entry preview at the end of your form so users will see the preview only after they’ve filled out all of the fields.

Note: Although you can add more fields to your form after the Entry Preview field, it will only display data from preceding form pages.

For example, if you place an Entry Preview field on the second page of a 3-page form, it will only show the user’s input and selections from the fields on the first page of the form.

Customizing Your Entry Preview Field

Next, click on the Entry Preview field in the preview area of the form builder to open its field options.

Here, you can use the Display Preview Notice toggle to show or hide an additional message before the entry preview.

Enabling the Entry Preview field notice

You may also customize the notice that will appear above the entry preview when this form is published on your site.

Editing the preview notice for an Entry Preview field

This field accepts text as well as HTML tags.

Choosing an Entry Preview Style

In the Advanced field options tab, you can select from 4 different styles for your form’s entry preview: Basic, Compact, Table, or Table, Compact.

Choosing an Entry Preview style

All of these options show the same information, just in different layouts.

The Basic Entry Preview Style

The Basic Entry Preview style is a simple list of field labels followed by the user’s input or selections. Here’s an example of how this style appears on the frontend.

The Entry Preview Basic layout

The Compact Entry Preview Style

The Compact style uses text just like the Basic style but places the field labels and the user’s input in separate columns so they take up less space on the page.

The Entry Preview Compact style

Note: Want to learn about more ways to condense your forms? See our tutorial on multi-column layouts.

The Table Entry Preview Style

The Table style displays entries in a table with shaded rows to distinguish the field labels from the user’s input.

The Entry Preview Table style

The Table, Compact Entry Preview Style

And finally, the Table, Compact style places entries in a table with separate columns for the field labels and the user’s input.

The Entry Preview Table, Compact style

Adding Custom CSS to an Entry Preview Field

You may also add custom CSS classes in the CSS Classes field in the advanced field options.

The Entry Preview advanced field options

Note: Want to learn more about using custom CSS classes in WPForms? Check out our guide to adding custom CSS to your forms for more details.

Setting Up Entry Preview Confirmations

You can use entry preview confirmations instead of or in addition to the Entry Preview field.

The Entry Preview field enables users to go back and change their input or selections. This can be useful if you want to let visitors correct mistakes in their entries before submitting your form.

However, there are some situations in which you may want to let users preview their entries without giving them the option to change their input or selections. In these cases, you can use an entry preview confirmation instead.

To do so, go to Settings » Confirmations in the form builder. For any confirmation you’ve created, you can toggle on the Show entry preview after confirmation message option.

Enabling the entry preview confirmation

Note: Need help setting up your form confirmations? Our tutorials on WPForms confirmations settings and creating conditional form confirmations have all the details.

Once this setting is on, a dropdown will appear where you can select which entry preview style you would like to use for this confirmation.

Selecting the entry preview confirmation style

Be sure to save your changes before exiting the form builder. On the frontend, your entry preview confirmation might look something like this.

An example of an entry preview confirmation

That’s it! Now you can let users preview their entries before or after they submit your forms.

Next, want to learn how to manage users’ entries? Check out our complete guide to entries in WPForms for all the details.