New Shopify Certification now available: Liquid Storefronts for Theme Developers

New Customer Page

CauaCoelho
Shopify Partner
1 0 0

I needed to create a new customer page that would be "My Orders", only with a list of orders that the customer made, I tried to create a JSON in templates but it doesn't generate a route for that. Would there be any way to create this page with authentication too?

Zazaba INC.
Reply 1 (1)
round
Shopify Partner
5 0 1
  1. Create a new page template in your Shopify theme, for example, "my-orders.liquid".

  2. In the new template, you can use the customer object to check if the customer is logged in and retrieve their orders using the Shopify.getOrders() method.

 

{% if customer %}
  <h1>My Orders</h1>
  <table>
    <thead>
      <tr>
        <th>Order Number</th>
        <th>Date</th>
        <th>Total</th>
      </tr>
    </thead>
    <tbody>
      {% for order in customer.orders %}
        <tr>
          <td><a href="{{ order.url }}">{{ order.name }}</a></td>
          <td>{{ order.created_at | date: "%B %d, %Y" }}</td>
          <td>{{ order.total_price | money }}</td>
        </tr>
      {% endfor %}
    </tbody>
  </table>
{% else %}
  <p>You need to be logged in to view your orders.</p>
{% endif %}

 







  • In your theme's navigation, create a link to the new "My Orders" page.

  • You will need to create a custom route for this new page, you can use shopify's route function to create the route for the new page.

  • you may also want to add some form of authentication for the page, so that only logged in customers can view their orders. Shopify provides a customer object that you can use to check if a customer is logged in or not, and you can use this to restrict access to the page.

 

{% if customer %}
  <h1>My Orders</h1>
  <!-- table code here -->
{% else %}
  <p>You need to be logged in to view your orders.</p>
{% endif %}
​

 



Let me know that's work for you