Is there a way to sort product variant metafields?

Is there a way to sort product variant metafields?

niceeee
Shopify Partner
308 4 26

niceeee_0-1736924265095.png

I want to sort the shelf example

03-15-J1
03-01-T2

The first item in the Order Printer app should be 
03-01-T2
then next is 03-15-J1

This is the code

<div>
  <div style="text-align: center;">
    <img style="width: 15em;" src="https://cdn.shopify.com/s/files/1/0531/3419/6927/files/ConvertOut-Resized-viber_image_2024-05-28_10-37-41-516.jpg?v=1716969049">
  </div>  
  <div class="columns" style="text-align: right; font-size: 15px;">
    <div>
      <p style="text-align: right; margin: 0;">
        Order {{ order.order_name }}<br />
        {% if order.po_number %}PO # {{ order.po_number }}<br />{% endif %}
        {{ "now" | date: "%B %e, %Y" }}
      </p>
    </div>
  </div>

  <div class="columns" style="margin-top: 1.5em;  font-size: 15px;">
  {% if order.billing_address %}
  <div class="address">
    <strong>Bill to</strong>
    {{ order.billing.name }}
    {{ order.billing_address | format_address  }}
  </div>
  {% endif %}
  {% if order.shipping_address %}
  <div class="address">
    <strong>Ship to</strong>
    {{ order.shipping_address | format_address  }}
    {% if order.shipping_address.phone %}{{ order.shipping_address.phone }}{% endif %}
  </div>
  {% endif %}
</div>
<hr />
<h2>Order Details</h2>
<table class="table-tabular" style="margin: 1em 0 0 0;">
  <thead>
    <tr>
      <th style=" font-size: 15px;">SKU</th>
      <th style=" font-size: 15px;">Item</th>
      <th style=" font-size: 15px;">Variant</th>
      <th style=" font-size: 15px;">Vendor Code</th>
      <th style=" font-size: 15px;">Qty</th>
      <th style=" font-size: 15px;">Shelf</th>
    </tr>
  </thead>
  <tbody>
    {% for line_item in order.line_items %}
      <tr>
        <td style=" font-size: 15px;">{{ line_item.sku }}</td>
  
        <td style=" font-size: 15px;" >{{ line_item.title }}</td>
        <td style=" font-size: 15px;">{{ line_item.variant.option1 }}</td>
        <td style=" font-size: 15px;">{{ line_item.custom.vendor }}</td>
        <td style=" font-size: 15px;">{{ line_item.quantity }}</td>
        <td style=" font-size: 15px;">
          {{ line_item.variant.metafields.variant.bin_location }}
        </td>
      </tr>
    {% endfor %}
    
</table>

{% if order.note %}
<h2>Note</h2>
<p>{{ order.note }}</p>
{% endif %}

 

Replies 7 (7)

rajweb
Shopify Partner
585 49 115

Hey @niceeee ,

To sort the products by the metafield bin_location (e.g., 03-01-T2 or 03-15-J1) in ascending order, you will need to first extract and sort these values. Since Shopify Liquid does not have native sorting functionality for complex strings, you can use JavaScript or pre-sort the data outside Shopify. However, if your data is directly fetched in Shopify Order Printer, here's how you can implement sorting using Liquid:

Updated Code with Sorting Logic:

Add this sorting logic to your Liquid template:

 

{% assign line_items = order.line_items | sort: "variant.metafields.variant.bin_location" %}

<h2>Order Details</h2>
<table class="table-tabular" style="margin: 1em 0 0 0;">
  <thead>
    <tr>
      <th style="font-size: 15px;">SKU</th>
      <th style="font-size: 15px;">Item</th>
      <th style="font-size: 15px;">Variant</th>
      <th style="font-size: 15px;">Vendor Code</th>
      <th style="font-size: 15px;">Qty</th>
      <th style="font-size: 15px;">Shelf</th>
    </tr>
  </thead>
  <tbody>
    {% for line_item in line_items %}
      <tr>
        <td style="font-size: 15px;">{{ line_item.sku }}</td>
        <td style="font-size: 15px;">{{ line_item.title }}</td>
        <td style="font-size: 15px;">{{ line_item.variant.option1 }}</td>
        <td style="font-size: 15px;">{{ line_item.custom.vendor }}</td>
        <td style="font-size: 15px;">{{ line_item.quantity }}</td>
        <td style="font-size: 15px;">
          {{ line_item.variant.metafields.variant.bin_location }}
        </td>
      </tr>
    {% endfor %}
  </tbody>
