Zum Inhalt springen
DE EN
Doku-Navigation

Ihr erstes Template in 15 Minuten

Template-Editor Teil 1, Bedienung und Arbeitsumgebung

Einsteiger · ca. 15 Min. Lesezeit

Basiert auf ESLEasy_TemplateEditor V2.7, Stand 2025-09-03

Voraussetzungen

  • ESL-Easy-Manager installiert
  • Mindestens ein Artikel-Datensatz in der Produktdatenbank (siehe Guide „Datenimport“)
  • Ein ESL-Label zum Testen

Templates sind das Herzstück von ESL-Easy: Sie bestimmen, wie ein Label aussieht. In diesem Guide bauen Sie Ihr erstes Template, von der Auflösung über Testdaten bis zum Live-Test auf dem Label.

Was ist ein Template?

Bevor Sie den Editor öffnen, eine Sache, die vieles erklärt:

Templates sind ganz normale Textdateien. Sie enthalten den Sourcecode, aus dem ESL-Easy den grafischen Label-Inhalt erzeugt. Sie könnten ein Template theoretisch in jedem Texteditor schreiben, der Template-Editor macht es nur erheblich komfortabler. Er ist Bestandteil des ESL-Easy-Managers und wird aus dessen Hauptmenü aufgerufen.

Speicherort merken: Alle Templates müssen im konfigurierten Ordner liegen. Standard: \ESLEasy\Templates. Liegt ein Template woanders, findet ESL-Easy es nicht.

screenshot101.png
Ein Template ist reiner Text, hier eine einzelne TEXT-Zeile in einem normalen Editor

Quelle: ESLEasy_TemplateEditor V2.7 (03.09.2025), „Allgemeines”, S. 5.


Die Arbeitsumgebung

Der Editor besteht aus drei Bereichen, und die gehören zusammen.

screenshot102.png
Die drei Bereiche des Editors: Quellcode, grafischer Editor und Daten
  • Links: der Quellcode. Jede Eingabe erscheint mit kurzer Verzögerung nach dem letzten Tastendruck im grafischen Editor.
  • Rechts: der grafische Editor. Objekte lassen sich direkt mit der Maus verändern.
  • Unten: die Daten. Testdaten, mit denen Sie das Template verknüpfen.

Sie arbeiten in beide Richtungen: im Quellcode tippen und rechts das Ergebnis sehen, oder rechts ein Objekt mit der Maus verschieben und links die Werte mitlaufen sehen. Es ist derselbe Inhalt in zwei Ansichten.

Nützliche Grundfunktionen

FunktionBedienung
Schriftgröße Quellcode/DatenStrg + Mausrad
Einrücken / AusrückenTAB / Shift + TAB (bei markiertem Text)
Suchen und ErsetzenIm Quelltext oder in den Nutzdaten
SonderzeichenÜber Button einblendbare Liste, Übernahme in Quellcode oder Daten

Quelle: V2.7, „Quellcode-Editor”, S. 6.


Schritt 1, Neues Template anlegen (Config)

Beim Anlegen erscheint der Config-Dialog. Er fragt zwei Dinge ab, die beide wichtig sind.

screenshot103.png
Der Config-Dialog: Hier wird die Auflösung des Templates festgelegt

Die Auflösung

Ein Template wird immer für genau eine Auflösung erzeugt (Pixel horizontal × vertikal). Beim späteren Scannen eines Labels werden nur Templates mit passender Auflösung angeboten (Ausnahme: Übersteuerung in der App).

Drei Wege, die Auflösung festzulegen:

  1. Typ aus der Liste wählen
  2. Label scannen, der praxisnächste Weg
  3. Label-ID eingeben, die Auflösung wird dann vom Label ermittelt

LINKEDDATAIDS

Hier steht, wie viele DataIDs, also wie viele Artikel, dieses Template benötigt.

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

Für ein normales Preisschild steht dort COUNT="1". Bei variabler Artikelanzahl geben Sie mehrere Werte mit Komma an:

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

→ Es müssen 1, 2, 3 oder 4 DataIDs erfasst werden.

Der Config-Dialog ist jederzeit nachträglich aufrufbar, und alle Werte lassen sich auch direkt im Quellcode ändern. Sie legen sich hier also nicht endgültig fest.

Quelle: V2.7, „Neues Template erstellen — Config”, S. 22–23; LINKEDDATAIDS, S. 28.


Schritt 2, Testdaten anlegen

Vorweg die wichtigste Information: Testdaten beeinflussen die echten Daten in der Datenbank nicht. Sie können hier gefahrlos experimentieren.

Die eine Regel

Testdaten haben immer dieselbe Form:

<PRICE="12,99">

Spitze Klammer, Feldname, Gleichzeichen, Inhalt in Anführungszeichen.

Im Template greifen Sie darauf mit geschweiften Klammern zu:

{PRICE}

Spitze Klammern zum Definieren, geschweifte zum Verwenden. Das ist die Regel, an der die meisten Einsteiger scheitern.

Ein vollständiges Beispiel:

<CMD="TEXT"><Y="133"><X="9"><WIDTH="73"><HEIGHT="15"><TEXT="ItemNo: {ITEMNO}"><COLOR="BLACK"><FONT="Calibri"><FONTSIZE="12">
screenshot104.png
Testdaten im Format , hier abgerufen aus der Produktdatenbank

Daten abrufen

Testdaten können Sie manuell tippen oder direkt abrufen, aus der ESL-Easy-Produktdatenbank, aus Excel-/CSV-Dateien oder aus einem angebundenen System. Die Ausgabe erfolgt im aktuell aktiven Tab.

Bei Excel/CSV mit mehreren Datensätzen können Sie eine Zeilennummer eingeben oder durch die Zeilen blättern. Für CSV lässt sich die Kodierung beim Einlesen vorgeben.

Zum Einlesen von Excel-Dateien im Template-Editor wird ein lokal installiertes Microsoft Excel benötigt!

Nicht verwechseln mit dem FileImporter/BulkImporter: Der kommt ab Programmversion 1.2.0.0 ohne installiertes Excel aus. Diese Einschränkung gilt nur für den Template-Editor.

Zwei Komfortfunktionen, die Sie sofort nutzen sollten

Daten formatieren, Kontextmenü im Datenbereich. Stellt jedes Datenfeld in einer eigenen Zeile dar und zeigt die Felder zusätzlich als Liste neben den Quelldaten an. Eine Auswahl in der Liste markiert den zugehörigen Teil der Quelldaten.

Neuer Daten-Tab, Rechtsklick im Datenbereich → „Neuer Daten-Tab”. Damit legen Sie mehrere Testdatensätze nebeneinander an: einen mit langen Texten, einen mit kurzen, einen für den Angebotsfall. Der aktive Tab liefert die aktuell verknüpften Daten.

screenshot105.png
Mehrere Daten-Tabs: je ein Testfall für lange Texte, kurze Texte und den Angebotsfall

Quelle: V2.7, „Daten (Testdaten-Bereich)”, S. 13–16.


Schritt 3, Das erste Objekt

Objekte fügen Sie über die Icon-Leiste ein. Fahren Sie mit der Maus darüber, der Tooltip sagt Ihnen, um welches Objekt es sich handelt.

Ein Klick, und das Objekt wird als neue Quellcode-Zeile an der Cursor-Position eingefügt (bzw. am Ende), erhält Default-Werte und erscheint sofort im grafischen Editor. Neue Objekte werden nach Möglichkeit an der zuletzt aktiven Mausposition eingefügt.

screenshot106.png
Über die Icon-Leiste werden Objekte eingefügt, der Tooltip nennt den Objekttyp

Jetzt schieben Sie das Objekt mit der Maus dorthin, wo es hin soll, und beobachten den Quellcode: Die X- und Y-Werte laufen live mit. Sie müssen nie Koordinaten ausrechnen.

screenshot107.png
Verschieben im grafischen Editor, die Koordinaten im Quellcode aktualisieren sich sofort

Der Trick, der die meiste Tipparbeit spart

  1. Markieren Sie im Quellcode den Bereich, in den das Datenfeld soll, z. B. den Inhalt des TEXT-Tags. (Alternativ: Cursor positionieren.)
  2. Doppelklicken Sie auf das Datenfeld in der Liste.
  3. Der Editor ersetzt die Markierung durch {Datenfeldname} bzw. fügt das Feld an der Cursor-Position ein.

Kein Abtippen, keine Tippfehler.

screenshot108.png
Doppelklick auf ein Datenfeld in der Liste fügt es als {Feldname} in den Quellcode ein

Quelle: V2.7, „Grafischer Editor” S. 8–10; „Datenfelder in den Quellcode einfügen” S. 15.


Schritt 4, Präzise arbeiten

Drei Dinge machen aus Fummelei präzise Arbeit.

Das Raster

Tragen Sie einen Raster-Abstand in Pixel (> 1) ein und drücken Sie Enter. Das Raster erscheint als Punkte, Objekte rasten beim Verschieben ein.

  • Option „Nur bei Verschieben”: Größenänderungen bleiben frei. Ohne diese Option rasten auch Größenänderungen ein.
  • Wert 0 oder 1 bzw. der X-Button löscht das Raster → freie Positionierung.
