WordPress forms are powerful tools for collecting information from your website visitors. Whether it’s contact details, survey responses, or application submissions, forms are essential for interaction and data gathering. But what happens after someone submits a form? Often, you need to display this collected data on your website, either for internal review, public access (with proper privacy considerations), or to confirm successful submissions to users. This article will guide you through two primary methods of displaying WordPress form entries directly on your site. We’ll cover using plugins specifically designed for this purpose, as well as a more advanced, code-based approach using custom post types and templates.
The easiest and often most efficient way to display form entries is by utilizing dedicated WordPress plugins. Numerous plugins are available that simplify the process, allowing you to showcase data without writing any code. Here’s a breakdown of the general process and some popular plugin options.
Regardless of the specific plugin you choose, the general workflow typically involves these steps:
Here are a few well-regarded plugins that can help you display your form entries:
Let’s look at a simplified example of how to use Formidable Forms to display form entries:
Pros:
Cons:
For more advanced users or those requiring highly customized displays, creating a custom post type and template is a powerful option. This approach provides complete control over how form entries are stored and displayed. However, it requires coding knowledge and a good understanding of WordPress development.
The core idea is to:
1. Create a Custom Post Type.
You can register a custom post type using the `register_post_type()` function in your theme’s `functions.php` file or a custom plugin.
“`php
function create_form_submission_post_type() {
$labels = array(
‘name’ => ‘Form Submissions’,
‘singular_name’ => ‘Form Submission’,
‘menu_name’ => ‘Form Submissions’,
‘name_admin_bar’ => ‘Form Submission’,
‘add_new’ => ‘Add New’,
‘add_new_item’ => ‘Add New Form Submission’,
‘new_item’ => ‘New Form Submission’,
‘edit_item’ => ‘Edit Form Submission’,
‘view_item’ => ‘View Form Submission’,
‘all_items’ => ‘All Form Submissions’,
‘search_items’ => ‘Search Form Submissions’,
‘parent_item_colon’ => ‘Parent Form Submissions:’,
‘not_found’ => ‘No form submissions found.’,
‘not_found_in_trash’ => ‘No form submissions found in Trash.’,
);
$args = array(
‘labels’ => $labels,
‘public’ => false, // Make it private if needed.
‘publicly_queryable’ => false,
‘show_ui’ => true,
‘show_in_menu’ => true,
‘query_var’ => true,
‘rewrite’ => array( ‘slug’ => ‘form-submission’ ),
‘capability_type’ => ‘post’,
‘has_archive’ => false,
‘hierarchical’ => false,
‘menu_position’ => null,
‘supports’ => array( ‘title’ ), // You can add ‘editor’ if you want a content editor.
);
register_post_type( ‘form_submission’, $args );
}
add_action( ‘init’, ‘create_form_submission_post_type’ );
“`
This code registers a custom post type called `form_submission`. Note that `public` and `publicly_queryable` are set to `false` as this example assumes you want to display the entries through a custom template, not directly through standard WordPress archives. Set them to true if you want entries to behave like standard posts.
2. Capture Form Data and Create a Custom Post.
You need to hook into the form submission process of your chosen form plugin and create a new custom post type entry with the submitted data. The specifics of this depend on the form plugin you are using.
For example, using Gravity Forms, you could use the `gform_after_submission` hook:
“`php
add_action( ‘gform_after_submission’, ‘create_form_submission_post’, 10, 2 );
function create_form_submission_post( $entry, $form ) {
$post_title = ‘Form Submission – ‘ . date(‘Y-m-d H:i:s’); // Or a more meaningful title
$post_id = wp_insert_post( array(
‘post_title’ => $post_title,
‘post_type’ => ‘form_submission’,
‘post_status’ => ‘publish’,
) );
if ( ! is_wp_error( $post_id ) ) {
// Loop through the form fields and save them as custom fields.
foreach ( $form[‘fields’] as $field ) {
$field_id = $field->id;
$field_value = rgar( $entry, $field_id ); // Gravity Forms function to get the value.
update_post_meta( $post_id, ‘form_field_’ . $field_id, $field_value );
}
}
}
“`
This code snippet listens for Gravity Forms submissions and creates a new `form_submission` post for each submission. It then iterates through the submitted form fields and saves each field’s value as post meta (custom fields) associated with the newly created post. The meta keys are prefixed with `form_field_` followed by the field ID.
Important: Replace `rgar` with the appropriate function to retrieve the form data based on the specific form plugin you are using. Refer to your form plugin’s documentation. Also, sanitize and validate the form data before saving it to the database to prevent security vulnerabilities.
3. Create a Custom Template.
Create a template file (e.g., `single-form_submission.php`) in your theme’s directory. This template will be used to display individual form submissions. If you are just creating a page to show the entries, you can create a custom template for a page, and just list the entries rather than show one in detail.
“`php
‘;
}
if ( $email ) {
echo ‘
Email: ‘ . esc_html( $email ) . ‘
‘;
}
if ( $message ) {
echo ‘
Message: ‘ . esc_html( $message ) . ‘
‘;
}
?>
Remember to replace the `’form_field_1’`, `’form_field_2’`, and `’form_field_3’` keys with the actual meta keys you used when saving the form data. Also, always escape the output using `esc_html()` to prevent cross-site scripting (XSS) vulnerabilities.
4. Displaying a List of Entries.
To show a list of all form submissions on a page, you can create a custom page template or modify an existing one. Use the `WP_Query` class to retrieve the `form_submission` posts:
“`php
‘form_submission’,
‘posts_per_page’ => -1, // Show all submissions
);
$the_query = new WP_Query( $args );
if ( $the_query->have_posts() ) {
echo ‘
echo ‘
‘;
}
echo ‘
‘;
wp_reset_postdata();
} else {
echo ‘
No form submissions found.
‘;
}
?>
Pros and Cons of Using Custom Post Types and Templates
Pros:
Cons:
