Overview

Overview 📌

BookThatApp supports creating barcodes using the Code 39 standard. We recommend confirming that your barcode scanner supports this format. For example, Shopify barcode scanners are compatible with Code 39.

This article explains how to add barcodes to booking notification emails and e-Ticket templates, as well as how to replace barcodes with QR codes if preferred.

Embedding a Barcode in Notification Templates 📨

Open the Notification Template

1. In the app admin, navigate to Settings → Notifications.

2. Select the notification template you want to edit.

Open the template.

Insert the Barcode Image

Add an <img> tag where you want the barcode to appear in the template:

<img src="{{shop.shopify_url}}{{shop.path_prefix}}/bookings/{{booking.hashed_id}}/barcode_image.png">

This code generates a PNG image.

Supported Parameters

You can customize the barcode using the following URL parameters:

• margin – Space around the barcode (default: 0)

• height – Height of the bars (default: 100)

• color – Foreground color (default: black)

• background – Background color (default: white)

Colors can be an RGBA code or one of the predefined names listed here.

Example 1 - using defaults:

<img src="{{shop.shopify_url}}{{shop.path_prefix}}/bookings/{{booking.hashed_id}}/barcode_image.png">

Example 2 - specify margin:

<img src="{{shop.shopify_url}}{{shop.path_prefix}}/bookings/{{booking.hashed_id}}/barcode_image.png?margin=50">

Example 3 - specify margin & text color:

<img src="{{shop.shopify_url}}{{shop.path_prefix}}/bookings/{{booking.hashed_id}}/barcode_image.png?margin=50&color=red">

4. After inserting the <img> tag, hit the "Preview" button to view your barcode.

5. Finally hit Save.

The e-Ticket Barcode 🎟️

BookThatApp can attach an e-Ticket PDF to booking confirmation and reminder emails.

Unlike email notifications, barcodes are automatically generated on e-Tickets by default.

To view or edit the e-Ticket template:

1. Go to Settings → Templates.

2. Scroll down to the Ticket section.

Unlike in email reminders, a barcode is automatically generated on the e-Ticket and you can access the e-Ticket template by navigating in the app admin under Settings-> Templates-> then scrolling down under Ticket.

Adding a QR Code to the Ticket Template 📱

Instead of a barcode, you can add a QR code to the ticket. Scanning the QR code opens the booking directly, allowing you to tag it as Attended or apply any other booking tag.

How to Add a QR Code

1. Navigate to Settings → Templates → Ticket.
   
   

2. Replace the following code:
    

<div style="float:right">
  {{ booking.barcode }}
</div>

for:

<div style="float:right">
  <img src="https://api.qrserver.com/v1/create-qr-code/?size=150x150&data=https:{{shop.bookthatapp}}/admin/bookings/{{booking.id}}" />
</div>

Hit Save at the end to keep the changes.