How can I display shipping method and tracking number in order history?

[ariesto]

Hi Everyone, 

I want to show Shipping method & tracking number on the order history table, by doing this, customers can immediately see the shipping method & tracking number for each order in the order history list.

Is this possible?

thank you

[Lixon_Louis]

@ariesto refer https://shopify.dev/docs/themes/liquid/reference/objects/order#order-shipping_methods

[ariesto]

@Lixon_Louis Thank you,

So, I tried to edit customer/account.liquid

         {%- if customer.orders.size != 0 -%}
            {%- paginate customer.orders by 20 -%}
               <table class="responsive-table orders-table">
                  <thead>
                    <tr>
                      <th scope="col">{{ 'customer.orders.order_number' | t }}</th>
                      <th scope="col">{{ 'customer.orders.date' | t }}</th>
                      <th scope="col">{{ 'customer.orders.payment_status' | t }}</th>
                      <th scope="col">{{ 'customer.orders.fulfillment_status' | t }}</th>
                      <th scope="col">{{ 'customer.orders.total' | t }}</th>
                    </tr>
                  </thead>
                  <tbody>
                    {%- for order in customer.orders -%}
                      <tr>
                        <th data-label="{{ 'customer.orders.order_number' | t }}" scope="row">
                          <a href="{{ order.customer_url }}" class="btn btn--secondary btn--small js_add_ld" aria-label="{{ 'customer.orders.order_number_link' | t: number: order.name }}">{{ order.name }}</a>
                        </th>
                        <td data-label="{{ 'customer.orders.date' | t }}">{{ order.created_at | time_tag: format: 'date' }}</td>
                        <td data-label="{{ 'customer.orders.payment_status' | t }}">{{ order.financial_status_label }}</td>
                        <td data-label="{{ 'customer.orders.fulfillment_status' | t }}">{{ order.fulfillment_status_label }}</td>
                        <td data-label="{{ 'customer.orders.total' | t }}">{{ order.total_price | money_with_currency }}</td>
                      </tr>
                    {%- endfor -%}
                  </tbody>
               </table>
              {%- if paginate.pages > 1 -%}{% render 'pagination', paginate: paginate, cl_a:' js_add_ld' %}{%- endif -%}
            {%- endpaginate -%}
         {%- else -%}
            <div class="shopify-message"><i class="facl facl-ok"></i><a class="btn_link fwsb tu mr__10" href="{{routes.all_products_collection_url | sort_by: 'best-selling'}}">{{ 'customer.make_order' | t }}</a> {{ 'customer.orders.none' | t }}</div>
         {%- endif -%}

And put this code for table column heading

<th scope="col">{{ 'customer.orders.shipping_method' | t }}</th>

and this for table content

<td data-label="{{ 'customer.orders.shipping_method' | t }}">{{ fulfillment.tracking_number }}</td>

but the tracking number data does not appear.

I am still new in coding, please advise thank you

[Lixon_Louis · Accepted solution]

Try these instead @ariesto 

 <th>Shipping Method</th>

<td> 
    {%- for line_item in order.line_items -%}
        <div>
            {{ line_item.fulfillment.tracking_company }}
            {%- if line_item.fulfillment.tracking_number -%} #{{ line_item.fulfillment.tracking_number }} {%- endif -%}
        </div>
    {%- endfor -%}
</td>

[ariesto]

@Lixon_Louis It's work, thanks!

[Shop2000]

Hello,

 this is returning the same data twice if there are 2 products in the order.

Is there any way to prevent this?

Thanks

[RogeroK]

i know it's a very late reply but i went through this lately and i fixed it simply by breaking the FOR loop, i'm leaving this reply in case anyone came around this thread looking for hints :

---

<td> 
  {%- for line_item in order.line_items -%}
  <div>
    {% if line_item.fulfillment.tracking_number %}
      {{ line_item.fulfillment.tracking_company }}
      <a href="{{ line_item.fulfillment.tracking_url }}">Track Order</a>
    {% endif %}
  </div>
    {% break %}  {% comment %} break is needed to exit the for loop after 1 iteration 
                 only needed to show the Tracking number only once {% endcomment %}
  {%- endfor -%} 
</td>​

---

[Shoplindens]

Can you tell me where to add this code. I almost have it!

[RogeroK]

the code should be added to the "templates -> Customers\account.liquid" or "Sections\account.liquid" usually, it depends on your theme in use but the idea is to find the file with the code for the customer account's page.

i will leave my code as an example so you can see where it goes and apply it to your code :

{% if customer.orders.size > 0 %}
          {% paginate customer.orders by 20 %}
            <table class="account-table account-order-list">
              <thead>
                <tr>
                  
                  {% comment %} mod by Rogero Start
                  Table Fields Re-Ordered and Shipping Method + Tracking Added
                  {% endcomment %}
                  <th>{{ 'customers.account.order' | t }}</th>
                  <th>{{ 'customers.account.total' | t }}</th>
                  <th>{{ 'customers.account.payment' | t }}</th>
                  <th>{{ 'customers.account.fulfillment' | t }}</th>
                  <th>Carrier / Tracking</th>
                  {% comment %} mod by Rogero End {% endcomment %}
                  
                </tr>
              </thead>

              <tbody>
                {% for order in customer.orders %}
                  <tr>
                    <td class="account-order-number">
                      {%- capture order_link -%}
                        {{ order.name }} - {{ order.created_at | date: format: 'short_day_month_year' }}
                      {%- endcapture -%}

                      {{ order_link | strip_newlines | link_to: order.customer_url, order.name }}
                    </td>
                    <td class="account-order-list-total">
                      <span class="money">{{ order.total_price | money }}</span>
                    </td>
                    <td class="payment-status--{{ order.financial_status }}">
                      {{ order.financial_status_label }}
                    </td>
                    <td class="fulfillment-status--{{ order.fulfillment_status }}">
                      {{ order.fulfillment_status_label }}
                    </td>

                    {% comment %} mod by Rogero Start {% endcomment %}
                    <td> 
                      {%- for line_item in order.line_items -%}
                            <div>
                              {% if line_item.fulfillment.tracking_number %}
                                {{ line_item.fulfillment.tracking_company }}
                                <a href="{{ line_item.fulfillment.tracking_url }}">Track Order</a>
                              {% endif %}
                            </div>
                            {% break %}  {% comment %} break is needed to exit the for loop after 1 iteration only needed to show the Tracking number only once {% endcomment %}
                       {%- endfor -%} 
                    </td>
                    {% comment %} mod by Rogero End {% endcomment %}

                  </tr>
                {% endfor %}
              </tbody>
            </table>

            {% render 'pagination', paginate: paginate %}
          {% endpaginate %}
        {% else %}
          <p class="empty">{{ 'customers.account.empty' | t }}</p>
        {% endif %}
      </div>