更改WooCommerce产品比较插件的按钮

Question

我想更改插件WooCommerce产品比较的"比较"按钮的外观。目前，它显示了带有标签的复选框和一个打开"比较页面"的链接。

我检查了文档(https://docs.woocommerce.com/document/woocommerce-products-compare/(，并找到了一个更改按钮的挂钩。不幸的是没有太多其他信息。

说，您可以使用以下挂钩更改"比较"按钮的显示：

apply_filters( 'woocommerce_products_compare_compare_button', html )

据我了解，html是我需要添加自定义代码的地方，对

我尝试了这样的事情：

$compare_btn = 'my button html';
apply_filters( 'woocommerce_products_compare_compare_button', $compare_btn );

但是按钮不会更改。我想念什么吗？

以及如何添加HTML的动态部分(例如产品ID(。当前的输出看起来像这样：

<p class="woocommerce-products-compare-compare-button">
    <label for="woocommerce-products-compare-checkbox-1876"><input type="checkbox" class="woocommerce-products-compare-checkbox" data-product-id="1876" checked="checked" id="woocommerce-products-compare-checkbox-1876">&nbsp;Compare</label>
    <a href="https://example.com/products-compare" title="Compare Page" class="woocommerce-products-compare-compare-link"><span class="dashicons dashicons-external"></span></a>
</p>

编辑：我在插件文件中找到了该功能。就是这样：

public function display_compare_button() {
    global $post;
    $name = __( 'Compare', 'woocommerce-products-compare' );
    $checked = checked( $this->is_listed( $post->ID ), true, false );
    $html = '<p class="woocommerce-products-compare-compare-button"><label for="woocommerce-products-compare-checkbox-' . esc_attr( $post->ID ) . '"><input type="checkbox" class="woocommerce-products-compare-checkbox" data-product-id="' . esc_attr( $post->ID ) . '" ' . $checked . ' id="woocommerce-products-compare-checkbox-' . esc_attr( $post->ID ) . '" />&nbsp;' . $name . '</label> <a href="' . get_home_url() . '/' . $this->get_endpoint() . '" title="' . esc_attr__( 'Compare Page', 'woocommerce-products-compare' ) . '" class="woocommerce-products-compare-compare-link"><span class="dashicons dashicons-external"></span></a></p>';
    echo apply_filters( 'woocommerce_products_compare_compare_button', $html, $post->ID, $checked );
    return true;
}

有什么方法可以覆盖函数？

Answer 1

尝试以下内容(您必须在其中更改按钮(：

add_filter( 'woocommerce_products_compare_compare_button', 'custom_products_compare_compare_button', 20, 3 );
function custom_products_compare_compare_button( $html, $post_id, $checked ){
    global $post;
    $name = __( 'Compare', 'woocommerce-products-compare' );
    // HERE below, make your changes to the HTML ($this need to be replaced by an instance of the class object)
    $html = '<p class="woocommerce-products-compare-compare-button"><label for="woocommerce-products-compare-checkbox-' . esc_attr( $post->ID ) . '"><input type="checkbox" class="woocommerce-products-compare-checkbox" data-product-id="' . esc_attr( $post->ID ) . '" ' . $checked . ' id="woocommerce-products-compare-checkbox-' . esc_attr( $post->ID ) . '" />&nbsp;' . $name . '</label> <a href="' . get_home_url() . '/' . $this->get_endpoint() . '" title="' . esc_attr__( 'Compare Page', 'woocommerce-products-compare' ) . '" class="woocommerce-products-compare-compare-link"><span class="dashicons dashicons-external"></span></a></p>';
    return $html;
}

代码在您的活动子主题(或活动主题(的function.php文件中。