Hide “Count” when the Cart is Empty (Shortcode)

  • Resolved David

    (@davidhc)


    9 months, 2 weeks ago

    Hi,

    Firstly, incredible plugin, really great work!

    I have one small question, when using the shortcode implementation, is it possible to not show the “Count” part on the basket/cart icon?

    So where there’s a cart icon with a black circle and a “0” inside it when there’s no products added to the cart, can that just be the cart icon without the black circle/0 and then when you add a product the black circle/1 appears?

    I am going through all the options in the settings but I can’t see if this is possible?

    Many thanks

    David

Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Support XootiX

    (@helloxootix)

    9 months, 2 weeks ago

    Hello @davidhc

    I am glad you like the plugin.
    Currently it is not possible to hide the elements conditionally from the settings.
    You can use this snippet

    add_action('wp_footer', function () { ?>
        <script type="text/javascript">
            jQuery(document).ready(function ($) {
                $(document.body).on('wc_fragments_refreshed wc_fragments_loaded', function () {
                    var $sc = $('.xoo-wsc-sc-count, .xoo-wsc-sc-subt');

                    if ($('.xoo-wsc-product').length) {
                        $sc.show();
                    } else {
                        $sc.hide();
                    }
                });
            });
        </script>
    <?php });

    // Hide cart count in header if cart is empty
    add_action('wp_head', function () {
        if (WC()->cart->get_cart_contents_count() <= 0) { ?>
            <style type="text/css">
                .xoo-wsc-sc-count, .xoo-wsc-sc-subt {
                    display: none;
                }
            </style>
        <?php }
    });
    Thread Starter David

    (@davidhc)

    9 months, 2 weeks ago

    Hi @helloxootix

    Perfect, thanks! That workaround works well.

    I noticed it still preloads the “0” item for a split second while the page loads, then disappears. In fact even before we added that snippet it was doing this, with the “count” item preloading at a different position, moving the horizontal navigation of the site while it loaded, then it moves into position and then the nav moves into its normal position.

    Nothing major but it draws attention each time the user moves to a new page on the site, this movement happens, so it’s a bit distracting. Are you seeing that too on your implementation or is it a known issue?

    Thanks again!

    David

    Plugin Support XootiX

    (@helloxootix)

    9 months, 2 weeks ago

    Please replace

    add_action('wp_footer', function () { ?>
        <script type="text/javascript">
            jQuery(document).ready(function ($) {
                $(document.body).on('wc_fragments_refreshed wc_fragments_loaded', function () {
                    var $sc = $('.xoo-wsc-sc-count, .xoo-wsc-sc-subt');

                    if ($('.xoo-wsc-product').length) {
                        $sc.show();
                    } else {
                        $sc.hide();
                    }
                });
            });
        </script>
    <?php });

    // Hide cart count in header if cart is empty
    add_action('wp_head', function () {
        if (WC()->cart->get_cart_contents_count() <= 0) { ?>
            <style type="text/css">
                span.xoo-wsc-sc-count, span.xoo-wsc-sc-subt {
                    display: none;
                }
            </style>
        <?php }
    });
    Thread Starter David

    (@davidhc)

    9 months, 2 weeks ago

    Thanks @helloxootix , that does work, but unfortunately it for some reason then overrides the custom css we added into the plugin’s custom css area and the subtotal text becomes visible again:

    /* Hide subtotal */ span.xoo-wsc-sc-subt { display: none; }

    Also I noticed, with this shortcode in the header block, it’s still “moving” the entire header/nav menu “downwards” for a split second as each new page loads. When I use some other unrelated shortcode in the same place, this doesn’t happen.

    Thanks again,

    David

    Plugin Support XootiX

    (@helloxootix)

    9 months, 2 weeks ago

    Please use !important in your CSS

    /* Hide subtotal */ span.xoo-wsc-sc-subt { display: none!important; }

    Sorry, I am unable to replicate the “moving” header issue on my end. I can further investigate if you share your website link here or on our website

Viewing 5 replies - 1 through 5 (of 5 total)

The topic ‘Hide “Count” when the Cart is Empty (Shortcode)’ is closed to new replies.