Share barcodes via Shopify notifications
Embed customer IDs using the Liquid template language
To send barcodes via automated Shopify notifications, edit your existing Shopify notification template(s). Similarly, place the barcodes on your website by editing its theme code.
The guide requires some basic understanding of HTML and Liquid.
Please don't confuse Shopify Notifications with Shopify Email. If you wish to send barcodes via a bulk email campaign, check out instructions for Shopify Email.
Share a plain Code 128 (1D barcode) image
Include the following snippet to your selected Liquid template.
Share a plain QR code (2D barcode) image
Include the following snippet to your selected Liquid template.
Share the "Add to Apple Wallet" button
Add the following snippet to share the "Add to Apple Wallet" button with the Apple pass download link.
To localise the text of the "Add to Apple Wallet" button, replace Add_to_Apple_Wallet_rgb_US-UK.png
with the selected language's file name in the snippet above. To see available localisations, download localised images. For more information, check the Add to Apple Wallet Guidelines.
Share the "Add to Google Wallet" button
Add the following snippet to share the "Add to Google Wallet" button with the Google pass link.
To localise the text of the "Add to Google Wallet" button, replace enGB_add_to_google_wallet_wallet-button.png
with the selected language's file name in the snippet above. To see available localisations, download localised images. For more information, check the Add to Google Wallet Guidelines.
Other use cases
Since barcodes are dynamically generated, you can embed any information. For example, you may want to pair QR codes with customer orders for local pick-up validation, legal requirements, etc.
Embed an order id instead of a customer id and use a second scanner in the search menu of Shopify POS (very top of the smart grid).
Embed a link to the order "Thank you" page.
Embed a link to the order admin page.
Examples
If you wish your newly activated customer to receive his/her unique barcode automatically, edit the "Customer account welcome" template. For example, you could include the image after the "You've activated your customer account. Next time you shop with us, log in for faster checkout." message.
Before:
QR code
Wallet buttons with QR code and custom text
Similarly, you could add a barcode image to other templates, such as
"Contact customer" - if you wish to email the QR code to the selected customer manually. Unfortunately, bulk email functionality is not supported.
"POS and mobile receipt" - if you wish to email a barcode in a POS receipt.
and others...
Testing
To test, I recommend creating a fake customer and invoking real Shopify notifications. Why?
Liquid template variables, e.g. {{shop.permanent_domain}} are replaced by Shopify. Sending the code snippets from this guide via email manually will not work - Liquid variables will not be replaced with the underlying values and you should see the "Expected a valid Shopify query parameter" (the app would "see" {{shop.permanent_domain}} instead of myshopify domain name such as my-shop.myshopify.com) error when trying to download mobile passes.
Sending a test email via the template preview will result in non-existent customer barcodes. No customers would be found by scanning such barcodes.
Last updated