Add Buy Now Button in WooCommerce Easily

How to Add Buy Now Button in WooCommerce

If you are owner of a WooCommerce store and want to offer a faster checkout, adding a Buy Now button is a good solution. This button skips to go to cart page and takes customers directly to checkout in a single click.

In this tutorial, you’ll learn how to show buy now button only on single product pages. I addressed it to keep hidden at main shop, category, and search pages. Using this setup you will see a wroking buy now button at right side of your add to cart.

Let’s walk through the tutorial — no plugin used. (if you wish to have a plugin to do this we can develop one, get in touch here)

Step 1: Add a Buy Now Button to the Product Page

As i said already the button will appear next of default “Add to Cart” button and redirect the customer directly to checkout page. your customer won’t see buy now at shop page or anywher else without signle product page.

Let’s ahead and add the code below your theme’s functions.php file (better is using the Code Snippets plugin).

add_action('woocommerce_after_add_to_cart_button', 'custom_buy_now_button');

function custom_buy_now_button() {
    global $product;

    echo '<form method="post" action="' . esc_url(wc_get_checkout_url()) . '" style="display:inline;">
        <input type="hidden" name="buy_now_product_id" value="' . esc_attr($product->get_id()) . '">
        <button type="submit" class="button alt" style="margin-left:10px;">Buy Now</button>
    </form>';
}

This code displays a simple button “Buy Now” next of the default WooCommerce Add to Cart button.

Step 2: Handle the Buy Now Button Logic

It’s time to command what will happen when clicked the button. The code below helping you set operation. when button click cart, adds the selected product, and send the customer directly to checkout page.

Add this code to the same file or snippet:

add_action('template_redirect', 'custom_handle_buy_now_action');

function custom_handle_buy_now_action() {
    if (isset($_POST['buy_now_product_id'])) {
        $product_id = absint($_POST['buy_now_product_id']);

        // Clear the cart
        WC()->cart->empty_cart();

        // Add selected product
        WC()->cart->add_to_cart($product_id);

        // Redirect to checkout
        wp_redirect(wc_get_checkout_url());
        exit;
    }
}

Now when a user clicks “Buy Now,” they’ll skip the cart page and go straight to checkout with that one product. don’t worry other product in cart won’t appear or makes problem. smooth checkout allowed for the selected item even variation enabled products.

Step 3: Hide Products from Shop, Category, and Search Pages

If you don’t want to show buy now button everywhere possible just use the code below. without using this code the button will appear store, category page, and other possible woocommerce endpoints.

Paste this snippet in your functions file:

add_action('pre_get_posts', 'hide_all_products_except_single');

function hide_all_products_except_single($query) {
    if (!is_admin() && $query->is_main_query()) {
        if (is_shop() || is_product_category() || is_search() || is_product_tag()) {
            $query->set('post__in', array(0)); // Show no products
        }
    }
}

The above code will declear WooCommerce to return no products for public pages like shop or categories, effectively hiding them from general browsing. i hope you understand this point very clearly. let’s continue next step.

Step 4: Show All Products Only on the Product Page

Now, we will list all available products only on the single product page. This lets users discover other items in your store without seeing a public shop page.

Add this code:

add_action('woocommerce_after_single_product_summary', 'show_all_products_on_single_product_page', 20);

function show_all_products_on_single_product_page() {
    if (is_product()) {
        echo '<div class="all-products-on-single">';
        echo '<h3>Other Available Products</h3>';

        $args = array(
            'post_type'      => 'product',
            'posts_per_page' => -1,
            'post_status'    => 'publish',
            'orderby'        => 'title',
            'order'          => 'ASC',
        );

        $loop = new WP_Query($args);

        if ($loop->have_posts()) {
            echo '<ul class="products columns-4">';
            while ($loop->have_posts()) : $loop->the_post();
                wc_get_template_part('content', 'product');
            endwhile;
            echo '</ul>';
        }

        wp_reset_postdata();
        echo '</div>';
    }
}

This code will display all published products in a grid right under the current product content. It keeps your catalog accessible but only from within a product page.

Optional: Add Custom Styling

If you’d like to adjust how the Buy Now button looks, you can add this CSS to Appearance > Customize > Additional CSS:

form.cart {
  display: flex;
  align-items: center;
}

form.cart .button.alt {
  background-color: #ff6600;
  color: #fff;
  margin-left: 10px;
}
  • Use the Code Snippets plugin if you don’t want to edit PHP files directly.
  • Test everything on a staging site before going live. either you can take your site backup first.
  • This method is ideal for small shops, funnels, or exclusive catalogs.

Now check your store and browse any single product to see update. i hope you have learned how to add Buy Now button functionality in WooCommerce that skip the cart and bring you best user experience. should you have a quesiton in mind? don’t forget to comment below.

Leave a Comment

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

Scroll to Top