根据Woocommerce产品类别更改“添加到购物车”按钮的颜色

朱尔斯

在Woocommerce中,我试图根据其所在的产品类别更改“添加到购物车”按钮的颜色。到目前为止,我可以更改文本,但是我无法弄清楚如何传递散列格式的持久性颜色值(例如,#fffff)

// Change add to cart button text per category
add_filter( 'woocommerce_product_single_add_to_cart_text', 'wps_custom_cart_button_text' );
function wps_custom_cart_button_text() {
    global $product;
    $terms = get_the_terms( $product->ID, 'product_cat' );
     foreach ($terms as $term) {
        $product_cat = $term->slug;
        break;
    }
    switch($product_cat) {
        case 'clothing';
        return __('Order your Clothes', 'your_theme_text_domain' );
        default;
        return __( 'Order now', 'your_theme_text_domain' );
    }
}

任何帮助表示赞赏。

LoicTheAztec

这是一种根据产品类别更改按钮文本和按钮颜色的方法:

// Change add to cart button text per category
add_filter( 'woocommerce_product_single_add_to_cart_text', 'custom_single_add_to_cart_text', 20, 2 );
function custom_single_add_to_cart_text( $text_button, $product ) {
    global $post;
    $domain = 'woocommerce';

    // HERE set the array of categories terms slug and corresponding colors and texts
    $categories_colors = array(
        'clothing'  => array( 'color' => 'red', 'text' => __('Order your Clothes', $domain ) ),
        'posters'   =>  array( 'color' => 'blue', 'text' => __('Order your Posters', $domain ) ),
    );

    $color = '';
    $text_button = __('Order now', $domain ); // default

    foreach ($categories_colors as $key => $value ) {
        if( has_term( $key, 'product_cat', $post->ID ) ){
            $color = $value['color'];
            $text_button = $value['text'];
            break;
        }
    }
    if ( empty($color) ) return $text_button; // Exit if empty

    // Dynamic css andjquery to set the color when defined
    ?>
    <style>
        button.single_add_to_cart_button.<?php echo $color; ?>{background-color:<?php echo $color; ?> !important;}
    </style>
    <?php
    // jQuery (add color css class)
    ?>
    <script type="text/javascript">
        (function($){
             $('button.single_add_to_cart_button').addClass('<?php echo $color; ?>');
        })(jQuery);
    </script>
    <?php

    return $text_button;
}

代码进入您的活动子主题(或活动主题)的function.php文件中。经过测试和工作。

您可以<style>在代码中删除整个框,在活动主题styles.css文件中添加自己的CSS规则(基于添加的CSS类的颜色)

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

根据Woocommerce中的父产品类别更改“添加到购物车”按钮文本

根据Woocommerce中产品类别添加到购物车的最大商品数量

删除WooCommerce 3中特定产品类别的“添加到购物车”按钮

在WooCommerce中为特定产品类别自定义“添加到购物车”按钮

自定义特定 WooCommerce 产品类别上的“添加到购物车”按钮

根据WooCommerce产品类型更改添加到购物车按钮和文本

更改Woocommerce 3中特定产品类别的“添加到购物车”文本

如果购物车包含特定的Woocommerce产品类别,请阻止添加到购物车

删除Woocommerce中针对特定产品类别的添加购物车按钮

WooCommerce重定向到添加到购物车上的产品类别

根据产品类型,WooCommerce的“添加到购物车”按钮旁边的“自定义”按钮

WooCommerce无法从产品类别访问购物车

如果用户未登录Woocommerce,请避免将其添加到特定产品类别的购物车中

Ajax上的JS警报已添加到购物车,以获取Woocommerce中特定产品类别的数量

WooCommerce根据产品类别替换购物车/结帐中的“按需订购”

如何根据产品类别拆分woocommerce购物车页面

根据WooCommerce产品类别禁用特定的购物车项目数量字段

更改 Woocommerce 中特定产品类别的购物车项目价格

在WooCommerce购物车项目上为特定产品类别添加正文类

更改添加到购物车按钮的颜色,并在Woocommerce中将其禁用以用于缺货产品

Woocommerce中产品在购物车中时,更改添加到购物车按钮样式

将Woocommerce的“添加到购物车”按钮更改为“查看产品”按钮

根据WooCommerce产品自定义库存状态禁用添加到购物车按钮

根据WooCommerce单个产品中的重量替换添加到购物车按钮

更改Woocommerce中购买产品的“添加到购物车”按钮

更改Woocommerce中特定产品的添加到购物车按钮文本

根据产品类别有条件地操作 WooCommerce 购物车项目

WooCommerce自定义产品类型-多个添加到购物车部分的问题

WooCommerce 重定向添加到购物车以结帐特定产品类型