• Resolved A Z


    Hi there,

    We all love the new update from CartFlows, the modern checkout looks way better however there is a small UX problem on mobile mode which is the Order Summary is hidden by default unless the users click on it then it will expand down.

    The issue here is that it is important to show the order summary without clicking anywhere so that the user would be aware of the shipping rates and timeframe.

    Having the order summary hidden by default on the mobile mode will cause the user to checkout without seeing the shipping timeframe and rate which leads to customer service and refunds.

    Please advise if there is an easy way to show the order summary on phone very clearly without any click!


Viewing 13 replies - 1 through 13 (of 13 total)
  • Mahdi


    Hello there,

    Thank you for contacting us!

    As of now, we don’t have a backend option for this, but we will try to add this feature in our upcoming updates whenever feasible.

    You can use the following custom CSS to show that section by default:

    .wcf-embed-checkout-form.wcf-embed-checkout-form-modern-checkout .wcf_cartflows_review_order_wrapper {
    display: block!important;

    Hope this was helpful.

    Have a great day.

    Thread Starter A Z


    Thanks @mahdimoafi for the CSS snippet, i have added mobile view conditions to the CSS:

    @media only screen and (min-device-width : 320px) and (max-device-width : 1000px) {
    .wcf-embed-checkout-form.wcf-embed-checkout-form-modern-checkout .wcf_cartflows_review_order_wrapper {
        display: block!important;

    I would love to see this option available from the backend one day.

    Thanks again.



    Most welcome!

    Yes, we’ve already added it to our list so our developers may consider adding it whenever feasible.

    Best wishes,

    I was looking for this exact setting.
    Thanks for the quick fix. But this is a much needed feature.
    As of now, the CSS displays the block by default, but it doesn’t allow the user to hide it by clicking on the toggle.

    Hi guys,

    I’ve just realized that now, my store has that “order summary”, since it dind’t few versions ago.

    My clients most of times only buy a single product, so I don’t want to show that summary (just show the products). Is there any way to avoid the order summary?

    And one more question: my WP installation is in spanish, but some fields are printed in english and others in spanish. i.e:

    ENG – Customer information > Email address
    ESP – Detalles de facturacion > Nombre
    ESP – Información adicional (textarea)
    ENG – Payment

    How can I print all of them in spanish? (via snippet or whatever)

    If I can solve this I will rathe plugin with 5 stars 🙂

    Thank you!


    I’ve added this snippet in Elementor’s custom CSS, but it isn’t working. The section is still hidden by default for mobile users.

    Yeah me too. I’ve added it on the widget (element) advanced > custom css, but nothing happens.

    Plugin Support Shravan Bhaskaravajjula


    Hello there,

    We have introduced a new filter to show the order summary on mobile devices,

    add_filter( 'cartflows_show_mobile_order_summary_collapsed', '__return_false' );

    Please add the code to your child theme’s functions.php.

    Hope this helps.

    If you have any other queries, please let us know.

    Thank you Sravan!

    Two questions:

    1. Is there any filter to just hide that summary?

    2. Is there any filter/way to translate the other checkout fields? i.e. this screenshot (red fields) https://prnt.sc/_YaJTOEUJSmW

    Thread Starter A Z


    @bhshravankumar works great. thanks for the filter.

    Plugin Support Shravan Bhaskaravajjula


    Hello @troymcclure,

    1. You don’t want to show the summary on the checkout page? Sorry to disappoint you, but it is not possible.

    2. Yes, you can use Loco Translate to translate the plugin strings.

    Please refer to this article:

    How to Translate or Change CartFlows Strings with LocoTranslate?

    If you couldn’t find these new strings in Loco Translate, click on the “Sync” button and the new strings will appear.

    Screenshot: https://share.getcloudapp.com/4guKxG5E.

    Hope this helps.

    Great! Thank you

    Plugin Support Shravan Bhaskaravajjula


    Hello @troymcclure,

    You are welcome.

    If you have any further questions, don’t hesitate to let us know by opening another conversation. We are here to help you.

    Have a wonderful day!

Viewing 13 replies - 1 through 13 (of 13 total)
  • The topic ‘Show Order Summary on mobile mode by default’ is closed to new replies.