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.

screenshot101.png

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.

screenshot102.png

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

Function	Operation
Font size source code/data	`Ctrl` + mouse wheel
Indent / outdent	`TAB` / `Shift + TAB` (with selected text)
Find and replace	In the source text or in the payload data
Special characters	List shown via button, transfer into source code or data

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

Step 1, Create a new template (Config)

When creating a template, the Config dialog appears. It asks for two things, both of which matter.

screenshot103.png

The Config dialog: 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).

Three ways to set the resolution:

Select a type from the list
Scan a label, the most practical approach
Enter a label ID, the resolution is then determined from the label

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 Config dialog can be opened again at any time, and all values can also be changed directly in the source code. You are not locking yourself in here.

Source: 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">

screenshot104.png

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 active tab supplies the currently linked data.

screenshot105.png

Multiple data tabs: one test case each for long texts, short texts and the special-offer case

Source: 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.

screenshot106.png

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.

screenshot107.png

Moving in the graphical editor, the coordinates in the source code update immediately

The trick that saves the most typing

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.)
Double-click the data field in the list.
The editor replaces the selection with {Fieldname} or inserts the field at the cursor position.

No retyping, no typos.

screenshot108.png

Double-clicking a data field in the list inserts it as {Fieldname} into the source code

Source: 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.

screenshot109.png

Active grid: Objects snap to the grid points when moved

The modifier keys

Action	Key
Select multiple objects	Hold `Ctrl`
Exclude one object from multi-selection	`Ctrl + Shift`
Cycle through stacked objects one by one	`Shift`
Move horizontally only	`Ctrl`
Move vertically only	`Ctrl + Shift`
Address the selected object even if the mouse does not hit it	Hold `Alt`
Align line automatically horizontal/vertical	`Ctrl` (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 → context menu → Align.

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

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

Source: 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).

Select multiple objects.
Open the “Replace tag value” dialog.
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.

screenshot110.png

Replace 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.

screenshot111.png

The object inspector shows all properties of the selected object

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

Step 6, Save: Template, .prj and .TPL

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.

Under “Data:”, enter the template name with the extension .prj.
Click “Save”.
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 there is a button that automatically creates a project file with the extension .TPL for the current template name.

screenshot112.png

Test data is saved as a .prj file with the template, including all data tabs

Source: 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.

screenshot113.png

The preview 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: 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: 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:

Topic	Short description	Docs
Multiple DataIDs / layers	When 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 tags	Per 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 names	Tag 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