Welcome to Zuora Product Documentation

Explore our rich library of product information

Configure barcodes in HTML templates

The Wp_Barcode merge field allows configuration of barcodes in HTML templates, supporting various types and options for customization.

The Wp_Barcode merge field accepts at least two lines of contents. The first line specifies barcode options, and the other lines are barcode contents.

The Wp_Barcode merge field is in the following format:

{{#Wp_Barcode}}
<code_type>[,optionName=optionValue]*
codeContent
{{/Wp_Barcode}}

Supported barcode types and options

The option line used in the Wp_Barcode merge field is in the following format:
<code_type>[,optionName=optionValue]* 

The Wp_Barcode merge field supports the following barcode types:

  • QR_CODE

  • CODE_128

  • CODE_39

  • CODE_39_EXT

  • AUSTRALIA_POST_CUSTOMER

  • AUSTRALIA_POST_REPLY

  • AUSTRALIA_POST_ROUTING

  • AUSTRALIA_POST_REDIRECT

  • ITF_14

  • USPS_ONE_CODE

  • ROYAL_MAIL_4_STATE

The Wp_Barcode merge field supports the following options:

Option nameDefault valueDescription
imageWidth300Integer, the width of the generated barcode image.
imageHeight300Integer, the height of generated barcode image.
codeTextPositionBOTTOM

The position of the text along with the barcode image.

The supported option values are TOP, BOTTOM, andNONE.

Configure barcodes with merge fields

When configuring barcodes in HTML templates, you can use merge fields or expressions as the content of a barcode.

You can use merge fields as the content of a barcode. For example, you can use the following merge fields to include invoice numbers as the content of a barcode:

{{#Invoice}}
{{#Wp_Barcode}}
CODE_128
*3517{{InvoiceNumber}}80*
{{/Wp_Barcode}}
{{/Invoice}}

You can also use expressions in the content of a barcode. For example, you can use the following merge field example including expressions as the content of a barcode:

{{#Invoice}}
 {{#Wp_Barcode}}
 CODE_128,codeTextPosition=NONE
 *1234{{#Wp_Eval}}
 {{Amount}} * 10|Round(0)
 {{/Wp_Eval}}5678
 {{/Wp_Barcode}}
{{/Invoice}}

Usage

To use the different barcode types, see the following descriptions and examples of each supported barcode type.

QR_CODE

This barcode type implements QR Code barcode symbology according to ISO/IEC 18004:2015.

The storage capacity of QR code symbol depends on the data type, version (1, ..., 40, indicating the overall dimensions of the symbol), and error correction level. The maximum character storage capacity for a QR code symbol that is version 40 and error correction level low is as follows:

  • 7089 numeric digits

  • 4296 alphanumeric characters

  • 2953 bytes of data (ISO/IEC 8859-1 encoding scheme)

  • 1817 Kanji characters (Shift JIS X 0208 encoding scheme)

Note that character here means individual values of the data type, also known as input mode or input character set.

For more information about the QR_CODE barcode type, see QrCode.

Example

You can use the following merge field example to generate a QR code:

{{#Invoice}}
 
 <h1>QR</h1>
 
 {{#Wp_Barcode}}
  
 QR_CODE,imageWidth=100  
 {{InvoiceNumber}}
  
 {{/Wp_Barcode}}

{{/Invoice}}

This merge field example generates an HTML img tag as follows:

<imgwidth="100" src="data:png;base64,...." />

CODE_128

This barcode type implements Code 128 barcode symbology according to ISO/IEC 15417:2007.

This barcode type supports full ASCII, which allows encoding of 8-bit Latin-1 characters that are defined in ISO 8859-1. Setting GS1 mode allows encoding characters that are defined in GS1-128, formerly known as UCC/EAN-128.

The maximum length is 170 characters.

Code 128 has a modulo-103 check digit to detect error.

For more information about the CODE_128 barcode type, see Code128.

Example

You can use the following merge field example to generate a Code 128 barcode:

{{#Invoice}}
 
 <h1>CODE_128</h1>
  
 {{#Wp_Barcode}}
  
 CODE_128,imageWidth=400,imageHeight=400
 
 {{InvoiceNumber}}
  
 {{/Wp_Barcode}}

{{/Invoice}}

CODE_39

This barcode type implements Code 39 barcode symbology according to ISO/IEC 16388:2007.

This barcode type supports the following characters:

  • All numeric digits (0-9)

  • All uppercase letters (A-Z)

  • Symbols: hyphens (-), periods (.), asterisks (*), dollar signs ($), slashes (/), plus signs (+), percent signs (%), and space character

The maximum capacity of this barcode type is unlimited, and it usually contains 20 to 23 alphanumeric characters.

The standard does not require a check digit but a modulo-43 check digit can be added if required.

For more information about the CODE_39 barcode type, see Code3Of9.

Example

You can use the following merge field example to generate a Code 39 barcode:

{{#Invoice}}
 
 <h1>CODE_39</h1>
  
 {{#Wp_Barcode}}
  
 CODE_39,imageWidth=100,imageHeight=100
 
 {{InvoiceNumber}}
  
 {{/Wp_Barcode}}

{{/Invoice}}

CODE_39_EXT

This barcode type implements Code 3 of 9 Extended, also known as Code 39e and Code39+.

This barcode type supports encoding of all characters in the 7-bit ASCII table.

A modulo-43 check digit can be added if required.

For more information about the CODE_39_EXT barcode type, see Code3Of9Extended.

Example

You can use the following merge field example to generate a Code 3 of 9 Extended barcode:

{{#Invoice}}
 
 <h1>Code_39_ext</h1>
 
 {{#Wp_Barcode}}
  
Code_39_ext,imageWidth=100,imageHeight=100
 
 {{InvoiceNumber}}
  
 {{/Wp_Barcode}}

{{/Invoice}}

ITF_14

This barcode type implements Deutsche Post Leitcode, a variant of the Interleaved 2 of 5 symbology. Interleaved 2 of 5 is a member of the Code 2 of 5 symbology family.

This barcode type supports only number digits 0-9, and it requires a 13-digit numerical input. The check digit is automatically calculated. If the input is less than 13 digits, zeros are appended in front of the given input.

For more information about the ITF_14 barcode type, see Code2Of5.

Example

You can use the following merge field example to generate a corresponding barcode:

<h1>ITF_14</h1>

{{#Wp_Barcode}}


ITF_14,imageWidth=100,imageHeight=100



1234567890123



{{/Wp_Barcode}}

USPS_ONE_CODE

This barcode type implements USPS OneCode, also known as Intelligent Mail Barcode, according to USPS-B-3200F. OneCode is a fixed length (65-bar) symbol, which combines routing and customer information in a single symbol.

This barcode type supports only numeric digits and contains a 20-digit tracking code followed by a routing code that includes the delivery ZIP code, in case it is 0, 5, 9, or 11 digits long.

The maximum length is 32 characters.

For more information about the USPS_ONE_CODE barcode type, see UspsOneCode.

Example

You can use the following merge field example to generate a USPS OneCode barcode:

<h1>USPS_ONE_CODE</h1>

{{#Wp_Barcode}}

USPS_ONE_CODE,imageWidth=100,imageHeight=100

12345678901234567890-12345678901
{{/Wp_Barcode}}

ROYAL_MAIL_4_STATE

This barcode type implements Singapore Post 4-State Postal Code, which is identical to the Royal Mail 4-State Customer Code (CBC).

This barcode type supports the following characters:

  • All numeric digits (0-9)

  • All uppercase letters (A-Z)

The maximum length is 68.58 mm (when encoding a seven-digit code that includes start and stop bars, an international prefix, a delivery point suffix, and a check digit at 20 bars per inch). The density of the code is 20 to 24 bars per 25.4 mm. A modulo-6 check digit is calculated and added.

For more information about the ROYAL_MAIL_4_STATE barcode type, see RoyalMail4State.

Example

You can use the following merge field example to generate a CBC barcode:

<h1>ROYAL_MAIL_4_STATE</h1>

{{#Wp_Barcode}}

ROYAL_MAIL_4_STATE,imageWidth=100,imageHeight=100


221BBakerstreet


{{/Wp_Barcode}}

Restrictions and limitations

When configuring barcodes in HTML templates, keep the following restrictions and limitations in mind:

  • You cannot use the Wp_Barcode function in the Text box. Instead, you can use an HTML box. The Wp_Barcode function accepts multiple lines of text as its input, internally, \n is used to separate lines. If you use the function in a Text box, the new line is interpreted as an HTML tag, <br/> , so that the Wp_Barcode function will receive a text argument with HTML tags, which is not what you expect.

  • Image size and resolution Currently, you cannot specify the image resolution, DPI (dots per inch). If you need a higher resolution, one workaround is to generate a bigger image and show it with smaller width and height attributes, for example: <style> .barcode>img { width: 200px!important; # use !important to override the inline style of the generated img tag. } </style> <div class="barcode"> {{#Wp_Barcode}} CODE_128,imageWidth=400 1234567890 {{/Wp_Barcode}} </div>