Add how did you hear about us? select field to checkout block in WooCommerce

This PHP code adds a ‘how did you hear about us?‘ select field to your WooCommerce checkout page. However, it only works if using the new checkout blocks not when using the woocommerce_checkout shortcode.

add_action(
	'woocommerce_init',
	function() {
		woocommerce_register_additional_checkout_field(
			array(
				'id'          => 'wpsites/how-did-you-hear-about-us',
				'label'       => 'How did you hear about us?',
				'placeholder' => 'Select a source',
				'location'    => 'order',
				'type'        => 'select',
				'options'     => [
					[
						'value' => 'google',
						'label' => 'Google'
					],
					[
						'value' => 'facebook',
						'label' => 'Facebook'
					],
					[
						'value' => 'friend',
						'label' => 'From a friend'
					],
					[
						'value' => 'forums',
						'label' => 'From a forum suggestion'
					],
					[
						'value' => 'other',
						'label' => 'Other'
					],
				]
			)
		);
	}
);

Add the code to the end of your child themes functions file or custom code snippets plugin.

Here is what you get :

Modification

You can modify the values for each parameter in the code like this :

= Modify Label =

'label' => 'How did you hear about us?',

= Modify Placeholder =

'placeholder' => 'Select a source',

= Modify Location =

Locations include :

• contact
• address
• order

'location'    => 'order',

Fields for the address location appear with both billing and shipping within the address block.

= Modify Type =

Types include :

• checkbox
• select
• text

'type'        => 'select',

= Modify Options =

Modify options or add more options to your select drop down menu

'value' => 'other',					'label' => 'Other'

Add a unique value and label for each additional option.

Related Solutions :

• Conditional Fields For Contact Block Using Block Checkout
• Checkout Block Conditional File Upload Based on Payment Option For WooCommerce
• Image Upload For WooCommerce Checkout Page Block
• Custom Order Summary Text for WooCommerce Block Checkout
• Custom Fields for WooCommerce Checkout Blocks
• Add Conditional Field to Order Information Block Using Block Checkout
• Add Field To WooCommerce Checkout Block Address Location Conditionally