Checkout Without Distraction

Hide the site header and footer on the checkout page.

PHP
/**
 * Snippet Name:     Checkout Without Distraction
 * Snippet Author:   coding-bunny.com
 * Description:      Hide the site header and footer on the checkout page.
 */
 
/* Remove Header on Checkout */
function cb_remove_header_on_checkout() {
    // Check if we're on the checkout page and not on the "order received" endpoint
    if ( is_checkout() && ! is_wc_endpoint_url( 'order-received' ) ) {
        // Output the CSS to hide the header only on the checkout page
        ?>
        <style>
            header {
                display: none; /* Hide the header on checkout page */
            }
        </style>
        <?php
    }
}
add_action( 'wp_head', 'cb_remove_header_on_checkout' );

/* Remove Footer on Checkout */
function cb_remove_footer_from_checkout() {
    // Check if we're on the checkout page and not on the "order received" endpoint
    if ( is_checkout() && ! is_wc_endpoint_url( 'order-received' ) ) {
        // Output the CSS to hide the footer only on the checkout page
        ?>
        <style>
            footer {
                display: none; /* Hide the footer on checkout page */
            }
        </style>
        <?php
    }
}
add_action( 'wp_head', 'cb_remove_footer_from_checkout' );

How To Implement This Solution?

Leave a Reply

Your email address will not be published. Required fields are marked *

My Agile Privacy
This site uses technical and profiling cookies. You can accept, decline or customize cookies by pressing the desired buttons. By closing this policy you will continue without accepting.

Need help?

Choose one of the following options:

Powered by CodingBunny