screenshot109.png
Aktives Raster: Objekte rasten beim Verschieben auf den Rasterpunkten ein

Die Modifier-Tasten

AktionTaste
Mehrere Objekte markierenStrg halten
Ein Objekt aus der Mehrfachauswahl ausschließenStrg + Shift
Übereinanderliegende Objekte einzeln durchgehenShift
Nur horizontal verschiebenStrg
Nur vertikal verschiebenStrg + Shift
Markiertes Objekt ansprechen, auch wenn die Maus es nicht trifftAlt halten
Linie automatisch horizontal/vertikal ausrichtenStrg (beim Ziehen am Anfasser)

Der Tipp, der graue Haare erspart: Sie müssen ein Objekt gar nicht mit der Maus treffen. Setzen Sie den Cursor im Quellcode einfach auf die Zeile des Objekts, es ist damit markiert. Bei winzigen oder überlappenden Objekten ist das der schnellere Weg.

Ausrichten

Rechtsklick im grafischen Editor → Kontextmenü → Ausrichten.

  • Ein einzelnes markiertes Objekt wird an den Label-Rändern ausgerichtet.
  • Bei mehreren markierten Objekten erfolgt die Ausrichtung am zuletzt markierten Objekt.

Merken Sie sich den zweiten Punkt, sonst rutscht Ihnen alles an die falsche Kante.

Weitere Steuerungen des grafischen Editors

FunktionZweck
Auswahlfarbe (Schieberegler)Farbe der Objekt-Umrandungen anpassen, sinnvoll, wenn der Hintergrund die Umrandungsfarbe hat (z. B. schwarz)
ZoomAnzeige vergrößern/verkleinern
Objekte umrahmenZeigt die physischen Begrenzungen, sichtbarer Platz und Überlappungen
Alle ObjekteZeigt alle Objekte des Quelltexts, auch die aktuell durch WHEN ausgeschlossenen
Größe AnfasserAnfassergröße ändern

Quelle: V2.7, „Grafischer Editor” S. 8–10; „Steuerung des grafischen Editors” S. 10–11; „Objekte ausrichten” S. 11.


Schritt 5, Zwei Zeitspar-Funktionen

Diese beiden Funktionen findet niemand von allein, sie sparen aber viel Arbeit.

Tag-Wert ersetzen

Setzt für alle markierten Objekte ein bestimmtes Tag auf denselben Wert (z. B. dieselbe FONTSIZE).

  1. Mehrere Objekte markieren.
  2. Dialog „Tag-Wert ersetzen” öffnen.
  3. Tag-Name und Wert eingeben.

Achten Sie auf die Option „Tag zufügen, wenn nicht vorhanden”: Ohne sie wird der Wert nur dort ersetzt, wo das Tag bereits existiert. Mit ihr wird das Tag in Objekten ergänzt, die es noch nicht haben.

screenshot110.png
Tag-Wert ersetzen: Ein Wert für alle markierten Objekte, auf die Zufügen-Option achten

Objekte sperren (Lock)

Jedes grafische Objekt hat die Eigenschaft <LOCK>, setzbar im Objekt-Inspektor oder direkt im Sourcecode.

  • Gesperrte Objekte sind im grafischen Editor nicht mehr wähl- oder veränderbar. Ideal für Hintergründe und Rahmen, die nicht versehentlich verschoben werden sollen.
  • Entsperren: Die Quellcode-Zeile auswählen und <LOCK> entfernen.
  • „Unlock”: Hebt alle Sperren temporär auf. Die einzelnen <LOCK>-Eigenschaften bleiben bestehen und wirken wieder, sobald „Unlock” deaktiviert wird.

Der Objekt-Inspektor

Zeigt alle verfügbaren Eigenschaften des aktuellen Objekts. Nur markierte Eigenschaften sind aktiv. Werte lassen sich im Inspektor oder direkt im Quellcode ändern; Eigenschaften mit Auswahlmöglichkeiten sind über den „…”-Button abrufbar.

screenshot111.png
Der Objekt-Inspektor zeigt alle Eigenschaften des markierten Objekts

Quelle: V2.7, „Tag-Wert ersetzen” S. 11–12; „Objekte sperren — Lock” S. 11; „Objekt-Inspektor” S. 12–13.


Schritt 6, Speichern: Template, .prj und .TPL

Speichern Sie regelmäßig. Das Template wird immer unter dem angegebenen Namen abgelegt. Kopieren bedeutet hier schlicht: unter anderem Namen speichern.

Die Projektdatei, Testdaten mitsichern

