Hide recent ‘product list’ when empty on Home Page

Hello,

Unfortunately, there is no available setting to hide the entire section when there are no products.

To achieve this, you would need to use custom JavaScript code. Please add the following code to the **functions.php** file located in your child theme:

<?php
// Hide "Previously Viewed" section when products are empty
add_action('wp_footer', function() {
    ?>
    <script>
    (function() {
        // Target the section by its data-id
        const section = document.querySelector('[data-id="b4f1946"]');
        
        if (!section) return;
        
        // Function to check if section has products
        function checkProducts() {
            // Look for product elements within the section or after it
            const productContainer = section.nextElementSibling;
            
            // Common selectors for WooCommerce/Elementor products
            const products = section.querySelectorAll('.product, .woocommerce-product, .elementor-widget-products, .products .product');
            
            // Alternative: check the next sibling section for products
            const nextSectionProducts = productContainer?.querySelectorAll('.product, .woocommerce-product, .elementor-widget-products, .products .product');
            
            // Hide section if no products found
            if (products.length === 0 && (!nextSectionProducts || nextSectionProducts.length === 0)) {
                section.style.display = 'none';
            } else {
                section.style.display = '';
            }
        }
        
        // Check on load
        checkProducts();
        
        // Re-check after a short delay (in case products load dynamically)
        setTimeout(checkProducts, 500);
        setTimeout(checkProducts, 1000);
        
        // Optional: Use MutationObserver to detect dynamic changes
        const observer = new MutationObserver(checkProducts);
        observer.observe(document.body, { childList: true, subtree: true });
    })();
    </script>
    <?php
});
?>

Please note that custom code implementation is beyond the scope of our standard support services. You will need to maintain and adjust it on your own.

Thank you for your understanding.

Best regards,
8Theme Team