Skip to content
DE EN
Docs navigation

Your first template in 15 minutes

Template Editor Part 1, Operation and working environment

Beginner · approx. 15 min read

Based on ESLEasy_TemplateEditor V2.7, as of 2025-09-03

Prerequisites

  • ESL-Easy Manager installed
  • At least one article record in the product database (see the "Data import" guide)
  • An ESL label for testing

Templates are the core of ESL-Easy: they determine how a label looks. In this guide you build your first template, from resolution through test data to a live test on the label.

What is a template?

Before you open the editor, one thing that explains a lot:

Templates are ordinary text files. They contain the source code from which ESL-Easy generates the graphical label content. In theory you could write a template in any text editor, the Template Editor simply makes it considerably more convenient. It is part of the ESL-Easy Manager and is started from its main menu.

Remember the storage location: All templates must be in the configured folder. Default: \ESLEasy\Templates. If a template is stored elsewhere, ESL-Easy will not find it.

Windows Notepad with the file Doku_Beispiel_Text.tpl containing a single line with a TEXT command and the data field {ITEMNO}
A template is pure text, here a single TEXT line in a normal editor

Source: ESLEasy_TemplateEditor V2.7 (03.09.2025), “Allgemeines”, p. 5.


The working environment

The editor consists of three areas, and they belong together.

The Template Editor window: source code of the example template on the left, the object inspector next to it, the icon bar and the graphical 400x300 label with Apfelschorle 14.99 on the right, the test data with field list at the bottom
The three areas of the editor: source code, graphical editor and data
  • Left: the source code. Every input appears with a short delay after the last keystroke in the graphical editor.
  • Right: the graphical editor. Objects can be changed directly with the mouse.
  • Bottom: the data. Test data that you link to the template.

You work in both directions: type in the source code and see the result on the right, or move an object with the mouse on the right and watch the values update on the left. It is the same content in two views.

Useful basic functions

FunctionOperation
Font size source code/dataCtrl + mouse wheel
Indent / outdentTAB / Shift + TAB (with selected text)
Find and replaceIn the source text or in the payload data
Special charactersList shown via button, transfer into source code or data

Source: ESLEasy_TemplateEditor V2.7, “Quellcode-Editor”, p. 6.


Step 1, Create a new template (Config)

When creating a template, the “Template data” dialog appears (“Config” button). It asks for two things, both of which matter, and additionally sets the rotation.

Dialog Template data with the LabelID field and the Query button, the type list with ZOC (400x300), the fields resolution X 400 and Y 300, number of DataIDs 1 and rotation
The “Template data” dialog (“Config” button): This is where the template resolution is set

The resolution

A template is always created for exactly one resolution (pixels horizontal × vertical). When a label is later scanned, only templates with a matching resolution are offered (exception: override in the app).

Two ways to set the resolution:

  1. Select a type from the list
  2. Enter a label ID and click “Query”, the resolution is then determined from the label

Scanning a label is only possible in the app, not in the desktop editor.

LINKEDDATAIDS

This defines how many DataIDs, i.e. how many articles, this template requires.

<CMD="LINKEDDATAIDS"><COUNT="1">

For a normal price tag, COUNT="1" is used. For a variable number of articles, specify multiple values separated by commas:

<CMD="LINKEDDATAIDS"><COUNT="1,2,3,4">

→ 1, 2, 3 or 4 DataIDs must be captured.

The dialog can be opened again at any time via “Config” (the fields are then empty, the valid values are in the source code), and all values can also be changed directly in the source code. You are not locking yourself in here.

Source: ESLEasy_TemplateEditor V2.7, “Neues Template erstellen — Config”, pp. 22–23; LINKEDDATAIDS, p. 28.


Step 2, Create test data

First, the most important point: Test data does not affect the real data in the database. You can experiment here safely.

The one rule

Test data always has the same form:

<PRICE="12,99">

Angle bracket, field name, equals sign, content in quotation marks.

In the template you reference it with curly braces:

{PRICE}

Angle brackets to define, curly braces to use. That is the rule where most beginners fail.

A complete example:

<CMD="TEXT"><Y="133"><X="9"><WIDTH="73"><HEIGHT="15"><TEXT="ItemNo: {ITEMNO}"><COLOR="BLACK"><FONT="Calibri"><FONTSIZE="12">
Data area of the Template Editor: query DataID 10101, the test data is formatted one field per line such as __DESCRIPTION, BESCHREIBUNG, __DATAID, PFAND, ARTNR, INHALT, PREIS and GRUNDPREIS, the field list on the right
Test data in the format , here retrieved from the product database

Retrieving data

You can type test data manually or retrieve it directly, from the ESL-Easy product database, from Excel/CSV files or from a connected system. Output goes to the currently active tab.

For Excel/CSV with multiple records you can enter a row number or browse through the rows. For CSV, the encoding can be specified when reading.

To read Excel files in the Template Editor, a locally installed Microsoft Excel is required.

Do not confuse this with the FileImporter/BulkImporter: From program version 1.2.0.0 it works without installed Excel. This restriction applies only to the Template Editor.

Two convenience features you should use immediately

Format data, context menu in the data area. Places each data field on its own line and also shows the fields as a list next to the source data. Selecting an item in the list highlights the corresponding part of the source data.

New data tab, right-click in the data area → “New data tab”. This lets you create several test data sets side by side: one with long texts, one with short ones, one for the special-offer case. The tabs are fixed as “Data 1”, “Data 2” and so on and cannot be renamed, so remember which case is in which tab. The active tab supplies the currently linked data.

Data area with the three tabs Data 1, Data 2 and Data 3; the active tab Data 3 contains the special-offer case with empty PREIS, SONDERPREIS 12.99 and ALTPREIS 14.99
Multiple data tabs: one test case each for long texts, short texts and the special-offer case

Source: ESLEasy_TemplateEditor V2.7, “Daten (Testdaten-Bereich)”, pp. 13–16.


Step 3, The first object

You insert objects via the icon bar. Hover with the mouse, the tooltip tells you which object it is.

One click, and the object is inserted as a new source code line at the cursor position (or at the end), receives default values and appears immediately in the graphical editor. New objects are inserted at the last active mouse position when possible.

The icon bar of the Template Editor with three rows of object icons, above the barcode icon the tooltip “Ein Barcode. Es werden die gängigsten Barcodetypen unterstützt.”
Objects are inserted via the icon bar, the tooltip names the object type

Now move the object with the mouse to where it should be, and watch the source code: The X and Y values update live. You never have to calculate coordinates.

Top: the source code with the highlighted TEXT line Y=99 and X=34; bottom: the label in the graphical editor with the moved, selected object Inhalt/Fl.
Moving in the graphical editor, the coordinates in the source code update immediately

The trick that saves the most typing

  1. In the source code, select the area where the data field should go, e.g. the content of the TEXT tag. (Alternatively: position the cursor.)
  2. Double-click the data field in the list.
  3. The editor replaces the selection with {Fieldname} or inserts the field at the cursor position.

No retyping, no typos.

Template Editor after the double-click: the new source code line contains TEXT={ARTNR}, in the data area the field ARTNR=10101 is highlighted in yellow, the field list on the right
Double-clicking a data field in the list inserts it as {Fieldname} into the source code

Source: ESLEasy_TemplateEditor V2.7, “Grafischer Editor” pp. 8–10; “Datenfelder in den Quellcode einfügen” p. 15.


Step 4, Work precisely

Three things turn fumbling into precise work.

The grid

Enter a grid spacing in pixels (> 1) and press Enter. The grid appears as dots; objects snap when moved.

  • Option “Only when moving”: size changes remain free. Without this option, size changes also snap.
  • Value 0 or 1, or the X button, clears the grid → free positioning.
Graphical editor with the control bar above it: grid 10, option Only when moving active, the label shows a dot grid and a selected text object
Active grid: Objects snap to the grid points when moved

The modifier keys

ActionKey
Select multiple objectsHold Ctrl
Exclude one object from multi-selectionCtrl + Shift
Cycle through stacked objects one by oneShift
Move horizontally onlyCtrl
Move vertically onlyCtrl + Shift
Address the selected object even if the mouse does not hit itHold Alt
Align line automatically horizontal/verticalCtrl (while dragging a handle)

The tip that saves grey hairs: You do not have to hit an object with the mouse. Simply place the cursor in the source code on the object’s line, it is then selected. For tiny or overlapping objects, this is the faster way.

Align

Right-click in the graphical editor: The alignment commands (left-aligned, horizontally centered, equal vertical spacing …) are directly in the context menu.

  • A single selected object is aligned to the label edges.
  • With multiple selected objects, alignment is relative to the last selected object.

Remember the second point, otherwise everything slides to the wrong edge.

Further controls of the graphical editor

FunctionPurpose
Selection color (slider)Adjust the colour of object borders, useful when the background has the border colour (e.g. black)
ZoomEnlarge/reduce the display
Frame objectsShows the physical bounds, visible space and overlaps
All objectsShows all objects from the source text, including those currently excluded by WHEN
Handle sizeChange handle size

Source: ESLEasy_TemplateEditor V2.7, “Grafischer Editor” pp. 8–10; “Steuerung des grafischen Editors” pp. 10–11; “Objekte ausrichten” p. 11.


Step 5, Two time-saving functions

Nobody finds these two functions on their own, but they save a lot of work.

Replace tag value

Sets a specific tag to the same value for all selected objects (e.g. the same FONTSIZE).

  1. Select multiple objects.
  2. Choose “Replace tag value” in the context menu of the graphical editor; the dialog is titled “Change tag value”.
  3. Enter the tag name and value.

Pay attention to the option “Add tag if not present”: Without it, the value is only replaced where the tag already exists. With it, the tag is added to objects that do not yet have it. With the “Delete tag” option you remove the tag from all selected objects instead.

