Redesigning an Order Tracking Page for Desktop and Mobile

A “track my order” page — where a customer enters their phone number and sees their order’s status without creating an account — is a small but high-traffic page on most Bangladeshi e-commerce sites, where guest checkout is the norm. On this store, the results view was clearly built and tested only on mobile: narrow, text-only, no product images, and left mostly empty on a desktop screen.

What the original layout missed

The page worked — a customer really could see their order status — but the presentation undersold it. No product thumbnails meant a customer scanning a multi-item order had to read item names carefully to confirm what they’d actually received; billing and shipping details ran together as plain text with no visual separation; and on a desktop monitor, a mobile-width column sitting in the middle of a wide page looked unfinished.

The redesign

The fixes were deliberately scoped, not a full rebuild:

• Product thumbnails on every line item, added via the woocommerce_order_item_name filter, scoped narrowly to this one page so it doesn’t affect how items render anywhere else in WooCommerce.
• Billing and shipping restyled into a proper card, with clear visual separation from the order items table instead of running together as one block of text.
• A wider container on desktop, so the page actually uses the space available rather than floating a mobile-width column in a sea of whitespace.
• Reordered layout on mobile, moving the customer’s address above the order table — so the first thing they confirm is “is this going to the right place,” before scrolling to see what’s in the order.

Key takeaways

• A page built and only ever tested at one viewport size quietly degrades at every other size — it’s worth deliberately checking both ends.
• Scoping a template filter narrowly (to one page, one context) avoids side effects on the rest of the platform’s rendering.
• Layout order on mobile should follow what the reader needs to confirm first, not just a shrunk version of the desktop order.

Running into a similar limitation in your own WooCommerce or WordPress admin? Let’s Talk — Artintech Solution builds exactly this kind of custom store tooling.