Dokumentvorlagen

In den vorherigen Anleitungen haben Sie die Syntax der Ultradox Template-Sprache gelernt. Jetzt ist es an der Zeit zu lernen, wie Sie die Template-Sprache in Ihren Dokumenten nutzen können, um personalisierte E-Mails, Verträge, Berichte, Websites und mehr zu erstellen.

Templates erstellen

Erstellen Sie einen leeren Ultradox-Flow und fügen Sie Google Docs zum PDF-Baustein hinzu.

Generate PDF from given file

Klicken Sie auf die angegebene Datei, um die Dateiauswahl zu öffnen. Wählen Sie ein bestehendes Dokument aus oder erstellen Sie ein leeres neues Dokument.

Sie können die gleiche Template-Syntax verwenden, um Daten aus einer Variablen in Ihr Dokument einzufügen.

Hallo ${name}

Wechseln Sie zurück in den Ultradox-Editor und warten Sie eine Weile oder klicken Sie auf das Reload-Symbol im Baustein, um die Vorlage zu scannen und alle Variablen in Ihrem Dokument zu verfolgen.

Um Ihre Vorlage zu testen, müssen Sie einen Wert für Ihre Variable eingeben. Der einfachste Weg, den Variablen einen Wert zuzuweisen, besteht darin, ein Formular hinzuzufügen.

Durch Anklicken des Tastatursymbols im Eingabeparameterbereich Ihres Bausteins wird ein Formular mit einem Eingabefeld für jede der erfassten Variablen erstellt.

Um Ihre Vorlage zu testen, können Sie Daten in das Formular eingeben und auf die Schaltfläche Speichern klicken.

Um das Dokument zu generieren und in der Vorschau anzuzeigen, wählen Sie es entweder im Ultradox Template Editor aus oder im Baustein, der das PDF-Dokument erzeugt.

Das erzeugte PDF-Dokument wird in einem neuen Browserfenster geöffnet.

Formatieren von Bildern

Ultradox ermöglicht es Ihnen, Bilder spontan zu generieren und in Ihre Dokumente einzubetten.

Sie können Diagramme, Kontaktfotos, Karten oder andere Bilder, die im Netz verfügbar sind, einfügen.

Beginnen wir mit dem Einfügen eines Bildes per URL. Dies ermöglicht es Ihnen, verschiedene Bilder in Ihre Dokumente einzubetten, indem Sie einfach die URL des Bildes als Parameter übergeben. Fügen Sie eine neue Variable in Ihr Dokument ein und weisen Sie Ultradox mit dem Bild-Renderer an, den Inhalt Ihrer Variable als Bild-URL zu behandeln:

${logo;image}

Nach dem Neuladen der Vorlage erscheint die neue Variable als Eingabeparameter. Zu Testzwecken können Sie eine Test-Form erstellen, indem Sie auf das Tastatursymbol im Bereich der Eingabeparameter klicken.

Geben Sie im Formular die URL eines Bildes in das Formularfeld für die Variable ${logo} ein.

Lassen Sie uns ein Bild aus dem Internet auswählen und die URL eingeben.

https://www.Ultradox.com/logo.png

Klicken Sie auf die Schaltfläche Vorschau, um das generierte Dokument anzuzeigen: Wie erwartet, erscheint das Bild im generierten Dokument. Sie können die Größe des Bildes anpassen, indem Sie die gewünschte Breite und Höhe angeben:

${logo;image(width=2cm;height=2cm)}

Ändern Sie Ihre Vorlage und klicken Sie entweder erneut auf die Vorschau-Schaltfläche oder laden Sie das generierte Dokument einfach neu. Ihre Änderungen werden sofort berücksichtigt.

Eine vollständige Beschreibung der Formatierungsmöglichkeiten des Bild-Renderers finden Sie in der Renderer-Referenz.

${logo;image(width=2cm;height=2cm)}
{
"logo" : "https://www.Ultradox.com/logo.png"
}

   

Formatting maps

Wäre es nicht schön, die Postanschrift als Karte darzustellen?

Mit Ultradox können Sie genau das tun - und es ist ganz einfach. Um die Adresse als Karte darzustellen, geben Sie einfach ein

