WooCommerce 在添加到购物车按钮上显示价格

Question

我正在尝试将价格添加到循环中的“添加到购物车”按钮。

[100$ 添加到购物车] 而不是 [添加到购物车]

add_to_cart.php 模板：

echo apply_filters( 'woocommerce_loop_add_to_cart_link',
    sprintf( '<a href="%s" rel="nofollow" data-product_id="%s" data-product_sku="%s" class="tiny button %s product_type_%s">%s</a>',
        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 模板：

<?php if ( $price_html = $product->get_price_html() ) : ?>
    <span class="price"><?php echo $price_html; ?></span>
<?php endif; ?>

如何将这两者结合起来？在网上找不到任何东西。

Answer 1

这应该可行：将 add_to_cart.php 文件修改为

echo apply_filters( 'woocommerce_loop_add_to_cart_link',
sprintf( '<a href="%s" rel="nofollow" data-product_id="%s" data-product_sku="%s" class="button %s product_type_%s">%s %s</a>',
    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 );

价格将显示在“添加到购物车”文本的前面。

编辑：您应该注意，更新 woocommerce 插件将撤消该插件以及您对任何文件所做的任何其他修改。

Answer 2

WooCommerce 3.1.0 更新了添加到购物车按钮的功能

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

如果您希望（在某种程度上）免受未来 Woocommerce 升级的影响，请关注 the official safe way to do it（谢谢 Felix）。

将add-to-cart.php 复制到主题内名为/woocommerce 的目录中，保持相同的文件结构，但删除/templates/ 子目录。

示例：要覆盖管理员订单通知，请将：wp-content/plugins/woocommerce/templates/emails/admin-new-order.php 复制到 wp-content/themes/yourtheme/woocommerce/emails/admin-new-order.php

这是为 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( '<a href="%s" data-quantity="%s" class="%s" %s><span style="color:#bb0d00;">%s</span> &nbsp;&nbsp;<span style="color:#999;">|</span>&nbsp;&nbsp; %s</a>',
        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 );
?>

当然，按钮的样式或修改其内容完全取决于您，并且不限于显示产品价格。