May 30, 2023

How to add a WooCommerce checkout Dropdown Question

Play Video

What is the tutorial about?

Discover how to add a dropdown question to the WooCommerce checkout process using a free Code Snippet. This is a fantastic way to gather valuable customer insights, such as how they discovered your store or products. The tutorial by Web Squadron is straightforward and doesn’t require any advanced coding skills, making it perfect for WordPress users of all levels.

Tutorial Steps

  1. Install the Code Snippets plugin:
    Navigate to your WordPress dashboard, click on ‘Plugins’, then ‘Add New’. In the search bar, type in ‘Code Snippets’. Install and activate the plugin.
  2. Add a new snippet:
    Once the plugin is activated, go back to your WordPress dashboard and click on ‘Snippets’, then ‘Add New’. Give your new snippet a title.
  3. Copy the code:
     * Snippet Name:	WooCommerce Checkout How Did You Hear About Us
     * Snippet Author:
    // Create the custom select field in the billing section of the checkout form
    add_action( 'woocommerce_after_checkout_billing_form', 'ecommercehints_checkout_select_field' );
    function ecommercehints_checkout_select_field($checkout) {
                'type'		=> 'select',
                'required'	=> true, // Shows an asterisk if true (*)
                'label'		=> 'How Did You Hear About Us?',
                'options'	=> array(
                    ''			=> 'Please select...',
                    'word-of-mouth'		=> 'Word of mouth',
                    'google-search'		=> 'Google Search',
                    'social-media'		=> 'Social Media',
                    'ecommercehints'	=> ''
            ( isset($_POST['how_did_you_hear']) ? $_POST['how_did_you_hear'] : '' )
    // Show an error message of field is not populated 
    add_action('woocommerce_checkout_process', 'ecommercehints_custom_checkout_select_field_validation');
    function ecommercehints_custom_checkout_select_field_validation() {
            if (empty( $_POST['how_did_you_hear'] ) ) {
                wc_add_notice( 'We would really like to know how you heard about us.', 'error' );
    // Save the custom field data as order meta
    add_action( 'woocommerce_checkout_update_order_meta', 'ecommercehints_save_custom_checkout_select_field' );
    function ecommercehints_save_custom_checkout_select_field( $order_id ){
        if( !empty( $_POST['how_did_you_hear'] ) ) {
            update_post_meta( $order_id, 'how_did_you_hear', sanitize_text_field( $_POST['how_did_you_hear'] ) );

    Source: Code Snippets

  4. Paste and modify the code:
    Paste the copied code into the new snippet you created. Make any necessary changes, such as adding new options to the dropdown menu. Remember to follow the syntax provided.
  5. Save and activate:
    Click ‘Save Changes’ and then ‘Activate’.
  6. Check your checkout page:
    Navigate to your checkout page. You should now see a new dropdown menu where customers can select an option that best describes how they found your store or products.

Use Cases for this Tutorial

  • E-commerce stores:
    Understand how customers are finding your products to optimize marketing strategies.
  • Subscription services:
    Gain insights into which marketing channels are most effective for attracting new subscribers.
  • Digital product sellers:
    Learn more about your customers’ journey to improve the user experience and increase conversions.

Required Resources

WooCommerce Logo
Free Options
Code Snippets Logo
Free Options
Credit to Web Squadron
Web Squadron is a popular YouTube channel dedicated to providing informative tutorials, tips, and insights on web development and design. With a strong focus on WordPress and website builders like Bricks Builder, the channel aims to help users of all skill levels, from beginners to advanced developers, create and optimize their websites. By offering easy-to-understand, step-by-step guidance, Web Squadron provides practical and valuable content.
How to add a WooCommerce checkout Dropdown Question
Welcome back!
Enter your Helwp credentials to sign in.

No Account yet? Sign Up

My Account
Give Feedback
Describe your feedback *
Rate Helwp
Problem *
Describe the problem
Want us to reply?
Your E-Mail
Affiliate Disclosure

At Helwp, we’re committed to transparency and honesty. Therefore, we want to inform you that some of the links on our website are affiliate links. This means that, at no additional cost to you, we may earn a small commission if you click through and make a purchase.

We only promote products or services that we genuinely believe in. These affiliate commissions help us to maintain the website and continue to provide you with free, high-quality WordPress content.

If you are interested in how you can support us even further, check out our support page.