Your customers buy from you, go away, and when they want to reorder they open their email, search for “order confirmation,” scroll through dozens of messages, find the wrong one, get frustrated, and give up. Or they just go to a competitor because it is easier.
The fix is simpler than you think. A customer order history page lets logged-in shoppers see every purchase they have made from your store in one place, with a reorder button next to each item. Two clicks. No searching. No digging through emails.
Here is how to build one without a plugin, without a developer, and without touching your theme code.
What You Need
You need three things: a customer account system (Shopify, WooCommerce, and BigCommerce all have this built in), a page on your store that pulls in the customer’s order data, and a reorder button that adds the previous items back to the cart.
If you are on Shopify, the customer accounts already track every order. You just need to surface that data on a dedicated page.
Step 1: Create a New Page Template
In your Shopify admin, go to Online Store, then Themes, then Actions, then Edit Code. Under Templates, click Add a New Template. Choose “page” and name it “order-history.”
This creates a new liquid template file called page.order-history.liquid. This is where you will pull in the customer’s past orders.
Step 2: Pull In the Customer’s Order Data
Shopify gives you access to the customer object when a shopper is logged in. You can loop through their orders and display them in a simple table.
Add this code to your template:
{% if customer %}{% for order in customer.orders %}{{ order.name }} - {{ order.total_price | money }} - {{ order.created_at | date: "%B %d, %Y" }}{% endfor %}{% endif %}
This checks if the customer is logged in, loops through their orders, and displays the order number, total, and date. If the customer is not logged in, it shows nothing.
You can style this as a table with columns for Order Number, Date, Items, Total, and a Reorder button.
Step 3: Add the Reorder Button
For each order in the loop, you can create a link that adds all the items from that order back to the cart. Shopify has a built-in endpoint for this.
The URL format is: /cart/add?ids[]=VARIANT_ID&quantity=N
You will need to loop through the line items in each order and build the URL with each variant ID and quantity. The button reads “Reorder” and links to that URL.
When the customer clicks it, all the items from that order are added to their cart in one go. They can review and checkout.
Step 4: Handle Out-of-Stock Items
One problem with reorder buttons: sometimes an item from a past order is no longer in stock. You need to handle this gracefully.
For each line item, check if the variant is still available. In Shopify Liquid, you can check {% if line_item.variant.available %}. If it is available, include it in the reorder link. If it is not, show a small note next to that item saying “Currently unavailable” and exclude it from the reorder URL.
This way the reorder button still works for the available items, and the customer knows why one item is missing.
Step 5: Add a Login Gate
If a visitor lands on this page without being logged in, they should see a prompt to log in rather than a blank page. Wrap the entire order list in a conditional:
{% if customer %} ... order list ... {% else %} Please log in to view your order history. {% endif %}
This keeps the page clean for non-logged-in visitors and functional for returning customers.
Step 6: Add It to Your Navigation
Create a new page in your Shopify admin called “Order History” and assign it the “order-history” template you just built. Then add it to your main navigation menu or your customer account dropdown.
Most stores put it under the account icon or in a sub-menu called “My Account.” It should not compete with your main shop navigation. It is a utility page for returning customers.
Step 7: Add Order Status Labels
To make the page more useful, add a status label next to each order. Shopify orders have a financial status (paid, pending, refunded) and a fulfillment status (fulfilled, unfulfilled, partially fulfilled).
Display these as small coloured badges next to the order number. Green for fulfilled, amber for partially fulfilled, grey for refunded. This gives customers a quick visual scan of their order history without clicking into each order.
What This Looks Like in Practice
A Sydney-based skincare brand added an order history page and saw their repeat purchase rate climb 18% in three months. Customers who used to search their inbox for past orders now had everything in one place. The reorder button made it frictionless. They bought the same cleanser and moisturiser every eight weeks without thinking about it.
The page took under an hour to build. No plugin. No developer. Just a template file and a navigation link.
Common Mistakes to Avoid
- Showing every order ever placed. If a customer has 200 orders, the page becomes slow and overwhelming. Paginate after 20 orders or add a year filter.
- Forgetting mobile. Test the table layout on a phone. If it does not fit, switch to a card layout where each order is a stacked block.
- Not handling variants. If a product size or colour is discontinued, the reorder button should skip it, not error out.
- Not linking to order detail pages. Customers sometimes want to see what was in a specific order. Link each order number to its detail page.
A customer order history page is one of those small additions that quietly improves your repeat purchase rate. It does not need to be fancy. A table, a reorder button, and a login gate. That is it. Build it once and it works forever.
Want more like this? Join MOKU Club for free. Weekly resources, early access to new guides, and occasional templates you can actually use. Join below.
