我正在寻找一些帮助,让WooCommerce变量产品标题根据变化进行更改。在这种特定情况下,我希望在选择颜色时更改标题,例如“Productname Black”。
是否有任何简单的片段可以让它发挥作用?感谢我能得到的所有帮助。
更新2018年2月 以下代码将向标题添加所选变体的颜色属性vakue,这意味着如果有多个选择字段(许多属性),则只有在出现变化价格时,颜色文本值才会显示在标题中(选定的变体) )。它基于PHP和jQuery,因为它是客户端浏览器端的实时事件。
编码:
add_filter( 'wp_footer','custom_product_title_script' );
function custom_product_title_script(){
global $post;
// Only single product pages
if( ! is_product() ) return;
// get an instance of the WC_Product Object
$product = wc_get_product($post->ID);
// Only for variable products
if( ! $product->is_type( 'variable' ) ) return;
// Here set your specific product attributes in this array (coma separated):
$attributes = array('pa_color');
// The 1st loop for variations IDs
foreach($product->get_visible_children( ) as $variation_id ) {
// The 2nd loop for attribute(s)/value
foreach($product->get_available_variation( $variation_id )['attributes'] as $key => $value_id ){
$taxonomy = str_replace( 'attribute_', '', $key ); // Get the taxonomy of the product attribute
// Just for defined attributes
if( in_array( $taxonomy, $attributes) ){
// Set and structure data in an array( variation ID => product attribute => term name )
$data[ $variation_id ][$taxonomy] = get_term_by( 'slug', $value_id, $taxonomy )->name;
}
}
}
?>
<script type="text/javascript">
(function($){
// variables initialization
var variationsData = <?php echo json_encode($data); ?>,
productTitle = $('.product_title').text(),
color = 'pa_color';
console.log(variationsData);
// function that get the selected variation and change title
function update_the_title( productTitle, variationsData, color ){
$.each( variationsData, function( index, value ){
if( index == $('input.variation_id').val() ){
$('.product_title').text(productTitle+' - '+value[color]);
console.log('TITLE UPDATED');
return false;
} else {
$('.product_title').text(productTitle);
}
});
}
// Once all loaded
setTimeout(function(){
update_the_title( productTitle, variationsData, color );
}, 300);
// On live event: select fields
$('select').blur( function(){
update_the_title( productTitle, variationsData, color );
});
})(jQuery);
</script>
<?php
}
代码放在活动子主题(或主题)的function.php文件中,或者放在任何插件文件中。
测试和工作......你会得到类似的东西: