December 12, 2023

Show or Hide Checkout Fields in WooCommerce with Code Snippets

Play Video

To show or hide Checkout Fields in WooCommerce can greatly enhance the user experience on your e-commerce site. Sometimes, less is more, especially when it comes to the checkout process. In this tutorial, we’ll explore how to hide checkout fields in WooCommerce using a simple code snippet, making your checkout cleaner and more user-friendly.


Please make sure you have the following installed and activated:

Benefits of Hiding WooCommerce Checkout Fields

Hiding unnecessary checkout fields in WooCommerce can streamline the purchasing process, offering numerous benefits for both the store owner and customers:

  • Faster Checkout
    Removing irrelevant fields reduces the time customers spend filling out forms, leading to a quicker checkout experience.
  • Increased Conversion Rates
    A simplified checkout process can lower cart abandonment rates. Customers are more likely to complete a purchase when they encounter fewer obstacles.
  • Enhanced User Experience
    A clean, uncluttered checkout page improves user experience. This can boost customer satisfaction and encourage repeat business.
  • Reduced Customer Confusion
    Eliminating unnecessary fields helps to prevent confusion, particularly for digital or service-based products where shipping information might be irrelevant.
  • Customization to Suit Business Needs
    By hiding certain fields, you can tailor the checkout process to fit the specific needs of your business and your customers. For example, if you’re selling digital products, you might not need shipping details.
  • Data Efficiency
    Collecting only essential information makes data management more straightforward and efficient. It can also aid in compliance with data protection regulations by not storing unnecessary customer data.

Instructions to Show or Hide Checkout Fields in WooCommerce

  1. Navigate to Code Snippets > Add New to create a new snippet.
  2. Enter a title for your snippet, like “Deactivate Woo Checkout Fields”.
    Enter a title for your snippet, like "Hide Checkout Fields"
  3. Paste the code snippet provided below into the code box:
     * Plugin Name: Checkout Fields Customizer
     * Author: Mark Harris & His AI Friends
     * Author URI:
     * Description: This plugin allows customization of WooCommerce checkout fields directly from the WordPress admin area. It introduces a submenu under the WooCommerce menu for managing the visibility of checkout fields. The plugin offers the following functionalities:
     * 1. Admin Menu Integration: Adds a new submenu under 'WooCommerce' for 'Checkout Fields'. This submenu provides an interface to manage the checkout fields.
     * 2. Settings Registration: Registers settings for the 'Checkout Fields' options, allowing administrators to configure which fields to display at checkout.
     * 3. Settings Sanitization: Ensures all input data is sanitized before being saved, maintaining the security and integrity of the data.
     * 4. Dynamic Settings Page: Generates a dynamic settings page in the WordPress admin, listing all available checkout fields with checkboxes to enable or disable them.
     * 5. Checkout Fields Customization: Based on the saved settings, modifies the checkout fields on the front-end, hiding or showing them as configured.
     * 6. Admin-Area Exclusion: Ensures that the checkout fields remain unchanged in the admin area, applying changes only on the front-end.
     * Note: This plugin requires WooCommerce to be installed and activated as it directly interacts with WooCommerce's checkout fields.
    // Register the sub-menu under WooCommerce menu
    add_action("admin_menu", "wpturbo_register_submenu_page");
    function wpturbo_register_submenu_page()
            "Checkout Fields",
            "Checkout Fields",
    // Register settings
    add_action("admin_init", "wpturbo_register_settings");
    function wpturbo_register_settings()
    // Sanitize the input before saving
    function wpturbo_checkout_fields_sanitize($input)
        // Ensure all expected options are present in the array by checking against the default fields
        $fields = WC()
        $new_input = [];
        foreach ($fields as $section => $field_group) {
            foreach ($field_group as $key => $field) {
                // If the key exists in our submitted input, use that value, otherwise, this field is not hidden
                $new_input[$key] = isset($input[$key]) ? "1" : "0";
        return $new_input;
    // The settings page content
    function wpturbo_checkout_fields_options_page()
        if (!current_user_can("manage_options")) {
        if (isset($_GET["settings-updated"])) {
                __("Settings Saved", "wpturbo"),
        $options = get_option("wpturbo_checkout_fields_options", []);
        <div class="wrap">
            <h1><?php esc_html_e("Checkout Fields", "wpturbo"); ?></h1>
            <form action="options.php" method="post">
                $fields = WC()
                // Inline CSS for styling the settings page
                echo '<style>
                    .wpturbo-checkout-fields-wrapper {
                        background-color: #f7f7f7;
                        padding: 20px;
                        border-radius: 5px;
                        box-shadow: 0 1px 3px rgba(0,0,0,0.1);
                    .wpturbo-checkout-fields-wrapper h2 {
                        color: #333;
                        border-bottom: 1px solid #ddd;
                        padding-bottom: 5px;
                    .wpturbo-checkout-fields-wrapper label {
                        display: block;
                        margin: 10px 0;
                        line-height: 1.6;
                    .wpturbo-checkout-fields-wrapper input[type="checkbox"] {
                        margin-right: 10px;
                    .form-table th {
                        width: auto;
                        padding-right: 20px;
                echo '<div class="wpturbo-checkout-fields-wrapper">';
                foreach ($fields as $section => $field_group) {
                    // Skip the account fields section
                    if ($section === "account") {
                    echo "<h2>" . ucfirst($section) . " Fields</h2>";
                    foreach ($field_group as $key => $field) {
                        // The checkbox is checked if the option is set to "1", meaning the field is disabled.
                        $is_disabled =
                            isset($options[$key]) && $options[$key] === "1";
                        $checked = checked($is_disabled, true, false);
                        echo "<label>";
                        echo '<input type="checkbox" name="wpturbo_checkout_fields_options[' .
                            esc_attr($key) .
                            ']" ' .
                            $checked .
                        echo esc_html($field["label"]);
                        echo "</label>";
                echo "</div>";
    // Override checkout fields based on saved options
    function wpturbo_custom_override_checkout_fields($fields)
        if (is_admin()) {
            // If we are in the admin area, do not modify the fields
            return $fields;
        $options = get_option("wpturbo_checkout_fields_options", []);
        foreach ($fields as $section => $field_group) {
            foreach ($field_group as $key => $field) {
                // If the option is set to "1", the field should be unset (hidden) on the front-end.
                if (!empty($options[$key])) {
        return $fields;

    Source: Code Snippets Cloud

  4. Save changes and activate the snippet.
  5. Navigate to WooCommerce > Checkout Fields to include or exclude fields as per your requirement. (For instance, removing billing or shipping fields).
    Navigate to WooCommerce > Checkout Fields to include or exclude fields

    Note: Checking them means you exclude the fields from the front-end.

  6. Test the checkout page to ensure the desired fields are hidden or shown.
    Test the checkout page to ensure the desired fields are hidden or shown

Official Documentation

Show or Hide Checkout Fields in WooCommerce – Conclusion

Customizing WooCommerce checkout fields can streamline the shopping process, enhancing customer satisfaction and potentially boosting sales. By using the Code Snippets plugin, even non-technical users can make these changes easily. Remember, a simplified checkout can lead to a better shopping experience for your customers.

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.
Show or Hide Checkout Fields in WooCommerce with Code Snippets
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.