How do I add an extra image to the footer of my Shopify Pos Pro printed receipt?

I have a customised receipt in Shopify Pos Pro, I’ve added my logo to my header and some custom text to the footer of my printed receipts.

How do I add a separate static image to the footer of my receipt?

I assume it will require me to edit the footer.liquid section of the printed receipt code?

Does anyone know the syntax for the code and where it needs to go?

I assume it may look something like this?;

Description of Image

Hello @CrawshS

By default you can simple texts on header/footer. You need to upgrade to POS pro to have more customization. You can edit code , add HTML etc.

Hi Kazi,

Yes I’m using Pos Pro. I’ve managed to sort it through a process of trial and error. I inserted the image url for the QR code above the barcode section towards the bottom of </> footer.liquid see below bold bits in italics…

{% endif %}


QR Code Review Request



If we could do better, please let US know.

We’ll do our best to put it right

{% if display_barcode_type == ‘BARCODE_2D’ %}
{% if order.qr_code_content != nil and order.qr_code_content != blank %}

{{ order.qr_code_content | qrcode }}


{% endif %}
{% elsif display_barcode_type == ‘BARCODE_1D’ %}
{% if order.barcode_content != nil and order.barcode_content != blank %}

{{ order.barcode_content | barcode }}

2 Likes

Thats great!

I’m sure there’s a neater way to do it but it worked at least

Good effort great work!

Possible code improvements, try to wrap text in either paragraph, span, or div tags to maximize compatibility.

:woman_technologist: When using paragraph or div tags
tags may not be needed for extra line breaks.

In some cases use the

 tag for specific whitespace formatting.

For the image url see the liquid file_img_url and related filters to avoid having to hardcode a url that may get stuck on an old version(?v=xxxxx parameter) of the image if you ever change it in the future.

And can help size the image

https://shopify.dev/docs/api/liquid/filters/file_img_url

In some cases instead of file see the brand assets object https://shopify.dev/docs/api/liquid/objects/brand

{% endif %}

![QR Code Review Request|200x200](upload://5eU3K1ls6bfFbKXulbDHYmE3ZTj.png)

If we could do better, please let **US** know.

We'll do our best to put it right

{% if display_barcode_type == 'BARCODE_2D' %}
 {% if order.qr_code_content != nil and order.qr_code_content != blank %}
  
 {% endif %}
{% elsif display_barcode_type == 'BARCODE_1D' %}
 {% if order.barcode_content != nil and order.barcode_content != blank %}
  
1 Like

I am trying to use your code, but couple issues.
It says the ‘if’ barcode_2d isn’t closed. If I try to put an {% end if }

I am trying to put an additional barcode image in the footer which is a discount for another visit if they bring the receipt. But I am having major issues. Any advice

I am not a coder so my advice would probably make things worse. HOWEVER.

I now use ChatGPT to do all my coding for me. Paste the entire code for your receipt template into notepad. Save it as a text file. Then upload it to chatgpt. Ask chatgpt to rewrite the code to be highly compatible and efficient. then ask it to make the changes you want (upload your barcode image to the shopify content repository and tell chatgpt the url for the file you want to add at the bottom). Tell it to center it etc. Keep using ChatGPT to make your minor amends until you’re completely happy with it.
TBH it’s worth the £20 per mth subscription price for the paid for ChatGPT just for the coding it does for me.
Keep a backup of your current layout held in notepad so you can always revert to your starting point if needed. ChatGPT does make the odd boo boo but if you tell it where it went wrong it learns.

It’s totally changed the game re modifications to all my shopify print templates - packing slips, receipts, email notifications.

Here’s an example of my current store receipt, courtesy of ChatGPT. Took me about 10 minutes of chat.

the code is only a truncated partial of a MUCH longer chunk of code for someones specific use case.
If you need this done properly reach out to me for services.

And a copy in the shopify files admin or google drive etc.
Avoid single location “backups”

:bomb: Always test end to end do not stop in the admin preview check the final result in multiple REAL email clients.
When an LLM makes a mistake in an area you have no expertise in you wont be able to tell if it’s causing a problem and it will always lie about the quality and supposed “fixes”.
Like broken emails in certain email client as email “HTML” is not like HTML for websites, or broken themes in some browsers when trying to “improve” performance etc etc.

It’s good way to silently hemorrhage money somewhere.