Responsive way to use side cart or by pass it

Hi,

We use the side cart in most of our websites; but in some cases, and based on screen width, we would rather bypass it, and got straight to the main cart.

Is there a way to do one or the the other, based on screen with, ie:

- screen width greater than X, deploy side cart
- screen width smaller than x, go straight to main cart

Thanks,

Philippe
Comments
  • fc_adamfc_adam FoxyCart Team
    edited October 16
    @Philippe,

    Good question. We do some specific checks as part of the native javascript to push to the full-page cart if the customer's browser isn't able to support the necessary functionality for the sidecart display to work. That's not based on screensize though.

    That said - it is possible for you to add a class or attribute to the body element of the page to prevent the sidecart from being used for the whole page. You could add that using javascript, and detecting whatever custom conditions you want.

    As an example, adding this code to just before the </body> tag in your website template would add the class to the body tag if the browser width is less than 200 pixels wide:
    <script>
    if (document.documentElement.clientWidth < 200) {
    document.body.classList.add("fc-sidecart--bypass");
    }
    </script>
  • Great- I can work with this ! Thanks
Sign In or Register to comment.