添加到购物车后添加一个按钮，并将其重定向到WooCommerce中的某个自定义链接

Question

我使用此钩子添加到购物车按钮后添加了一个按钮：

add_action( 'woocommerce_after_add_to_cart_button', array($this, 'add_button'));

但是当我点击该按钮时，它正在执行添加到购物车按钮的功能。

如何自定义按钮链接（到其他某个页面）？

提前致谢。

Answer 1

您需要以这种方式使用 woocommerce_after_add_to_cart_button 钩子来获得您期望的内容：

add_action( 'woocommerce_after_add_to_cart_button', 'add_custom_button', 10, 0 );
function add_custom_button() { 
    $my_custom_link = home_url('/my_page_slug/');
    echo '<a class="btn-atc" href="' . esc_url( $my_custom_link ) .'">' . __( "My text button", "my_theme_slug" )  . '</a>';
}; 

将此代码段粘贴到您的活动子主题或主题的function.php文件中。

然后你必须替换（在代码中）正确的链接路径，按钮名称和主题slug：

• 的 '/my_page_slug/'
• 的 "My text button"
• 的 "my_theme_slug"

这应该有效。

此部分不是您的问题，而是关于为您的按钮设置样式：

您可能需要为活动子主题或主题中的style.css文件添加一些自定义CSS规则，以便为自定义按钮的外观设置样式（使用＆＃34; btn-atc＆ ＃34;类而不是＆＃34; btn＆＃34;）：

/* Based on your comment */

a.btn-atc {
    background-color: #eee !important; 
    border: 2px solid #999; 
    -webkit-border-radius: 3px; 
    -moz-border-radius: 3px; 
    border-radius: 3px; 
    font-size: 20px; 
    font-weight: 500; 
    line-height: 1.7em !important; 
    margin-left: 5px; 
    margin-top: -5px; 
    position: relative; 
    padding: 0.3em 1em; 
    -webkit-transition: all 0.2s; 
    -moz-transition: all 0.2s; 
    transition: all 0.2s; 
}
a.btn-atc:hover {
    background-color: #666 !important; 
    color: #fff !important; 
}