Three selected text objects in the graphical editor, below them the dialog Change tag value with tag name FONTSIZE, the checked option Add tag if not present, and new content 20
Replace tag value (dialog “Change tag value”): One value for all selected objects, watch the add option

Lock objects (Lock)

Every graphical object has the property <LOCK>, settable in the object inspector or directly in the source code.

  • Locked objects can no longer be selected or changed in the graphical editor. Ideal for backgrounds and frames that must not be moved by accident.
  • Unlock: Select the source code line and remove <LOCK>.
  • “Unlock”: Temporarily lifts all locks. The individual <LOCK> properties remain and take effect again as soon as “Unlock” is deactivated.

The object inspector

Shows all available properties of the current object. Only selected properties are active. Values can be changed in the inspector or directly in the source code; properties with choices are available via the ”…” button.

Object inspector of a TEXT object with the columns Tag and Value: checked are CMD, Y, X, WIDTH, HEIGHT, TEXT, COLOR, FONT, FONTSIZE, AUTOSIZE, MINFONTSIZE and WORDWRAP, other properties are inactive, the column with the … buttons on the right
The object inspector shows all properties of the selected object

Source: ESLEasy_TemplateEditor V2.7, “Tag-Wert ersetzen” pp. 11–12; “Objekte sperren — Lock” p. 11; “Objekt-Inspektor” pp. 12–13.


Step 6, Save: Template and project file (.prj)

Save regularly. The template is always stored under the given name. Copying here simply means: save under another name.

The project file, save test data as well

This point is often overlooked. Anyone who forgets it once and has to retype all test data will not forget it a second time.

  1. Under “Data:”, enter the template name with the extension .prj.
  2. Click “Save”.
  3. The next time the template is loaded, the editor asks whether the project file should be loaded. “YES” loads the data of all data tabs.

Alternatively, the template area has a “Save project” button that automatically creates the .prj project file for the current template name. The .tpl extension belongs to the template itself.

Template and data area: template Doku_Getraenke_400x300, the Data field contains Doku_Getraenke_400x300.prj, at the Save button of the data area the tooltip “Speichert die Daten oder Projektdatei (.prj)”
Test data is saved as a .prj file with the template, including all data tabs

Source: ESLEasy_TemplateEditor V2.7, “Projektdatei” pp. 20–21; “Template speichern / kopieren” p. 21.


Step 7, Preview and live test

The graphical editor is not the final result

Remember this rule, it will save you a lot of trouble later:

The graphical editor shows you the layout. But the result of dynamic object adjustments is only visible in the preview, not in the editor.

The same applies to rotation: Templates are always edited in the orientation (portrait/landscape) in which they will later be displayed. If you build a portrait template for a label that is physically constructed as landscape, the display must be rotated when sent to the label (see CANVAS / ROTATE). Whether that is correct is checked in the preview.

Preview window with the finished example label: Apfelschorle 24 x 0.33 l MW, content, deposit, price 14.99 euros, base price, barcode and item number
The preview (“Preview” window) shows the final result, including rotation and dynamic adjustments

Send to a label

The current view can be sent directly to a label for checking.

  • Only the current view is sent, any Pages are not included.
  • Existing NFC data in the template is transferred as well.
screenshot114.png
The moment of truth: The template on the physical ESL label

Source: ESLEasy_TemplateEditor V2.7, “Vorschau” pp. 25–26; “Aktuelle Ansicht an ein Label senden” p. 22.


When something does not work

A source code line is marked red.

On processing errors, the faulty line is marked red and an error message appears in the status bar.

An object is not displayed, but nothing is red.

Problems can also result from the content interpretation of the data without an error message appearing. Check the object properties.

According to the docs, IF conditions and WHEN statements are the biggest source of errors, classic case: The template references {EAN}, but the payload data is missing <EAN="…">.

Helpful: the editor option "All objects", it also shows objects currently excluded by WHEN.

Execution can be continued on errors.

The corresponding button is intended for development only. For live use, all errors must be resolved.

Source: ESLEasy_TemplateEditor V2.7, “Quellcode-Interpreter”, pp. 6–8.


Further topics from Part 1

These topics belong to editor operation, but are not needed for the first template:

TopicShort descriptionDocs
Multiple DataIDs / layersWhen multiple articles are output on one label, data from further queries ends up in layers, recognizable by the suffix _2 ({PREIS_2}). Alternatively: the LAYER command (see Guide 3).pp. 16–17
SET, sub-records (new in V2.7)Set articles via <_SETx_DATAID="">; all fields of the SET DataIDs are available with the prefix _SETx_.p. 17
Location tagsPer location, additional data fields that behave like master data. The same DataID can thus deliver different values in Location 1 and 2.pp. 18–20
Dynamic tag namesTag names can be assembled: +Tag-Name+ accesses the content of a tag in the name.p. 20
ESL label data (__HS_*)Labels supply parameters such as battery level or radio quality. All begin with __HS_ (e.g. __HS_BATTERY). See Guide 4.pp. 21–22

Further reading

Source document: Template Editor · v2.7