Estoy teniendo problemas con las variaciones de WooCommerce, estoy intentando añadir un icono (SVG) a las variaciones con 1 unidad de Stock o más.
He añadido este codigo al functions.php
// Iconos para backorder y en stock
add_filter('woocommerce_available_variation', 'customize_variation_data');
function customize_variation_data($variation) {
$variation_obj = new WC_Product_Variation($variation['variation_id']);
// Verificar si la variación está en backorder
$variation['is_on_backorder'] = $variation_obj->is_on_backorder();
// Verificar si la variación está en stock
$variation['is_in_stock'] = $variation_obj->is_in_stock();
return $variation;
}
// Encolar el script JS
add_action('wp_enqueue_scripts', 'enqueue_custom_scripts');
function enqueue_custom_scripts() {
if (is_product()) {
wp_enqueue_script('custom-variation-script', get_stylesheet_directory_uri() . '/js/custom-variation-script.js', array('jquery'), null, true);
}
}
Tambien tengo un codigo JavaScript, /js/custom-variation-script.js:
jQuery(document).ready(function($) {
// Define el URL del SVG
var svgUrl = '/wp-content/uploads/2024/08/stock.svg';
function updateVariationLabels() {
// Iterar sobre cada lista de swatches
$('.st-swatch-preview').each(function() {
var $swatch = $(this);
var attributeName = $swatch.data('attribute');
// Obtener las variaciones de producto
var variations = $('.variations_form').data('product_variations');
// Iterar sobre cada variación
variations.forEach(function(variation) {
if (variation.is_on_backorder) {
var value = variation.attributes['attribute_' + attributeName];
// Buscar el span correspondiente y añadir el SVG
$swatch.find('span.st-custom-attribute').each(function() {
var $span = $(this);
if ($span.data('value') === value) {
if (!$span.find('img').length) { // Verifica si la imagen ya está añadida
$span.append('<img src="' + svgUrl + '" alt="Stock" style="width: 16px; height: 16px; vertical-align: middle; margin-left: 5px;">');
}
}
});
}
});
});
}
// Actualizar las etiquetas cuando se carga la página
updateVariationLabels();
// Actualizar las etiquetas cuando se encuentra una variación
$('.variations_form').on('found_variation', function(event, variation) {
if (variation.is_on_backorder) {
updateVariationLabels();
}
});
});
Este codigo funciona correctamente, muestra el icono (SVG) en el frontend correctamente. El problema es que solo muestra el icono cuando la variacion tiene activado Permite reservas.
Y yo necesito que se muestre en todas las variaciones que tengan más de una unidad de stock.
He intentado modificar el codigo para que funcione solo con productos con 1 unidad de stock o más, pero nunca me aparece el icono.
Quiero eliminar por completo la opcion de Permitir reservas / Backorder y que solo muestre el icono en productos con Stock.
Alguna idea? Muchisimas gracias