Need Help Displaying Variation Price and Shipping Icon in Quick View (Swatches)

Thanks for your solution. Now my code works on quick view too, the problem is that, the values inserted (fast shipping and price of size) are the same values of the current product in the product page, not the product opened in the quick view. how can i solve this?

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css" />

<script>
document.addEventListener("DOMContentLoaded", function () {
    initSwatchEnhancements();
});

// Reactivar en el Quick View
jQuery(document).on('etheme_quick_view_content_loaded', function () {
    setTimeout(initSwatchEnhancements, 200); // esperar un poco para que el DOM esté completo
});

function initSwatchEnhancements() {
    addFastShippingIcon();
    styleFastShippingSwatches();
    addPriceToSwatches();
    updateQuantityMaxBySelectedSwatch();
    styleFastShippingDescription();
}

function addFastShippingIcon() {
    const shippingMapEl = document.getElementById('shipping-class-map');
    if (!shippingMapEl) return;

    const shippingMap = JSON.parse(shippingMapEl.textContent);
    document.querySelectorAll('.st-custom-attribute').forEach(swatch => {
        const talla = swatch.getAttribute('data-value');
        if (!talla || swatch.querySelector('.envio-info')) return;

        if (shippingMap[talla] && shippingMap[talla].toLowerCase().includes('48')) {
            const icon = document.createElement('div');
            icon.className = 'envio-info';
            icon.style.position = 'absolute';
            icon.style.top = '5px';
            icon.style.left = '5px';
            icon.style.textAlign = 'center';
            icon.innerHTML = '<i class="fa-solid fa-bolt-lightning" style="color:#C8FF0B; font-size:10px;"></i>';
            swatch.style.position = 'relative';
            swatch.appendChild(icon);
        }
    });
}

function styleFastShippingSwatches() {
    document.querySelectorAll('ul.st-swatch-size-large li.type-label').forEach(li => {
        const span = li.querySelector('span');
        if (span && span.querySelector('.envio-info')) {
            li.style.backgroundColor = '#F9FDED';
        }
    });
}

function styleFastShippingDescription() {
    document.querySelectorAll('.woocommerce-variation-description p').forEach(p => {
        if (p.textContent.includes('48')) {
            p.style.color = '#000000';
            p.style.backgroundColor = '#F9FDED';
            p.style.padding = '10px';
            p.style.border = '2px solid #C8FF0B';
            p.style.borderRadius = '5px';
        }
    });
}

function addPriceToSwatches() {
    const priceMapEl = document.getElementById('price-map');
    if (!priceMapEl) return;

    const priceMap = JSON.parse(priceMapEl.textContent);
    document.querySelectorAll('.st-custom-attribute').forEach(swatch => {
        const talla = swatch.getAttribute('data-value');
        if (!talla || swatch.querySelector('.precio-info')) return;

        if (priceMap[talla]) {
            const priceDiv = document.createElement('div');
            priceDiv.className = 'precio-info';
            priceDiv.style.fontSize = '11px';
            priceDiv.style.color = '#000';
            priceDiv.style.textAlign = 'center';
            priceDiv.style.marginTop = '3px';
            priceDiv.style.fontWeight = 'normal';
            priceDiv.innerHTML = priceMap[talla];
            swatch.appendChild(priceDiv);
        }
    });
}

function updateQuantityMaxBySelectedSwatch() {
    const stockMapEl = document.getElementById('stock-map');
    if (!stockMapEl) return;

    const stockMap = JSON.parse(stockMapEl.textContent);
    const selectedSwatch = document.querySelector('li.type-label.subtype-square.selected .st-custom-attribute');
    const quantityInput = document.querySelector('input[name="quantity"]');
    if (!selectedSwatch || !quantityInput) return;

    const talla = selectedSwatch.getAttribute('data-value');
    const stock = stockMap[talla];

    if (stock && stock > 0) {
        quantityInput.max = stock;
        if (parseInt(quantityInput.value) > stock) {
            quantityInput.value = stock;
        }
        quantityInput.disabled = false;
    } else {
        quantityInput.max = 0;
        quantityInput.value = 0;
        quantityInput.disabled = true;
    }
}
</script>

There is a way to make this directly in php? i tried to edit “class-st-woo-product-attributes.php” and also “st-woo-swatches.php” but literally it didn’t do nothing

Thanks for the support! My topic “Need Help Displaying Variation Price and Shipping Icon in Quick View (Swatches)” has been successfully resolved.