Barcode Generator Widget

Business Background

Add a barcode or QR (Quick Response) code generator to a web project. A barcode is a machine-readable code that consists of numbers and parallel lines of varying width, while a QR code is a machine-readable code that consists of an array of black and white squares.

Titan Solution

You can configure the barcode/QR code widget to satisfy your business needs in a few clicks with no code.

  • 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, for example, 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 Video

Coming soon.

How to Guide

  1. Click on the + icon to add an element.
  2. Under Widgets, drag the Generator widget to the canvas.
Generator widget
Generator widget
  1. Use one of the following methods to configure the widget.
Generator widget
Generator widget

Use a Salesforce Get

  1. Use the Gear icon to open the Project settings.
  2. Select the Salesforce option. The Salesforce integration screen opens.
Salesforce option
Salesforce option
  1. Configure a Get integration.
Salesforce Integration screen
Salesforce Integration screen
  1. Under Mapping, use the drop-down list to select a Salesforce field for the Generator element and click the Apply button.
Mapping
Mapping
  1. Click the Close button.
  2. Save and Preview the project.

The barcode or QR is shown when the page opens.

Example
Example

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.
On Click Action icon
On Click Action icon
  1. Click the + icon. The Add Node screen opens.
+ icon
icon
  1. Select the Affected Elements option and click the Next button. The Add Node/ Affected Elements screen opens.
Add Node screen
Add Node screen
  1. If necessary, search for the Generator element and click the Barcode Generator checkbox in the list.
Add Node/ Affected Elements screen
Add Node/ Affected Elements screen
  1. Use the Action drop-down list to select one of the following:
  • Set value. This is a static value that you must add in the field.
    • Add a ULR in the following format: www.websitename.com.
Set value option
Set value option
  • Set value from: The value is set from another element that you must also select.
Set value from option
Set value from option
  1. Click the Apply button.
  2. Insert a tag if necessary and click the Insert button.
  3. Save and Preview the project.

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

Empty Barcode element
Empty Barcode element

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

Example

Hidden Title

Need more help?