${address;map(width=10cm;height=5cm;res=1000x500)}

Die generierte Karte hat eine Breite von 10 cm und eine Höhe von 5 cm. Bitte beachten Sie, dass die Auflösung auch dieses Verhältnis wiedergeben sollte, da Ihre Karte sonst verzerrt aussieht.

Eine vollständige Beschreibung der Formatierungsmöglichkeiten des Karten-Renderers finden Sie in der Renderer-Referenz.

<p>Hey ${name}!</p>
<p>Pick up your order here:</p>
${address;map(width=200px;height=100px;res=400x200)}
{
"name" : "Larry",
"address" : "1600 Amphitheatre Parkway,Mountain View,CA 94043"
}

   

Automatische Erweiterung von Tabellen und Listen

Lassen Sie uns nun auf eine der herausragendsten Eigenschaften von Ultradox eingehen!

Sie können ansprechend formatierte Tabellen und Listen aus Ihren Daten erstellen, indem Sie einfach eine Tabelle oder Liste mit einer einzigen Zeile erstellen und eine Variable einfügen, die mehrere Elemente repräsentiert.

Ultradox nimmt die angegebene Zeile als Blaupause und erstellt eine Zeile für jedes Element in Ihrer Variable.

Wie wir in den vorherigen Abschnitten gesehen haben, können Variablen eine Liste von Werten enthalten.

Wenn Sie zum Beispiel ein Arbeitsblatt aus Ihrem Google Sheet laden, das aus zwei Spalten besteht, die Name und E-Mail genannt werden, finden Sie Variablen für jede Spalte, die so aussieht:

row[].name

row[].email

Die eckigen Klammern zeigen an, dass die Variable row mehrere Elemente mit jeweils zwei benannten Werten, name und email, enthält. Diese Variablen eignen sich für die Verwendung in Tabellen und Listen.

Wenn Sie diese Variablen in Listen oder Tabellen in Ihrer Vorlage verwenden, fügen Sie sie einfach in die Liste oder Tabelle ein. Ultradox erweitert dann automatisch die Tabelle oder Liste, um eine Zeile für jedes Element in Ihrer Liste zu erstellen.

Listen

Listen

Lassen Sie uns nun eine Liste aus den Zeilen in Ihrem Arbeitsblatt erstellen.

Erstellen Sie einfach eine Liste in Ihrem Google-Dokument, indem Sie auf einen der Listentypen klicken.

Fügen Sie die Variable, die mehrere Werte enthält, wie folgt in die Liste ein:

1. $[mysheet[].name]

Eine Vorschau des Dokuments kann so aussehen:

1. Daniel Florey
2. Oliver Zeigermann
3. Esther Cornils

Das generierte Dokument enthält eine Liste mit den Werten aus der Spalte name in Ihrem Blatt.

Das war einfach, oder?

Tabellen

Auf die gleiche Weise können Sie dynamische Tabellen erstellen.

Fügen Sie eine Tabelle mit zwei Zeilen und zwei Spalten in Ihre Vorlage ein. Fügen Sie die Spaltenüberschriften in die erste Zeile und die Variablen in die zweite Zeile ein, so dass die Tabelle so aussieht:

Name

E-Mail

$[mysheet[].name]

$[mysheet.email]

Beachten Sie, dass Sie alle Formatierungsmöglichkeiten von Google Docs wie Tabellenhintergrundfarbe, Schriftgrößen usw. nutzen können.

Generieren Sie das Dokument aus Ihrer Vorlage und Sie erhalten eine ordentlich formatierte Tabelle:

Name

E-Mail

Daniel Florey

[email protected]

Oliver Zeigermann

[email protected]

Esther Cornils

[email protected]

Aber das ist noch nicht alles!

Sie können ganz einfach verschiedene Stile für gerade und ungerade Zeilen erstellen.

Fügen Sie einfach eine weitere Zeile zu Ihrer Tabelle in der Vorlage hinzu, die die gleichen Variablen enthält.

Fügen Sie der neuen Zeile eine andere Hintergrundfarbe oder eine andere Formatierung hinzu, damit Ihre Tabelle so aussehen wird:

