Order Summary Scroll on Checkout

  • newcelic

    (@newcelic)


    2 months ago

    Hello,
    I would like to know if the behavior of the checkout block on my site is the native functionality of the Storefront theme (which I currently have active) or if this is an isolated issue in my case.

    I’ve tested with other themes and noticed that on the checkout page using the Gutenberg block, the right-hand column (the order summary) scrolls down as you move through the page in the desktop version. However, on my website, this behavior doesn’t occur.

    Is this the natural behavior of the Storefront theme, or could it be a specific anomaly in my setup?

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

  • Hi @newcelic ,

    Thanks for reaching out!

    I tested this on my sandbox site using the latest Storefront theme, but I wasn’t able to reproduce the feature where the order summary section moves while scrolling.

    It seems that the functionality you’re referring to might be specific to another theme, which is why you’re not seeing it when using the Storefront theme. Since this feature isn’t a part of Storefront’s default functionality, it would not be considered an issue.

    I hope this helps clarify things! 

    Thread Starter newcelic

    (@newcelic)

    Dear Jonayed,

    Thank you for taking the time and effort to investigate Storefront’s behavior during checkout. I truly appreciate your dedication and the clarity of your response.

    I would like to suggest considering this functionality for future Storefront updates. It is crucial for customers to keep the right column visible as they scroll down during checkout, ensuring they never lose sight of the summary and total amount of their order. This would greatly enhance the user experience.

    Please feel free to reach out if you have any questions or need additional details.

    Kind regards,

    Hi @newcelic,

    Thank you for your thoughtful suggestion regarding the behavior of Storefront during checkout. I agree that keeping the right column visible as users scroll would significantly improve the experience by ensuring the order summary and total are always visible.

    You can achieve this by adding custom CSS to your site. If you’re not familiar with CSS, I recommend consulting a developer for assistance. Additionally, if you’d like to formally request this feature, feel free to submit it here: WooCommerce Feature Requests.

    Thank you.

    Thread Starter newcelic

    (@newcelic)

    Thank you for your suggestion.

    Do you have the code so I can implement it with CSS?

    Hi @newcelic,

    The code required to achieve this can be quite complex and depends on how your theme names its classes. However, the general principle is to make the container responsible for the right column fixed using CSS. You can learn more about CSS positioning here: https://www.w3schools.com/css/css_positioning.asp.

    Another approach is to give the left column a fixed height and allow it to scroll vertically. While CSS can accomplish this, it’s an advanced task, and providing the exact CSS is outside the scope of support. It’s best to hire a professional to assist you with this.

Viewing 5 replies - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.