There are two ways you can generate barcodes with this plugin

Barcode component

Adding the barcode component to a page or layout is the easiest way. Once the component is added you need to configure the settings from the component's inspector. Then you need to put the component markup on the page or layout.

//Markup for HTML and SVG barcodes
{% component 'barcode' %}

//Markup for PNG BASE 64 barcodes
<img src="data:image/png;base64,{% component 'barcode' %}" alt="barcode" />

One component represents one barcode, so if you want to add another barcode, you need to add another component with a different alias.

Twig Markup

There are three custom functions to utilize, one for each output format. These functions are barcodeHTML, barcodeSVG and barcodePNG.

The parameter for these functions is an array that contains any of this properties:

• data: Required. The data to be codified.
• type: Required The type of the barcode (see Barcode Types).
• width: Optional. The width of each bar, in pixels.
• height: Optional. The height of the barcode, in pixels.
• color: Optional. The color of the barcode:
  • For HTML and SVG any CSS color property value is valid (name, hex, rgb).
  • For PNG this need to be a rgb array ([0,0,0]).

Some examples:

//HTML barcodes
{{ barcodeHTML({data: '4445645656', type: 'C39'}) }}
{{ barcodeHTML({data: '4445645656', type: 'QRCODE', color: 'blue'}) }}
{{ barcodeHTML({data: '4445645656', type: 'CODE11', color: '#3344aa'}) }}

//SVG barcodes
{{ barcodeSVG({data: '4445645656', type: 'PHARMA2T', height: '50'}) }}
{{ barcodeSVG({data: '095830052015', type: 'C128C', width: '3', height: '45'}) }}

//PNG BASE64 barcodes
<img src="data:image/png;base64,{{ barcodePNG({data:'4445645656', type: 'C39+'})}}" alt="barcode" />
<img src="data:image/png;base64,{{ barcodePNG({data:'4445645656', type: 'QRCODE', color: [255,0,0] }) }}" alt="barcode" />

Barcode Types

The types available to generate are:

• C39 : CODE 39 - ANSI MH10.8M-1983 - USD-3 - 3 of 9.
• C39+ : CODE 39 with checksum
• C39E : CODE 39 Extended
• C39E+ : CODE 39 Extended with checksum
• C93 : CODE 93 - USS-93
• S25 : Standard 2 of 5
• S25+ : Standard 2 of 5 with checksum
• I25 : Interleaved 2 of 5
• I25+ : Interleaved 2 of 5 with checksum
• C128 : CODE 128
• C128A : CODE 128 A
• C128B : CODE 128 B
• C128C : CODE 128 C
• EAN2 : 2-Digits UPC-Based Extention
• EAN5 : 5-Digits UPC-Based Extention
• EAN8
• EAN13
• UPCA : UPC-A
• UPCE : UPC-E
• MSI : Variation of Plessey code
• MSI+ : MSI with checksum (modulo 11)
• POSTNET
• PLANET
• RMS4CC : RMS4CC (Royal Mail 4-state Customer Code) - CBC (Customer Bar Code)
• KIX : Klant index - Customer index
• IMB : Intelligent Mail Barcode - Onecode - USPS-B-3200
• CODABAR
• CODE11
• PHARMA : PHARMACODE
• PHARMA2T : PHARMACODE TWO-TRACKS
• QRCODE : QR Code
• PDF417 : PDF417 ISO/IEC 15438:2006
• DATAMATRIX : Datamatrix ISO/IEC 16022