如何在WooCommerce归档页将View Product按钮置于Add to Cart按钮下方

嗨，我懂你现在的困扰——本来想把View Product按钮放在Add to Cart下方，结果它反倒跑到上面去了对吧？这大概率是因为你用错了钩子，导致内容在Add to Cart按钮之前就被输出了。

下面是调整后的代码，能帮你把按钮放到正确的位置：

// 在WooCommerce商品归档页添加View Product按钮到Add to Cart下方
add_action( 'woocommerce_after_add_to_cart_button', 'add_view_product_button_under_add_to_cart', 20 );

function add_view_product_button_under_add_to_cart() {
    // 仅在商品归档相关页面生效（商店页、分类页、标签页）
    if ( is_shop() || is_product_category() || is_product_tag() ) {
        global $product;
        $product_link = get_permalink( $product->get_id() );
        // 输出按钮，样式可以根据你的主题自定义调整
        echo '<a href="' . esc_url( $product_link ) . '" class="button view-product-button">' . esc_html__( 'View Product', 'woocommerce' ) . '</a>';
    }
}

关键调整说明： #

• 我把原来的前置钩子（比如woocommerce_before_add_to_cart_button）换成了woocommerce_after_add_to_cart_button，这个钩子专门负责在Add to Cart按钮之后渲染内容。
• 钩子后面的20是优先级数值，如果你的主题有其他元素使用了同一个钩子，你可以调整这个数值（数值越大，内容越晚输出，位置越靠后）。
• 加入了条件判断，确保按钮只在商品归档类页面显示，不会在单个商品详情页重复出现。

你可以把这段代码添加到你当前主题的functions.php文件末尾，或者使用自定义代码插件（比如Code Snippets）来添加，这样不会因为主题更新丢失修改。

内容的提问来源于stack exchange，提问作者Srikanth Kamath