WPSlash

Add Price on Add To Cart Button

Wednesday March 31, 2021

The following snippet will copy the price automatically and add it inside the add to cart button

add_action("wp_footer", "wpslash_hook_to_add_the_price_in_button");
function wpslash_hook_to_add_the_price_in_button()

{

    ?>
    <script>

        jQuery(document).ready(function() 


            {



jQuery(document).on('change', '.extra-options-accordion select, .extra-options-accordion input , .input-text.qty', function()
    {


        var price  = jQuery('.wf_product_view .price:first').text();

        jQuery('.wf_product_view .single_add_to_cart_button').html(price+' | Add to cart');

    });   
			
				jQuery( this ).on( 'found_variation', function( event, variation ) {


        var price  = variation.price_html;

        jQuery('.wf_product_view .single_add_to_cart_button').html(price+' | Add to cart');

    });            



      });
		
		




    </script>

    <?php
}

function wpslash_include_price_in_add_to_cart_button( $text, $product ) {
 		
        $text = strip_tags(wc_price($product->get_price()))." | ".$text;
    
    return $text;
}
add_filter( 'woocommerce_product_single_add_to_cart_text', 'wpslash_include_price_in_add_to_cart_button', 10, 2 );

Leave a Comment

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

Related Articles

Tutorials

How to Add Real-Time Order Tracking and SMS Notifications to Your WooCommerce Restaurant Website

Why Real-Time Order Tracking Matters for Restaurant Websites Think about the last time you ordered food through DoorDash or Uber Eats. You probably watched that little map update in real time, tracking your driver’s every turn. Now think about what happens when you order from a local restaurant’s website and get… silence. Maybe a confirmation […]
April 17, 2026
FoodMaster (formerly WooFood)

How to Build a Smart Allergen Filter and Nutritional Calculator for Your WooCommerce Restaurant Menu

Why Allergen Filtering and Nutritional Transparency Matter More Than Ever A customer with a severe peanut allergy stares at your online menu, trying to figure out which dishes are safe. If they can’t find that information within seconds, they’ll close the tab and order from a competitor who makes it obvious. That scenario plays out […]
April 16, 2026
FoodMaster (formerly WooFood)

How to Build a Custom Restaurant Menu with Allergen Filters, Nutritional Info, and Dietary Labels in WooCommerce: Vegan, Gluten-Free, Keto, and Halal Tags for a Better Customer Experience (Complete Guide)

Why Allergen Information and Dietary Labels Matter for Your Restaurant Website A customer with a severe peanut allergy lands on your restaurant’s online menu. There’s no allergen information anywhere. They leave — and they’re never coming back. That lost sale is just the tip of the iceberg. Without clear dietary labeling, you’re losing revenue, risking […]
April 16, 2026