WooCommerce display price on add to cart button - php

Question

I'm trying to add the price to the add to cart button in the loop.
[100$ Add to cart] instead of [Add to cart]
add_to_cart.php template:
echo apply_filters( 'woocommerce_loop_add_to_cart_link',
sprintf( '%s',
esc_url( $product->add_to_cart_url() ),
esc_attr( $product->id ),
esc_attr( $product->get_sku() ),
$product->is_purchasable() && $product->is_in_stock() ? 'add_to_cart_button' : '',
esc_attr( $product->product_type ),
esc_html( $product->add_to_cart_text() )
),
$product );
price.php template:
<?php if ( $price_html = $product->get_price_html() ) : ?>
<span class="price"><?php echo $price_html; ?></span>
<?php endif; ?>
How do I combine these two? Couldn't find anything on the web.

Answer 1

This should work: modify the add_to_cart.php file to
echo apply_filters( 'woocommerce_loop_add_to_cart_link',
sprintf( '%s %s',
esc_url( $product->add_to_cart_url() ),
esc_attr( $product->id ),
esc_attr( $product->get_sku() ),
$product->is_purchasable() ? 'add_to_cart_button' : '',
esc_attr( $product->product_type ),
$product->get_price_html(),
esc_html( $product->add_to_cart_text() )
),
$product );
and the price will display in front of the "Add to cart" text.
EDIT: You should note that updating the woocommerce plugin will undo that and any other modification you have made to any of the files.

Answer 2

WooCommerce 3.1.0 updated the Functions for Add to Cart Button
apply_filters( 'woocommerce_loop_add_to_cart_link',
sprintf( '<li><a href="%s" rel="nofollow" data-product_id="%s"
data-product_sku="%s" class="btn-filled cart add-to-cart %s
product_type_%s"><i class="fa fa-shopping-cart" ></i></a></li>',
esc_url( $product->add_to_cart_url() ),
esc_attr( isset( $quantity ) ? $quantity : 1 ),
esc_attr( $product->get_id() ),
esc_attr( $product->get_sku() ),
esc_attr( isset( $class ) ? $class : 'button' ),
esc_html( $product->add_to_cart_text() )
),
$product );

Answer 3

If you want to be (somewhat) safe from a future Woocommerce upgrade, follow the official safe way to do it (thank you Felix).
Copy add-to-cart.php into a directory within your theme named /woocommerce keeping the same file structure but removing the /templates/ subdirectory.
Example: To override the admin order notification, copy: wp-content/plugins/woocommerce/templates/emails/admin-new-order.php to wp-content/themes/yourtheme/woocommerce/emails/admin-new-order.php
Here is the file updated for Woocommerce 3.3.0 :
<?php
/**
* Loop Add to Cart
*
* This template can be overridden by copying it to yourtheme/woocommerce/loop/add-to-cart.php.
*
* HOWEVER, on occasion WooCommerce will need to update template files and you
* (the theme developer) will need to copy the new files to your theme to
* maintain compatibility. We try to do this as little as possible, but it does
* happen. When this occurs the version of the template file will be bumped and
* the readme will list any important changes.
*
* #see https://docs.woocommerce.com/document/template-structure/
* #author WooThemes
* #package WooCommerce/Templates
* #version 3.3.0
*/
if ( ! defined( 'ABSPATH' ) ) {
exit;
}
global $product;
echo apply_filters( 'woocommerce_loop_add_to_cart_link', // WPCS: XSS ok.
sprintf( '%s</span> <span style="color:#999;">|</span> %s',
esc_url( $product->add_to_cart_url() ),
esc_attr( isset( $args['quantity'] ) ? $args['quantity'] : 1 ),
esc_attr( isset( $args['class'] ) ? $args['class'] : 'button' ),
isset( $args['attributes'] ) ? wc_implode_html_attributes( $args['attributes'] ) : '',
$product->get_price_html(),
esc_html( $product->add_to_cart_text() )
),
$product, $args );
?>
Of course, styling the button or modificating its content is entirely up to you and isn't limited to show the product price.