Name

E-Mail

$[mysheet[].name]

$[mysheet.email]

$[mysheet[].name]

$[mysheet.email]

In diesem Beispiel hat die zweite Zeile nun eine andere Hintergrundfarbe.

Das generierte Dokument verwendet nun die verschiedenen Stile als Blaupause für die alternierenden Zeilen in der generierten Tabelle:

Name

E-Mail

Daniel Florey

[email protected]

Oliver Zeigermann

[email protected]

Esther Cornils

[email protected]

Fortgeschrittene Techniken

Anzeigen von mehrstufigen Daten

Autor

Bücher

$[authors[].name]

${foreach row.books book}${book.title}
${end}

In diesem Beispiel enthält die zweite Zelle eine Liste von Büchern für den Autor aus der ersten Zelle der Zeile...

Generieren Sie das Dokument aus Ihrer Vorlage und Sie erhalten eine ordentlich formatierte Tabelle:

Autor

Bücher

Arnon Grunberg

Mit Haut und Haaren
Tirza

Fjodor Michailowitsch Dostojewski

Schuld und Sühne
Die Brüder Karamasow

Verwendung von Bedingungen in automatisch generierten Tabellen und Listen

Wie Sie in den vorangegangenen Abschnitten gelernt haben, können Sie aus strukturierten Daten Tabellen und Listen erzeugen und Bedingungen in Ihren Vorlagen verwenden.

Mit Ultradox können Sie diese Techniken kombinieren, um tolle Ergebnisse zu erzielen.

Mit if Anweisungen in einer Zelle können Sie bedingte Formatierungen anwenden oder verschiedene Inhalte basierend auf einer Bedingung anzeigen.

Wenn Sie eine Variable mit dem Namen highlightPrices haben, können Sie mit dieser Variable festlegen, ob Preise in Ihrer Tabelle fett gedruckt werden sollen:

Beschreibung

Preis

$[items.description]

${if highlightPrices}$[items.price]${else}$[items.price]${end}

Wenn Sie Formatierung oder Inhalt basierend auf dem Wert einer Spalte in der aktuellen Zeile anwenden möchten, können Sie über das Präfix row auf die Spalte zugreifen.

Beispiel: Wenn Sie eine Spalte in Ihrer Tabelle namens specialOffer haben, können Sie in einer if Anweisung mit row.specialOffer als Variablenname darauf zugreifen:

Beschreibung

Preis

$[items.description]

${if row.specialOffer}Special Offer: $[items.price]${else}$[items.price]${end}

Bitte beachten Sie, dass die if Anweisung nur eine sehr einfache Syntax unterstützt.

Wenn Sie komplexere Bedingungen ausführen müssen, nutzen Sie einen Calculate Baustein, mit dem Sie eine neue Spalte während der Ausführung basierend auf komplexeren Ausdrücken erstellen können.

Zeilen basierend auf Bedingungen formatieren

Wenn Sie das if Tag am Anfang der ersten Zelle und das passende Ende am Ende der letzten Zelle in der Zeile verwenden, erscheint die gesamte Zeile nur, wenn die Bedingung erfüllt ist. Dies ist ideal, wenn Sie z.B. eine andere Hintergrundfarbe für die Zeile verwenden möchten:

Beschreibung

Preis

${if row.specialOffer}$[items.description]

$[items.price]${end}

In diesem Beispiel wird die Zeile entsprechend dem Wert der Spalte specialOffer grün hinterlegt. Wenn keine if Anweisung übereinstimmt, wird die Standardformatierung angewendet.

Beschreibung

Preis

${if row.specialOffer}$[items.description]

$[items.price]${end}

$[items.description]

$[items.price]

Als letztes Beispiel verwenden wir eine komplexe Tabelle mit zwei verschiedenen Bedingungen und automatischer Formatierung für gerade und ungerade Zeilen und für alle Zeilen, die keiner der Bedingungen entsprechen.

Um eine andere Formatierung für gerade und ungerade Zeilen anzuwenden, können wir einfach zwei Zeilen ohne Bedingungen erstellen (in unserem Beispiel Zeile 3 und 4) und die gewünschte Formatierung für gerade (Zeile 3) und ungerade (Zeile 4) Zeilen anwenden.