Dieser Punkt wird gern übersehen. Wer ihn einmal vergisst und alle Testdaten neu tippen muss, vergisst ihn kein zweites Mal.

  1. Geben Sie unter „Daten:” den Template-Namen mit der Endung .prj ein.
  2. Klicken Sie „Speichern”.
  3. Beim nächsten Laden des Templates fragt der Editor, ob die Projektdatei geladen werden soll. „JA” lädt die Daten aller Datenreiter.

Alternativ gibt es einen Button, der automatisch eine Projektdatei mit der Endung .TPL zum aktuellen Template-Namen anlegt.

screenshot112.png
Testdaten werden als .prj-Datei zum Template gesichert, inklusive aller Datenreiter

Quelle: V2.7, „Projektdatei” S. 20–21; „Template speichern / kopieren” S. 21.


Schritt 7, Vorschau und Live-Test

Der grafische Editor ist nicht das Endergebnis

Merken Sie sich diese Regel, sie erspart Ihnen später viel Ärger:

Der grafische Editor zeigt Ihnen das Layout. Aber das Ergebnis dynamischer Objektanpassungen sehen Sie erst in der Vorschau, nicht im Editor.

Dasselbe gilt für Rotation: Templates werden immer in dem Format (Hochkant/Quer) bearbeitet, wie sie später dargestellt werden. Bauen Sie ein Hochkant-Template für ein physisch quer konstruiertes Label, muss die Darstellung rotiert ans Label gesendet werden (siehe CANVAS / ROTATE). Ob das stimmt, prüfen Sie in der Vorschau.

screenshot113.png
Die Vorschau zeigt das endgültige Ergebnis, inklusive Rotation und dynamischer Anpassungen

An ein Label senden

Die aktuelle Ansicht lässt sich zur Kontrolle direkt an ein Label senden.

  • Es wird nur die aktuelle Ansicht gesendet, eventuelle Pages werden dabei nicht berücksichtigt.
  • Vorhandene NFC-Daten im Template werden mit übertragen.
screenshot114.png
Der Moment der Wahrheit: Das Template auf dem physischen ESL-Label

Quelle: V2.7, „Vorschau” S. 25–26; „Aktuelle Ansicht an ein Label senden” S. 22.


Wenn etwas nicht funktioniert

Eine Quellcode-Zeile ist rot markiert.

Bei Verarbeitungsfehlern wird die fehlerhafte Zeile rot markiert und in der Statusleiste erscheint eine Fehlermeldung.

Ein Objekt wird nicht dargestellt, aber nichts ist rot.

Probleme können sich auch aus der inhaltlichen Interpretation der Daten ergeben, ohne dass eine Fehlermeldung erscheint. Prüfen Sie die Objekteigenschaften.

Laut Doku sind IF-Bedingungen und WHEN-Angaben die größte Fehlerquelle. Klassischer Fall: Das Template greift auf {EAN} zu, aber in den Nutzdaten fehlt <EAN="…">.

Hilfreich: die Editor-Option „Alle Objekte", sie zeigt auch die aktuell durch WHEN ausgeschlossenen Objekte.

Die Ausführung lässt sich bei Fehlern fortsetzen.

Der entsprechende Button ist nur für die Entwicklung gedacht. Für den Echt-Einsatz müssen alle Fehler beseitigt sein.

Quelle: V2.7, „Quellcode-Interpreter”, S. 6–8.


Weiterführende Themen aus Teil 1

Diese Themen gehören zur Editor-Bedienung, sind aber für das erste Template nicht nötig:

ThemaKurzbeschreibungDoku
Mehrere DataIDs / EbenenWerden mehrere Artikel auf einem Label ausgegeben, landen die Daten weiterer Abfragen in Ebenen, erkennbar am Suffix _2 ({PREIS_2}). Alternativ: der Befehl LAYER (siehe Guide 3).S. 16–17
SET, Unterdatensätze (neu in V2.7)Set-Artikel über <_SETx_DATAID="">; alle Felder der SET-DataIDs stehen mit dem Präfix _SETx_ zur Verfügung.S. 17
Location-TagsPro Location zusätzliche Datenfelder, die sich wie Stammdaten verhalten. Dieselbe DataID liefert so in Location 1 und 2 unterschiedliche Werte.S. 18–20
Dynamische Tag-NamenTag-Namen lassen sich zusammenbauen: +Tag-Name+ greift auf den Inhalt eines Tags im Namen zu.S. 20
ESL-Label-Daten (__HS_*)Labels liefern Parameter wie Batteriestand oder Funkqualität. Alle beginnen mit __HS_ (z. B. __HS_BATTERY). Siehe Guide 4.S. 21–22

Zum Weiterlesen

Quelldokument: Template Editor · v2.7