</table>

 

With over 8 years of experience, I can help you with all related problems and fixes. Please don't hesitate to reach out via email so we can discuss more in detail. Thanks!"

Feel free to let me know if you'd like any further adjustments!

If I was able to help you, please don't forget to Like and mark it as the Solution!

Best Regard,
Rajat

-Need a Shopify developer?
https://rajatweb.dev/
Email: rajat.shopify@gmail.com
niceeee
Shopify Partner
308 4 26

where can I add that code is that in my order printer liquid?

rajweb
Shopify Partner
585 49 115

Yes, you can add the updated code directly in the Order Printer template in your Shopify admin. Here's how you can do it:

Steps to Update the Order Printer Template:

1. Log in to your Shopify Admin:

2. Go to Apps in the left-hand menu.

3. If the Order Printer app is installed:

- Open the app.

- Navigate to the template you want to modify (e.g., Invoice, Packing Slip, etc.).

4. Edit the Template:

- Locate the section in the template where the table for order details is defined.

- Replace the <table> code for the order details with the updated code I provided above.

- Specifically, ensure the sorting logic (assign sorted_line_items = order.line_items | sort) is added before the <table> element.

- Save the template after making the modifications.

 

 

If you encounter any issues or need help locating the right section in the template, feel free to share the exact name of the Order Printer template you're editing. I'll gladly assist you further!

You can also send me a message via email, and I’ll provide support with my best experience. Thank you!

-Need a Shopify developer?
https://rajatweb.dev/
Email: rajat.shopify@gmail.com
niceeee
Shopify Partner
308 4 26

niceeee_0-1737092659265.png

Hi still the shelf can't sort from 1 - increment onwards

 

rajweb
Shopify Partner
585 49 115

Hey @niceeee ,

I understand that you're experiencing issues with sorting the "Shelf" column in your order template from smallest to largest. I'd be happy to assist you in resolving this.

Could you please send me a message via email? This will allow me to assist you more effectively. I can then provide detailed instructions or a customized solution to ensure your requirements are met.

Looking forward to your response so we can address this promptly.

-Need a Shopify developer?
https://rajatweb.dev/
Email: rajat.shopify@gmail.com

fedora_the_expl
Shopify Partner
3 0 0

Can you try this, and see if this works

{% assign sorted_line_items = order.line_items | map: 'variant.metafields.variant.bin_location' | zip: order.line_items | sort: 0 %}

<h2>Order Details</h2>
<table class="table-tabular" style="margin: 1em 0 0 0;">
  <thead>
    <tr>
      <th style="font-size: 15px;">SKU</th>
      <th style="font-size: 15px;">Item</th>
      <th style="font-size: 15px;">Variant</th>
      <th style="font-size: 15px;">Vendor Code</th>
      <th style="font-size: 15px;">Qty</th>
      <th style="font-size: 15px;">Shelf</th>
    </tr>
  </thead>
  <tbody>
    {% for item in sorted_line_items %}
      <tr>
        <td style="font-size: 15px;">{{ item[1].sku }}</td>
        <td style="font-size: 15px;">{{ item[1].title }}</td>
        <td style="font-size: 15px;">{{ item[1].variant.option1 }}</td>
        <td style="font-size: 15px;">{{ item[1].custom.vendor }}</td>
        <td style="font-size: 15px;">{{ item[1].quantity }}</td>
        <td style="font-size: 15px;">{{ item[0] }}</td>
      </tr>
    {% endfor %}
  </tbody>
</table>

  

niceeee
Shopify Partner
308 4 26

not working