以下是您重新访问的代码,该代码仅显示“Tab”属性单选按钮自定义显示的文本a< span>基于属性slug和$term_slug的组合,使用不同的类值标记.

因此,您可以将一些CSS样式颜色应用于每个单选按钮显示的’pa_tab’属性的自定义文本,将这些CSS规则添加到您的活动主题style.css …

这是重新访问的代码：

// Display the product variation price inside the variations dropdown.

add_filter( 'woocommerce_variation_option_name', 'display_price_in_variation_option_name', 10, 1 );

function display_price_in_variation_option_name( $term ) {

global $wpdb, $product;

// Define HERE the targetted attribute taxonomy slug

$tax_slug = 'pa_tab';

// compatibility with WC +3

$product_id = method_exists( $product, 'get_id' ) ? $product->get_id() : $product->id;

if ( empty( $term ) || empty( $product_id ) )

return $term;

$result = $wpdb->get_var( "SELECT slug FROM {$wpdb->prefix}terms WHERE name = '$term'" );

$term_slug = ( ! empty( $result ) ) ? $result : $term;

$variation_id = $wpdb->get_var( "

SELECT postmeta.post_id AS product_id

FROM {$wpdb->prefix}postmeta AS postmeta

LEFT JOIN {$wpdb->prefix}posts AS products ON ( products.ID = postmeta.post_id )

WHERE postmeta.meta_key LIKE 'attribute_%'

AND postmeta.meta_value = '$term_slug'

AND products.post_parent = $product_id

");

$parent = wp_get_post_parent_id( $variation_id );

if ( $parent > 0 ) {

$_product = wc_get_product( $variation_id );

if ( has_term( $term, $tax_slug, $_product->id) )

$output = ' ' . wp_kses( woocommerce_price( $_product->get_price() ), array() ) . ' - ('.$term.')';

else

$output = ' ' . $term;

return $output;

}

return $term;

}

代码放在活动子主题(或主题)的function.php文件中,或者放在任何插件文件中.

此代码经过测试和运行.

生成的html代码是这样的：

So you target this specific radio buttons displayed custom text with CSS rules something like:

span.pa_tab-price {

font-family: lato, sans-serif;

font-size: medium;

}

span.pa_tab-option-blue, span.pa_tab-option-green,

span.pa_tab-option-purple, span.pa_tab-option-orange {

font-family: lato, sans-serif;

font-size: medium;

font-style: normal;

font-weight: 300;

}

span.pa_tab-option-blue {

color: blue;

}

span.pa_tab-option-green {

color: green;

}

span.pa_tab-option-purple {

color: purple;

}

span.pa_tab-option-orange {

color: orange;

}

这只是一个例子