Printed receipt code editor

Note

This feature is available only to merchants using Shopify POS Pro.

You can customize your printed receipts using the code editor in your Shopify admin. With the code editor, you can create more advanced customizations using HTML, CSS, and Liquid than with the visual editor.

You can change the receipt template and the section templates used on your printed receipts. The Receipts template files are the types of receipts that you can print in your store. Sections are parts of the receipts, such as the header or footer. Sections can be reused by multiple receipts.

Considerations for using the receipt code editor

Before you use the receipt code editor, review the following considerations:

• You can use the code editor only from your Shopify admin on desktop.
• Code changes that you make apply to all POS Pro locations. However, you can add conditions to display customizations for specific locations. Learn more about using control flow tags with Liquid.
• When you switch to the code editor, you can't make any customizations to your receipt template from the Shopify POS app. You can still adjust your Printing options from the Shopify POS app from locations with the POS Pro subscription plan.
• Customizations in the code editor apply only to POS Pro locations. If you use the code editor and have POS Lite locations, then you can use the visual editor to customize the header and footer for your Lite locations.
• The files that make up your receipts contain Liquid, Shopify's templating language. Learn more about using Liquid.
• To edit the templates in the receipt code editor, you need to be familiar with HTML, CSS, and Liquid. Shopify Theme Support can help with minor adjustments within the scope of the Shopify Design Policy.
• Some types of printed receipts can't be customized.
• The code editor isn't available for any locations in Italy.

Incompatibility considerations for receipt types

Some types of printed receipts can't be customized in the receipt code editor. Receipt types that don't have a template in the code editor are incompatible for customization.

You can customize the following types of printed receipts:

• sales receipts
• gift card receipts
• gift receipt receipts

You can't customize the following receipts:

• return receipts
• exchange receipts

Additionally, all receipt types for locations in Italy are ineligible for customization.

Access the code editor

You can edit your templates using the code editor.

Steps:

1. From your Shopify admin, click Settings > Apps and sales channels.
2. From the Apps and sales channels page, click Point of sale.

3. Click Open sales channel.

4. Click Settings > Receipt Customization.

5. Click Customize receipts.

6. Click ... > Edit code.

7. In the Edit code dialogue, click Edit code.

Use custom files in your receipt template

You can use files that you upload to customize your receipts. If you have custom images that you want to print on your receipts, then you can upload them to your Shopify admin, and then use them on your customized receipts. Learn more about file uploads.

Steps:

1. From your Shopify admin, click Settings > Apps and sales channels.
2. From the Apps and sales channels page, click Point of sale.

3. Click Open sales channel.

4. Click Settings > Receipt Customization.

5. Click Customize receipts.

6. Click Content page.

7. Copy the link next to the file that you want to use in your receipt template.

8. Include the link in your template.

Reset your receipt template to default

You can reset a receipt template to the default version using the code editor.

Steps:

1. From your Shopify admin, click Settings > Apps and sales channels.
2. From the Apps and sales channels page, click Point of sale.

3. Click Open sales channel.

4. Click Settings > Receipt Customization.

5. Click the template that you want to reset.

6. Click the reset icon.

7. In the Reset the file to default modal, click Reset to confirm.

Liquid variables available in the receipt code editor

You can use Liquid to customize your printed receipt template and receipt types.

The following data objects are available to the receipt code editor:

Description of receipt data objects

Object	Description
shop	Contains the store information, such as the store name.
location	Contains the retail location information, such as address and phone number.
order	Contains the order data, including the line items, the discounts, the taxes, and the transaction information.
gift_card	Only available within the template gift_card.liquid. Contains the gift card data, including the balance, the alphanumeric code, and the content of a QR code that can be scanned by the POS app.

Liquid filters available in the receipt code editor

You can use liquid filters to makes adjustments to information in your receipt templates. For example, you can change the formatting of currency or the captialization of specific text, such as a tax code.

To apply a filter, add a pipe character | and then the filter within the block of liquid code between double curly brackets {{ }}. Filters can be applied only to blocks of liquid code.

In the following example, the filter adjusts the tax code from lowercase to uppercase.

{{ tax_line.title | upcase }}

In the example code block, product is the object, title is its property, and upcase is the applied filter. The upcase filter changes the capitalization of the value of tax_line.title to uppercase. For example, if tax_line.title has a value of Hst, then the upcase filter changes the value to HST.

Refer to the filters section from the Shopify Themes Liquid reference for details on how to use Liquid filters.

The following filters are available in the receipt code editor:

Description of receipt filters

Property	Description
t	Translates predefined labels into the language assigned to your location.
money	Formats the price in your location's currency.
escape	Escapes special characters in HTML, such as <>, ', and &, and converts the characters into escape sequences.
barcode	Generates a 1D barcode SVG.
qrcode	Generates a 2D barcode SVG.

Example of a printed receipt template code customization

You can use Liquid to add conditional messaging. This functionality is similar to saving to a single location with the visual editor. For example, your business started with a single location, and you now have several new locations. You want to highlight your original store on your printed receipts.

You can add a custom message to the header.liquid template in the Sections folder of the code editor, and use Liquid to display the message only for your flagship location.

The following code checks for the name of the location, in this case your original location called "Home", and displays the message "Welcome to our original store, opened in 1972." if the location matches the name. Receipts printed from your other locations display the message "Welcome to our store." instead.

{% if location.name == 'Home' %}
  Welcome to our original store, opened in 1972.
{% else %}
  Welcome to our store.
{% end %}