Order summaries help remind customers of exactly what they’re paying for. As such, they should be shown at every stage of a multi-step checkout process except for the account selection step.
This is partly because the total order cost tends to increase during checkout once shipping costs and sales taxes are tacked onto the price. Surprising a customer with this increased dollar amount at the payment stage might lead to sticker shocker and possibly cart abandonment.
Showing your customers the order summary at all checkout steps avoids the sticker shock problem since they see the total change to reflect sales taxes once they fill in their state. They can also see the impact of delivery costs on total order value which might motivate them to select a different delivery method.
Since the increase in order value is more “gradual” and clearly visible, customers are less likely to be shocked by the final charge. They are also less likely to feel that you’re trying to rip them off because they can see what is causing an increase in their order total (taxes and shipping).
Displaying the order summary on desktop
Due to abundant space, the order summary can be displayed to the right of all checkout steps. You can have it in a rectangular box with the price total plus any additional fees and a final total. If it’s just one item, you can include a thumbnail. In the case of multiple items, a list of the product titles would do just fine.
Displaying the order summary on mobile
The order summary on mobile devices is best displayed above the checkout steps.