Skip to content

Instantly share code, notes, and snippets.

@magician11
Last active August 31, 2023 06:12
Show Gist options
  • Save magician11/bb78111647af5e96c901 to your computer and use it in GitHub Desktop.
Save magician11/bb78111647af5e96c901 to your computer and use it in GitHub Desktop.
How to create a reorder button in Shopify's Liquid
{% for order in customer.orders %}
{% assign reorder_url = "" %}
{% for line_item in order.line_items %}
{% capture reorder_url %}{{ reorder_url | append: line_item.variant_id | append: ':' | append: line_item.quantity | append: ',' }}{% endcapture %}
{% endfor %}
<a href="{{ '/cart/' | append: reorder_url }}" class="button tiny">reorder</a>
{% endfor %}
@ADTC
Copy link

ADTC commented Aug 11, 2022

@ADTC
Copy link

ADTC commented Feb 2, 2023

@rose-abc you need to have that key in your language files. For English, it may be en.default.json and for other languages, it will be xx.json where xx is the ISO code for the language.

Otherwise you can also replace {{ 'customer.orders.reorder' | t }} with a fixed text like Reorder. Note: If you do this, it won't change even if your site changes language.

Similarly, you need to apply the correct class for the button as well, in the code class="btn btn--filled". Look at the classes used in the existing buttons.

General warning: Don't copy-paste code from the internet without understanding what it does. In some cases, you could do irreversible damage.

@robin-natale
Copy link

@magician11 I would suggest the following edits to avoid whitespace in the url. Adding the strip property, some hypen into the capture and appending the cart url from the start worked much better for me, and stopped many errors.

{% for order in customer.orders %}

  {% assign _cart = "/cart/" %}
  {% assign reorder_url = "" %}

  {% for line_item in order.line_items %}
    {%- capture reorder_url -%}
      {{ reorder_url | append: _cart | append: line_item.variant_id | append: ':' | append: line_item.quantity | append: ',' | strip }}
    {%- endcapture -%}
  {% endfor %}

  <a href="{{ reorder_url | strip }}" class="button tiny">{{ 'customer.orders.reorder' | t }}</a>
{% endfor %}

@RajvirS99
Copy link

This is a great help!
Thanks

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment