我想根据产品类型在WooCommerce的"添加到购物车"按钮旁边添加一个自定义按钮"查看演示"，无论是在主商店页面还是单个产品页面。
我已经完成了以下步骤：
将代码添加到主题文件header.php:
<script>var url_demo = "<?php echo the_field('url_demo'); ?>"</script>
使用"TC自定义JavaScript"插件添加jQuery脚本：
jQuery(function($) {
$('.add_to_cart_button, .single_add_to_cart_button').after(' <a class="button demo_button" style="padding-right: 0.75em;padding-left: 0.75em;margin-left: 8px; background-color: #0ebc30;" href="'+url_demo+'" target="_blank">View Demo</a>');
});
它的工作，自定义按钮"查看演示"显示在主商店页面和单一产品页面。
但我现在遇到了一些问题，"查看演示"按钮链接只在单一产品页面上正确，而在商店主页上，"查看展示"按钮链接到同一个url。我上面的代码是错的吗？
我的问题是，如何添加只显示特定产品类型的"查看演示"按钮（在主商店页面和单个产品页面上），例如只显示在类别主题上？最后，有没有其他方法可以在不编辑header.php文件的情况下添加演示链接，就像上面的方法一样？我只是预计如果主题更新，header.php文件会重置。
我正在使用另一种方法：WooCommerce挂钩。
您不再需要jQuery脚本以及header.php文件中的javascript，因此您可以擦除它们。
使用get_field()而不是the_field（得益于Deepti chipdey）仅获得连接在echoed字符串中的值。
将此代码片段粘贴到位于活动子主题或主题文件夹中的function.php文件中：
function wc_shop_demo_button() {
echo '<a class="button demo_button" style="padding-right: 0.75em;padding-left: 0.75em;margin-left: 8px; background-color: #0ebc30;" href="'.get_field( "url_demo" ).'" target="_blank">View Demo</a>';
}
add_action( 'woocommerce_after_shop_loop_item', 'wc_shop_demo_button', 20 );
add_action( 'woocommerce_after_add_to_cart_button', 'wc_shop_demo_button', 20 );
我已经瞄准了用于在商店页面和单个产品页面上显示添加到购物车按钮的挂钩，以在其之后显示您的查看演示按钮，购买降低优先级。
由于某种原因，LoicTheAztec的回答不适合我。
以下是行之有效的方法：
function wc_shop_demo_button() {
echo '<a class="button demo_button" href="'.get_field( "url_demo" ).'" target="_blank">View Demo</a>';
}
add_action( 'woocommerce_after_add_to_cart_button', 'wc_shop_demo_button' );
希望这能帮助他们的旅程。
更改
the_field('url_demo');
至
get_field('url_demo');
由于某种原因，上面的答案给我带来了一个错误。我使用了这些代码，并将它们与其他代码组合在一起，找到了解决方案。
- 编辑Wooccommerce产品并为其添加一个名称为
url_demo、值为your-demo-url的属性 - 将以下代码添加到您的子主题functions.php文件（或您的父主题，但我不推荐使用）：
/* Adding demo button to Woocommmerce products */
function wc_shop_demo_button() {
$product = wc_get_product(get_the_id());
$url_demo = $product->get_attribute('url_demo');
echo '<a class="button" href="'.$url_demo.'" target="_blank">View Demo</a>';
}
add_action('woocommerce_after_shop_loop_item', 'wc_shop_demo_button', 20);
add_action('woocommerce_after_add_to_cart_button', 'wc_shop_demo_button', 20);