Adding LoyaltyLion to your Shopify Order Status

How to add LoyaltyLion to your Shopify Order Status Page

Success team avatar
Written by Success team
Updated over a week ago

Installing LoyaltyLion on your Shopify order status page will support exciting new features to help drive retention and acquisition at the post-purchase point of the customer journey. This will facilitate two key loyalty features:

  • Enhanced notifications

    • Post-purchase: Guest sign-up

    • Post-purchase: Refer a friend

To support LoyaltyLion Notifications on your order status page, which is also known as the “Thank You” page or Checkout Summary Page you will need to use Additional Scripts, please follow the steps below.

Installation Steps

🗣️ Additional Scripts only function if Checkout Extensibility is disabled for your Thank you and Order status pages

Step 1: Navigate to Settings

Step 2: Checkout

Step 3: Scroll almost to the bottom and find the "Order status page" area

Step 4: Go to the "Additional scripts" section:

Step 5: Paste the LoyaltyLion snippet into the additional scripts box 

<script>
  !function(t,n){function o(n){var o=t.getElementsByTagName("script")[0],i=t.createElement("script");i.src=n,i.crossOrigin="",o.parentNode.insertBefore(i,o)}if(!n.isLoyaltyLion){window.loyaltylion=n,void 0===window.lion&&(window.lion=n),n.version=2,n.isLoyaltyLion=!0;var i=new Date,e=i.getFullYear().toString()+i.getMonth().toString()+i.getDate().toString();o("https://sdk.loyaltylion.net/static/2/loader.js?t="+e);var r=!1;n.init=function(t){if(r)throw new Error("Cannot call lion.init more than once");r=!0;var a=n._token=t.token;if(!a)throw new Error("Token must be supplied to lion.init");for(var l=[],s="_push configure bootstrap shutdown on removeListener authenticateCustomer".split(" "),c=0;c<s.length;c+=1)!function(t,n){t[n]=function(){l.push([n,Array.prototype.slice.call(arguments,0)])}}(n,s[c]);o("https://sdk.loyaltylion.net/sdk/start/"+a+".js?t="+e+i.getHours().toString()),n._initData=t,n._buffer=l}}}(document,window.loyaltylion||[]);

  {% if shop.metafields.loyaltylion.token != nil %}
    {% if customer != nil and customer.has_account %}
      {% assign date = 'now' | date: "%Y-%m-%d %H:%M:%S%z" %}
      {% assign auth_token =
        customer.id | append: date | append: customer.email | append: shop.metafields.loyaltylion.secret | sha1 %}

      loyaltylion.init({
        token: "{{ shop.metafields.loyaltylion.token }}",
        customer: {
          id: "{{ customer.id }}",
          email: "{{ customer.email }}",
          name: "{{ customer.name }}",
          rechargeHash: "{{ customer.metafields.subscriptions.customer_string | if: customer.metafields.subscriptions.customer_string }}"
        },
        auth: {
          date: "{{ date }}",
          token: "{{ auth_token }}"
        },
      });
    {% else %}
      loyaltylion.init({ token: "{{ shop.metafields.loyaltylion.token }}" });
    {% endif %}
  {% endif %}
</script>
<script>lion.configure({ checkout: true })</script>

Step 6: Click 'save' at the bottom of the page. 

💡 This is complete and LoyaltyLion is installed on your Shopify order status page.

Deprecation of Shopify's checkout.liquid theme

Shopify is in the process of deprecating the checkout.liquid theme file from merchant stores. If you currently use the checkout.liquid method to render post-purchase notifications, we suggest you use the Order status page - Additional Scripts method detailed above from now on.

Did this answer your question?