Am Ende der Tabelle fügen wir einige Zeilen hinzu, die die Zwischensumme, den Mehrwertsteuerbetrag und die Gesamtsumme anzeigen, da dies ein recht häufiger Anwendungsfall ist.

Wie in diesem Beispiel gezeigt, können Sie Bedingungen auch in Zeilen verwenden, die nicht angezeigt werden sollen.

Description

Price

${if row.specialOffer}$[items.description]

$[items.price]${end}

${if row.outOfStock}$[items.description]

$[items.price]${end}

$[items.description]

$[items.price]

$[items.description]

$[items.price]

${if vat}Subtotal

${subtotal}${end}

${if vat}VAT

${vat}${end}

Total

${total}

Bilder Formatieren

Ultradox ermöglicht es Ihnen, Bilder spontan zu generieren und in Ihre Dokumente einzubetten. Sie können Diagramme, Kontaktfotos, Karten oder andere Bilder, die im Netz verfügbar sind, einfügen. Beginnen wir mit dem Einfügen eines Bildes per URL. Dies ermöglicht es Ihnen, verschiedene Bilder in Ihre Dokumente einzubetten, indem Sie einfach die URL des Bildes als Parameter übergeben.

Fügen Sie eine neue Variable in Ihr Dokument ein und verwenden Sie den Bildrenderer, um Ultradox anzuweisen, den Inhalt Ihrer Variable als Bild-URL zu behandeln:

${logo;image}

Nach dem Neuladen der Vorlage erscheint die neue Variable als Eingabeparameter. Zu Testzwecken können Sie eine Testform erstellen, indem Sie auf das Tastatursymbol im Bereich der Eingabeparameter klicken.

Geben Sie im Formular die URL eines Bildes in das Formularfeld für die Variable ${logo} ein.

Lassen Sie uns ein Bild aus dem Internet auswählen und die URL eingeben:

https://www.Ultradox.com/logo.png

Klicken Sie auf die Schaltfläche Vorschau, um das generierte Dokument anzuzeigen: Wie erwartet, erscheint das Bild im generierten Dokument. Sie können die Größe des Bildes anpassen, indem Sie die gewünschte Breite und Höhe übergeben:

${logo;image(width=2cm;height=2cm)}

Ändern Sie Ihre Vorlage und klicken Sie entweder erneut auf die Vorschau-Schaltfläche oder laden Sie das generierte Dokument einfach neu. Ihre Änderungen werden sofort berücksichtigt.

Eine vollständige Beschreibung der Formatierungsmöglichkeiten des Bild-Renderers finden Sie in der Renderer-Referenz.

${logo;image(width=2cm;height=2cm)}
{
"logo" : "https://www.Ultradox.com/logo.png"
}

   

Formatting maps

Wäre es nicht schön, die Postanschrift als Karte darzustellen?

Mit Ultradox können Sie genau das tun - und es ist ganz einfach. Um die Adresse als Karte darzustellen, geben Sie folgendes ein:

${address;map(width=10cm;height=5cm;res=1000x500)}

Die generierte Karte hat eine Breite von 10 cm und eine Höhe von 5 cm. Bitte beachten Sie, dass die Auflösung auch dieses Verhältnis wiedergeben sollte, da Ihre Karte sonst verzerrt aussieht.

Eine vollständige Beschreibung der Formatierungsmöglichkeiten des Karten-Renderers finden Sie in der Renderer-Referenz.

<p>Hey ${name}!</p>
<p>Pick up your order here:</p>
${address;map(width=200px;height=100px;res=400x200)}
{
"name" : "Larry",
"address" : "1600 Amphitheatre Parkway,Mountain View,CA 94043"
}

   

Erfahren Sie mehr

Weitere Informationen über die Templating-Sprache finden Sie in folgenden Anleitungen.

Questions and Feedback

If you have any comments on this page, feel free to add suggestions right to the Google document that we are using to create this site.

If you are not yet member of the Ultradox community on Google+, please join now to get updates from our end or to provide feedback, bug reports or discuss with other users.

Last Updated: 1/3/20