How to Display Custom Post Type as a Dropdown Field in Contact Form 7

When using WordPress custom post types for website development, there are instances where you might want to dynamically display a list of custom post type titles within Contact Form 7 forms, such as contact forms, order forms, or other types of forms, allowing users to make selections.

In this guide, we will achieve this without using additional plugins. We’ll demonstrate how to display a list of custom post type titles in a dropdown format using the SELECT (select box) element within Contact Form 7.

To implement this, you’ll need to modify specific areas, such as Contact Form 7’s unique form tag names and the post type slug, and then insert the following code into your functions.php file.

function dynamic_field_values($tag, $unused) {
    if ($tag['name'] != 'your-form-tag-name')  // Field name within Contact Form 7 (your custom form tag name)
        return $tag;
    $args = array(
        'posts_per_page' => -1, // Retrieve all (specify a number for limitations if needed)
        'post_type'      => 'your_custom_post_type', // Custom post type name (post type slug)
        'orderby'        => 'title', // Sort by title
        'order'          => 'ASC', // Ascending order
    );
    $custom_posts = get_posts($args);
    if (!$custom_posts)
        return $tag;
    foreach ($custom_posts as $custom_post) {
        $tag['raw_values'][] = $custom_post->post_title;
        $tag['values'][] = $custom_post->post_title;
        $tag['labels'][] = $custom_post->post_title;
    }
    return $tag;
}
add_filter('wpcf7_form_tag', 'dynamic_field_values', 30, 2);

Next, insert the custom form tag where you want users to make their selections within Contact Form 7.

[select your-form-tag-name]

That’s it!

AEDI is based in Kurashiki, Okayama, and offers services such as web and development, WordPress development, multilingual website development, SEO, UI/UX design, graphic design for logos, flyers, posters, brochures, and catalogs, motion design and motion graphics, character design, and brand design and branding. Our job is not limited to merely creating websites or designing logos; we work from the perspective of brand design and branding to bring out the value of our client’s services and products and promote new value to the world.

If you are a client in Okayama, Kurashiki, or anywhere else considering website creation and design, please feel free to contact us. Let’s work together to create exciting and outstanding products!

References:

WordPress – Contact Form 7 and Custom post type – Stack Overflow

Contact Form 7 Documentation: Adding a Custom Form Tag