以下是您重新访问的代码,该代码仅显示“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代码是这样的：
$99.00
- (Option Blue)
$299.00
- (Option Green)
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;
}
这只是一个例子
