WooCommerce Checkout Page Hooks: Visual Guide + Full List

This article was last manually reviewed for data accuracy on 16 November 2025.

The WooCommerce checkout page is one of the most crucial parts of any WooCommerce store, serving as the final step before purchase completion. Customizing this page allows store owners and developers to improve user experience, streamline the process, and optimize conversions.

WooCommerce provides numerous action and filter hooks throughout the checkout page template to customize it. This visual hook guide and complete list of WooCommerce checkout page hook will serve a ready reference.

Note: The hooks listed in this visual guide are all classic hooks tied to PHP templates. They are available only on classic checkout pages using the [woocommerce_checkout] shortcode or via the standard WooCommerce checkout endpoint. The modern Block page supports different hooks which is listed separately.

Visual Guide: WooCommerce CheckOut Page Hooks

Complete List of WooCommerce Checkout Page Action Hooks

Essential List of WooCommerce Checkout Page Filters

Code Examples: Actions vs. Filters in WooCommerce Checkout Page

Deep Dive: For a comprehensive understanding of WooCommerce Filter and Hooks refer to WooCommerce Hooks and Filters: Complete Guide with Examples.

WooCommerce Checkout Page Action Hook Example : Add Custom VAT Number field

In this example we will use woocommerce_before_checkout_billing_form ro sdd a custom “VAT Number” field before the billing form.

php

/**
 * Add a custom VAT Number field before billing form.
 */

function able_rabbit_add_vat_field_before_billing() {
    echo '<div class="custom-vat-field">';
    woocommerce_form_field( 'billing_vat_number', array(
        'type'        => 'text',
        'label'       => __('VAT Number', 'able-rabbit'),
        'placeholder' => __('Enter your VAT number', 'able-rabbit'),
        'required'    => false,
    ), WC()->checkout->get_value( 'billing_vat_number' ) );
    echo '</div>';
}

add_action( 'woocommerce_before_checkout_billing_form', 'able_rabbit_add_vat_field_before_billing' );

Explanation:

• This hook fires right before the billing fields start.
• You can inject custom fields, notices, or markup.
• Here we add a VAT Number field using woocommerce_form_field().

WooCommerce Checkout Page Filter Hook Example : Make the phone number field optional

In this example we will use woocommerce_checkout_fields filter to make the phone number field optional.

php

/**
 * Make phone number optional at checkout.
 *
 * @param array $fields Checkout fields array.
 * @return array Modified fields.
 */

function able_rabbit_optional_phone_field( $fields ) {
    if ( isset( $fields['billing']['billing_phone'] ) ) {
        $fields['billing']['billing_phone']['required'] = false;
    }
    return $fields;
}

add_filter( 'woocommerce_checkout_fields', 'able_rabbit_optional_phone_field' );

Explanation:

• This filter gives full control over checkout fields.
• You can add, remove, or modify field properties (label, placeholder, required, etc.).
• In this example, the phone field is made optional.

Summary: Mastering WooCommerce Checkout Page Customization

Understanding WooCommerce checkout page hooks unlocks powerful flexibility to customize your store’s checkout process. By using the provided action and filter hooks, you can add unique content, modify form behavior, adjust order review displays, and integrate with payment sections seamlessly.

With this visual guide, developers and site owners can implement precise, upgrade-safe customizations that improve both aesthetics and functionality, ultimately delivering a better shopping experience and driving higher conversion rates.

FAQs: WooCommerce Checkout Page Hooks

What are checkout page hooks in WooCommerce?

Checkout page hooks are predefined locations in the WooCommerce checkout template where you can add or modify content using custom code. They include action hooks to insert content and filter hooks to change existing data, helping customize the checkout experience without editing core files.

How do I use action hooks on the WooCommerce checkout page?

Action hooks let you insert custom content or execute code at specific points, such as before the checkout form (woocommerce_before_checkout_form), around billing and shipping sections, or after the order review. You attach your PHP function to these hooks using add_action() and define your custom logic.

What kind of customizations can filter hooks perform on the checkout page?

Filter hooks allow you to modify existing checkout data like form fields (woocommerce_checkout_fields), cart item display (woocommerce_checkout_cart_item_price), and order meta before saving. Filters are essential for adjusting labels, placeholders, item details, or visibility dynamically.

Are checkout hooks safe to use for customization?

Yes, since hooks allow customizations without modifying WooCommerce core files, they are upgrade-safe and best practice for extending WooCommerce functionality. Properly used hooks ensure your custom code remains functional through WooCommerce updates.

Where can I find a complete list of WooCommerce checkout hooks?

Complete and updated lists of checkout page hooks are available in WooCommerce developer documentation.

PRO Tip: Bookmark all our Visual WooCommerce Hook Guides for ready reference.