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

Dear islam,

It’s great having you in our WordPress & WooCommerce community!

Every insight you share helps us refine XStore and build tools that empower thousands of online store owners worldwide.

Leave Feedback →
(takes less than a minute)

Together, we grow stronger with every release.

Topic closed.
The 8Theme Team