Disable Autofocus at Checkout Field in WooCommerce

How to Disable Autofocus at Checkout Field in WooCommerce?

Are you looking for a way to Disable Autofocus at Checkout Field in WooCommerce?

By Default, WooCommerce has an autofocus action to the Billing First Name field at checkout or in some cases to an email address if that is the first field on your checkout page.

This means when you load the checkout page and your billing first name field is empty, it will shift the page down to focus on that field.

This behavior can be very annoying sometimes, especially if you want users to start from the top of the checkout page so they don’t experience anything unusual.

Okay, Enough talking

Disable Autofocus at Checkout Field in WooCommerce

You need to use the snippet below in order to disable the autofocus on checkout field:

/* Disable autofocus at checkout */
function wpglorify_disable_autofocus_firstname( $fields ) {
	$fields['billing']['billing_first_name']['autofocus'] = false;

	return $fields;
}

add_filter( 'woocommerce_checkout_fields', 'wpglorify_disable_autofocus_firstname' );

How to Add PHP Code

The Code Snippets plugin makes it very easy to not just add PHP snippets to your website but also manage all the snippets you add.

You can activate and deactivate certain snippets, and even adds notes about what they do. It even has better error handling to avoid the PHP error scenarios.

To install it, simply go to Plugins » Add New and search for Code Snippets.

The traditional or normal way to add PHP snippets to your theme is to add directly to your theme’s functions.php file. Which you can find in the WordPress Dashboard » Appearance » Theme Editor.

However, make sure you are using a child theme otherwise you will lose all changes once you update your theme.

Have any question? Don’t forget to leave a comment below.

2 Comments

  1. Hi, we actually don’t find that Woo autofocuses on first name. Instead, we find that it jumps to the email field. Do you have a snippet that would work for this?

    Currently, we’re just having it scroll back up with an anchor, but would like to get rid of this annoying “focus” entirely.

    Thanks!

    • Hi Lucas, You can try changing 3rd line in above code snippet to this

      $fields['billing']['billing_email']['autofocus'] = false;

Leave a Reply