# Share barcodes via Shopify notifications

Embed customer IDs using the [Liquid template language](https://shopify.dev/api/liquid) 

To send barcodes via automated Shopify notifications, edit your existing [Shopify notification template(s)](https://help.shopify.com/en/manual/orders/notifications/edit-template). Similarly, place the barcodes on your website by editing its [theme code](https://help.shopify.com/en/manual/online-store/themes/theme-structure/extend/edit-theme-code).

{% hint style="info" %}
The guide requires some basic understanding of HTML and Liquid.
{% endhint %}

{% hint style="danger" %}
Please don't confuse [Shopify Notifications with Shopify Email](https://community.shopify.com/c/shopify-discussions/shopify-email-versus-notifications/m-p/2379388). If you wish to send barcodes via a bulk email campaign, [check out instructions for Shopify Email](/barcodify-customer-selector/getting-started/share-app-generated-barcodes-with-customers/share-barcodes-via-bulk-messaging-services.md).
{% endhint %}

## Share a plain Code 128 (1D barcode) image

Include the following snippet to your selected Liquid template. 

```liquid
<img src="https://select-customer-barcode-prod.herokuapp.com/public-api/v1/barcodes/code128/{{shop.permanent_domain}}/{% if customer.id %}{{customer.id}}{% else %}{{'orders/' | append: order.id}}{% endif %}" />
```

## Share a plain QR code (2D barcode) image

Include the following snippet to your selected Liquid template.&#x20;

```liquid
<img src="https://select-customer-barcode-prod.herokuapp.com/public-api/v1/barcodes/qr/{{shop.permanent_domain}}/{% if customer.id %}{{customer.id}}{% else %}{{'orders/' | append: order.id}}{% endif %}" />
```

## 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.

```liquid
<a download href="https://select-customer-barcode-prod.herokuapp.com/public-api/v1/wallet/apple/{{shop.permanent_domain}}/{% if customer.id %}{{customer.id}}{% else %}{{'orders/' | append: order.id}}{% endif %}"> <img src="https://barcodify-prod.s3.amazonaws.com/public/add-to-apple-wallet/Add_to_Apple_Wallet_rgb_US-UK.png" /> </a>
```

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](https://barcodify-prod.s3.amazonaws.com/public/add-to-apple-wallet/add-to-wallet-localised-images.zip). For more information, check the [Add to Apple Wallet Guidelines](https://developer.apple.com/wallet/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.

```liquid
<a href="https://select-customer-barcode-prod.herokuapp.com/public-api/v1/wallet/google/{{shop.permanent_domain}}/{% if customer.id %}{{customer.id}}{% else %} {{'orders/' | append: order.id}}{% endif %}"> <img src="https://barcodify-prod.s3.amazonaws.com/public/add-to-google-wallet/enUS_add_to_google_wallet_add-wallet-badge.png" /> </a>
```

To localise the text of the "Add to Google Wallet" button, replace `enUS_add_to_google_wallet_add-wallet-badge.png` with the selected language's file name in the snippet above. To see available localisations, download [localised images](https://barcodify-prod.s3.amazonaws.com/public/add-to-google-wallet/add-to-wallet-localised-images.zip). For more information, check the [Add to Google Wallet Guidelines](https://developers.google.com/wallet/generic/resources/brand-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).&#x20;

```liquid
<img src="https://select-customer-barcode-prod.herokuapp.com/public-api/v1/barcodes/qr/{{shop.permanent_domain}}/{{order.id}}" />
```

Embed a link to the order "Thank you" page.

```liquid
<img src="https://select-customer-barcode-prod.herokuapp.com/public-api/v1/barcodes/qr/{{shop.permanent_domain}}/{{order_status_url | url_encode}}" />
```

Embed a link to the order admin page.

```liquid
<img src="https://select-customer-barcode-prod.herokuapp.com/public-api/v1/barcodes/qr/{{shop.permanent_domain}}/{{shop.permanent_domain | append: "/admin/orders/" | append: order.id | url_encode}}" />
```

Embed a link to the draft order admin page

```liquid
<img src="https://select-customer-barcode-prod.herokuapp.com/public-api/v1/barcodes/qr/{{shop.permanent_domain}}/{{shop.permanent_domain | append: "/admin/draft_orders/" | append: id | url_encode}}" />
```

Display barcodes to selected customers (e.g. based on a tag value)

```liquid
{% if customer.tags contains 'YOUR_TAG_VALUE' %}
    PASTE BARCODIFY CODE SNIPPET HERE 
{% endif %}
```

## 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:

```liquid
<h2>{{ email_title }}</h2>
<p>{{ email_body }}</p>
```

<figure><img src="/files/nRVUXHBbJOZMTylfUimL" alt=""><figcaption></figcaption></figure>

### QR code

```liquid
<h2>{{ email_title }}</h2>
<p>{{ email_body }}</p>
<img src="https://select-customer-barcode-prod.herokuapp.com/public-api/v1/barcodes/qr/{{shop.permanent_domain}}/{{customer.id}}" />
```

<figure><img src="/files/5g8nmsAOLNm3iib3pj8w" alt=""><figcaption></figcaption></figure>

#### Wallet buttons with QR code and custom text

```liquid
            <h2>{{ email_title }}</h2>            
            <p>{{ email_body }}</p>            

            {% comment %}
              BARCODIFY CODE, DELETE BELOW IF UNINSTALLED
            {% endcomment %}
<p>This is your custom text</p>
            <table class="row actions">
              <tr>
            <div style="margin-left: -12px;">      
              <img src="https://select-customer-barcode-prod.herokuapp.com/public-api/v1/qrcodes/{{shop.permanent_domain}}/{{customer.id}}">
            </div>
            <div>
      <a
        download
        href="https://select-customer-barcode-prod.herokuapp.com/public-api/v1/wallet/apple/{{shop.permanent_domain}}/{{customer.id}}"
      >
        <img
          style="height: 42px;"
          src="https://barcodify-prod.s3.amazonaws.com/public/add-to-apple-wallet/Add_to_Apple_Wallet_rgb_US-UK.png"
        >
      </a>
              <a href="https://select-customer-barcode-prod.herokuapp.com/public-api/v1/wallet/google/{{shop.permanent_domain}}/{{customer.id}}">
        <img
          style="height: 42px;"
          src="https://barcodify-prod.s3.amazonaws.com/public/add-to-google-wallet/enUS_add_to_google_wallet_add-wallet-badge.png"
        >
      </a>
            </div>
              </tr>  
            </table> 
            {% comment %}
              BARCODIFY CODE, DELETE ABOVE IF UNINSTALLED
            {% endcomment %}
```

<figure><img src="/files/sSSL414P85sXp0y6sVfZ" alt=""><figcaption></figcaption></figure>

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?

1. 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.
2. Sending a test email via the template preview will result in non-existent customer barcodes. No customers would be found by scanning such barcodes.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://galmis.gitbook.io/barcodify-customer-selector/getting-started/share-app-generated-barcodes-with-customers/share-barcodes-via-shopify-notifications.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.