I was approached by a client recently who wanted a solution to display captured data on their website in the kind of way you’d need to do if you were creating an online petition and wanted to display signatories. In this case the client is creating a pledge form and simply wanted to create a page that lists the names of the pledgers, their age, city, state and country.
I googled around to find a solution and in the course of all of that I discovered that we could use Gravity Forms to create Custom Post Type entries (with a handy dandy plugin) . In its simplest setting, you create a form on your page and map the form so that it creates the post entries that we can then display in an archive template which regurgitates the relevant data and displays it in a list. It seems like the kind of thing other people might be interested in doing as well… here’s how I pulled it off.
What you’ll need:
WordPress
Gravity Forms
Gravity Forms + Custom Post Types plugin – get it here.
Having installed the plugins and activated them, first you actually have to create your custom post type. I create all my custom post types using this code snippet (embarrassed to admit, I don’t know where I found it) – it’s a really easy generic way to do it… all I have to change at any time is the variables for each $type.
[php]
// ADDING CUSTOM POST TYPE
add_action(‘init’, ‘all_custom_post_types’);
function all_custom_post_types() {
$types = array(
// Pledge Items
array(‘the_type’ => ‘pledge’,
‘single’ => ‘Pledge’,
‘plural’ => ‘Pledges’));
foreach ($types as $type) {
$the_type = $type['the_type'];
$single = $type['single'];
$plural = $type['plural'];
$labels = array(
‘name’ => _x($plural, ‘post type general name’),
‘singular_name’ => _x($single, ‘post type singular name’),
‘add_new’ => _x(‘Add New’, $single),
‘add_new_item’ => __(‘Add New ‘. $single),
‘edit_item’ => __(‘Edit ‘.$single),
‘new_item’ => __(‘New ‘.$single),
‘view_item’ => __(‘View ‘.$single),
‘search_items’ => __(‘Search ‘.$plural),
‘not_found’ => __(‘No ‘.$plural.’ found’),
‘not_found_in_trash’ => __(‘No ‘.$plural.’ found in Trash’),
‘parent_item_colon’ => ”
);
$args = array(
‘labels’ => $labels,
‘public’ => true,
‘has_archive’ => true,
‘publicly_queryable’ => true,
‘show_ui’ => true,
‘query_var’ => true,
‘rewrite’ => true,
‘capability_type’ => ‘post’,
‘hierarchical’ => false,
‘menu_position’ => 5,
‘supports’ => array(‘title’,'editor’,'thumbnail’,'custom-fields’,'excerpt’)
);
register_post_type($the_type, $args);
}
}
[/php]
The next step is to create a form. Easy done with Gravity Forms.
Choose Forms from the Dashboard Menu, and predictably, create a new form. This will automatically add the Form Settings field into the form editing window. For this pledge form we pasted the text of the pledge (in HTML format) into the description section of the Form Settings Properties and in the Advanced section selected the Anti Spam Honey pot, to save us having to use a Captcha field.
The plugin also creates a new list of form options in the right hand column. The one that’s relevant to our interests in this case, is the Post Fields.
So we need to add a Title from this list of Post Fields. I actually called it Name in this case, because that’s the primary information being captured.
This will in fact, be the title of our Custom Post and calling it Name actually directs the site user to add in the correct data.
For the settings, select the relevant status (Published/Pending Review/Draft) for the ‘Post Status’ field and then the ‘Default Post Author’
Click the advanced tab, and in that section chose the post type you want the form to map to from the drop down menu.
We then need to create our other fields for the form, and map them to custom fields from the Post Fields menu.
So, click on the Custom Field button in the Post Fields box and then edit the details in that field as follows – because I hadn’t already created the custom fileds for the post types I allowed Gravity to create them, so selected New – if you already have custom fields then chose existing field and name them in the same way as your existing custom fields.
Repeat this for all of the fields you want to display. In our case we did Age, City, State, Country. Save the form.
So now we have the infrastructure we just need to create the pages to display the form and the template to display these custom post types.
I’m confident I don’t need to show you how to create a page and add in a form… Gravity makes that all incredibly easy. But we do need to create a template for our archive page… so let’s just touch on that quickly…
I’m not needing a single post-type template, so we’re only displaying an archive. I created a archive-pledge.php file, coded it up in the theme of the site and added the following code to display the loop of pledges.
[php]
<div class="block">
<ol reversed="reversed" class="pledge-item">
<?php
$args = array( ‘post_type’ => ‘pledge’, ‘posts_per_page’ => 100 );
$loop = new WP_Query( $args );
while ( $loop->have_posts() ) : $loop->the_post();
/* with sprintf() you make a "pattern" first using %s and some other possible symbols then you define them with php functions/variables */
printf( ‘<li>%s, %s, %s, %s, %s</li>’,
get_the_title(),
get_post_meta($post->ID, ‘age’, true),
get_post_meta($post->ID, ‘city’, true),
get_post_meta($post->ID, ‘state’, true),
get_post_meta($post->ID, ‘country’, true)
);
endwhile;
?>
</ol>
</div>
<!–end block–>
[/php]
If you’re interested in the finished product, you can see the pledge form here http://menofhonour.com and the finished Pledge Honour Roll, here http://oxygenfactory.com.au/pledge/






Great post! I was wondering what would be a straightforward way to display user generated content. I will have a play with this.
I just discovered this power combo a few weeks ago. I’m also using it along with the WP-Types plugin, which is just a quickie plugin for creating CPTs, taxonomies, and related custom fields.
Thanks for the writeup – I’d be interested to see other scenarios where you’re using it.
I have been looking everywhere for this!! Thanks so much. I’m a super noob at PHP….is there any way you could guide me toward setting this info up as a table rather than a list? What would the template look like for that? Can’t wait to play around with this! Thanks again.
Hi Danielle, don’t let PHP freak you out, it’s just HTML with extras…
So, to do what you want there’s no need at all to do much PHP, just switch out the list code for table code and tweak the pattern to include the cell data, assuming you want each item in a different cell. Have a look here, I suspect this is what your code should look like, though I’ve not tested it at all… http://pastie.org/5178288
I cannot even begin to tell you how much I appreciate this!!!
Seriously, I have been pulling my hair out over this for days…I knew it was something simple, I just couldn’t quite get the syntax right. I am going to give it a shot tonight and see what it looks like.
Thank you so, so much!!!
Great post! Thank you for this tutorial.
However, I have a question. Do I have to map all the form fields to custom fields?
What if I want to display submitted value of the form fields which are not custom field. I guess I can not retrieve it using get_post_meta query, right?
If I need to map all the fields to custom fields, can I do it to a drop-down or radio field too?
Thank you very much. Your help is so much appreciated