QR Codes are great for embedding links into your documents, and can be used to provide links to your website, special promotions, and other useful sites. People can then scan the QR code using their mobile phones' camera, to quickly go to the embedded link.
This help article shows how you can include QR codes into your Order Printer Pro templates, when using Shopify.
1- Add the necessary include tag to your template code
Copy and paste the following line to the very top or bottom of your template code in Order Printer Pro:
{% include "qrcodes" %}
For example:
This will ensure the necessary code to generate QR codes is automatically included in your template.
2- Add the placeholder to your template code, where you want the QR code to show up
a) Copy the following lines of code:
<div class="qr-code" data-qr-code-text="{{ shop.url }}" data-qr-code-size="98"></div>
<p>Visit us online</p>
b) Paste it into your template where you want the QR code to show up. For example, we recommend adding it in the same place as order notes show up:
c) By default, the QR code will embed a link to your websites homepage using {{ shop.url }}. To change this, change the text that is in the quotation marks. For example, you could change it from:
data-qr-code-text="{{ shop.url }}"
to:
data-qr-code-text="https://example.com/example"
In other words, whatever you put in quotation marks after data-qr-code-text= will be what is embedded into the QR code image.
You can also change the size (in px) of the QR code generated, by changing:
data-qr-code-size="98"
to:
data-qr-code-size="64"
d) Change the text "Visit us online" to match what you are linking to.
e) Click Save and you'll see the preview update and include your new QR code.
f) If needed, you can include multiple QR codes in the same template, by pasting the placeholder in other parts of your template and customising as needed.
If you need help with any of the above, our friendly support team is more than happy to help.