Skip to main content
Open the add-on’s Builder page.
Builder
  1. Open: load one of your saved templates.
  2. Page size and orientation of the template.
  3. Template menu: Library, Save as new, Export, Import and Reset add-on.
  4. Sizes, Zones and Watermark: custom page sizes, header and footer bands, and the watermark. Beside them are Undo, Redo and Clear.
  5. Print, Preview and Save.
  6. Add: the seven element types.
  7. Sample data: pick a flow and a task, so bound elements show real values and the task’s fields can be browsed.
Under the page are Grid, Snap, Rulers, Pan and the zoom controls. The ? button lists keyboard shortcuts.

​
Elements

Click an element type under Add to place it on the page. Each barcode format checks its value: EAN13 needs 12–13 digits, EAN8 7–8, UPC 11–12, ITF14 13–14; CODE39 accepts A–Z, 0–9 and - . $ / + % and space.

​
Selecting and editing elements

  • Click an element to select it. Its settings appear under Properties on the right, starting with its position (X, Y) and size (Width, Height).
  • Drag an element to move it, or drag its handles to resize it.
  • Use the arrow keys to move it by one, or Shift and an arrow key to move it by ten.
  • Hold Ctrl (Cmd on a Mac) and click to select several elements.
  • Press Tab to step through the elements on the page.
Text properties

​
Binding to task data

  1. Under Sample data, pick a flow and a task.
  2. Select an element and set Value to Task field.
  3. Pick the field. The element shows that task’s value.
For text, you can also type {{fieldName}} inside the Content to substitute a value in the middle of a sentence.
Sample data
The field list shows every field the task carries, with its type (string, number, object, array). Click Insert to put a field into the selected element, or copy its path.
Load a sample task first: the field list and the table’s Quick list are empty until a task is picked.

​
Tables

Select a table to set where its rows come from.
Table properties
  1. Rows from: the path to a list in the task, such as items or billItem.items. Quick lists the lists found in the loaded task.
  2. Columns: each with a Label and a Field key. Click Auto detect to create columns from the first row, Add column to add one, or remove one.
  3. Formatting per column: none, Currency, Number or Date.
  4. Header background, Show cell borders, Show header border and Shade alternate rows.

​
Multi-page templates

  • Click Page next to the page tabs to add a page. Each page is labelled Page 1, Page 2 and so on, with a button to delete it.
  • Elements belong to the page they are placed on. Ctrl+A selects everything on the current page only.
  • Deleting a page also deletes the elements on it.
Click Zones.
Header and footer
Set the Header height and Footer height. Any element placed inside either band repeats on every page, which suits logos, document titles and page numbers. Set a height to zero to turn that band off. Use {{pageNumber}} and {{totalPages}} in a text element to print “Page 1 of 3”. They stay as typed on the Builder page and are filled in on every page of the PDF.

​
Watermark

Click Watermark.
Watermark
Turn on Show a watermark on every page, then set the Text, Font size, Rotation, Opacity and Colour. The watermark looks the same on the page, in the preview and in the PDF.

​
Conditional visibility

Select an element and, under Visibility, choose Conditional instead of Always visible.
Conditional visibility
Pick a Field, an Operator and a Value: When the condition is not met for the sample task, the element is dimmed on the page so you can still select it. In the preview and the PDF it is left out.

​
Grid, snap and alignment

  • Grid (Ctrl+G) shows grid dots; Snap lines elements up with the grid.
  • Rulers shows measurements; Pan lets you drag the page around.
  • Ctrl+Shift+H and Ctrl+Shift+V align the selected elements horizontally or vertically.

​
Keyboard shortcuts

Click ? to see them.
Keyboard shortcuts
On a Mac, use Cmd instead of Ctrl.

​
Saving templates

Click Save, give the template a Name and an optional Description, and click Save. To keep the original and save your changes as a copy, choose Template › Save as new.
Save template
Templates are stored for your organization, not in your browser, so everyone with access sees them.

​
Template library

Choose Template › Library.
Template library
  • Saved: your templates, with when each was saved. Open one to load it, or delete it.
  • Samples: ready-made layouts to start from: Sample invoice, Sample delivery receipt and Sample thermal receipt (80 mm).

​
Export and import

  • Template › Export downloads the current template as a .json file, with its elements, pages, page size, watermark and header/footer bands.
  • Template › Import loads a template from such a file, for example to copy it to another organization.
Template menu

​
Page size and orientation

Pick the Page size and Orientation (portrait or landscape) at the top of the Builder.
Page sizes
Click Sizes to add your own size, with a Name and a Width and Height in millimetres. Custom sizes can be edited and deleted, and appear in the page size list.
Custom page sizes