Barcode Generator Widget

Business Background

A barcode is a machine-readable code consisting of numbers and parallel lines of varying width, while a QR code is an array of black and white squares.

Titan Solution

You can configure the barcode/QR code widget to satisfy your business needs with just a few clicks, without any coding.

• Titan supports barcode 128, a high-density linear barcode symbology defined in ISO/IEC 15417:2007. It can generate alphanumeric or numeric-only barcodes representing all 128 ASCII code characters (numbers, upper-case/lower-case letters, symbols, and control codes).
• Barcode 128 is commonly used for shipping labels, ID cards, USPS applications, and some medical applications.
• A barcode stores information in a line (in the horizontal direction), while a QR code stores information two-dimensionally: in both horizontal and vertical directions. Therefore, a QR code shows substantially more information than a barcode.

How to Guide

1. Click the + icon to add an element.
2. Under Widgets, drag the Generator widget to the canvas.

3. Use one of the following methods to configure the widget.
   • Use a Salesforce Get
   • Use an Affected Element

Use a Salesforce Get

1. Use the Gear icon to open the Project settings.
2. Select the Salesforce option. The Salesforce integration screen opens.

3. Configure a Get integration.

4. Under Mapping, use the drop-down list to select a Salesforce field for the Generator element and click the Apply button.

5. Click the Close button.
6. Save and Preview the project.

The barcode or QR is shown when the page opens.

Use an Affected Element

In this example, the generator is added as an affected element action.

1. Add a button to the project.
2. Click the On Click Action icon. The On Click action screen opens.

3. Click the + icon. The Add Node screen opens.

4. Select the Affected Elements option and click the Next button. The Add Node/ Affected Elements screen opens.

5. If necessary, search for the Generator element and click the Barcode Generator checkbox.

6. Use the Action drop-down list to select one of the following:

• Set value. This is a static value that you must add to the field.
  • Add a ULR in the following format: www.websitename.com.

• Set value from: The value is set from another element that you must also select.

7. Click the Apply button.
8. Insert a tag if necessary and click the Insert button.
9. Save and Preview the project.

When the user opens the webpage, the barcode element is empty.

When the user clicks on the button, the barcode or QR code is generated: