Der Dokumentvorlagen-Editor in Rentman ermöglicht es dir, deine Vorlagen ganz einfach nach deinen Wünschen und den Bedürfnissen deines Unternehmens anzupassen. Unser Editor bietet dir verschiedene Optionen, um deine Vorlage mit einem WYSIWYG-System („What You See Is What You Get“ – was du siehst, ist das, was du bekommst) anzupassen, also ohne dass du dafür Code kennen oder bearbeiten musst.

Wir wollten jedoch unseren fortgeschrittenen Nutzern die Möglichkeit geben, umfassendere Änderungen an ihren Vorlagen vorzunehmen, die über die Optionen im WYSIWYG-System hinausgehen. Deshalb hast du bei uns die Möglichkeit, das CSS deiner Dokumente zu bearbeiten, Variablen zu manipulieren und Logiken einzubauen sowie bedingtes Styling anzuwenden.

Hinweis: Um diese Optionen nutzen zu können, benötigst du technisches Wissen. Falls du über dieses Wissen nicht verfügst, empfehlen wir, einen externen Dienstleister zu beauftragen, der diese Änderungen für dich vornimmt, oder unseren Service zur Anpassung von Dokumentvorlagen zu nutzen. Bitte beachte, dass wir keinen Support für die Implementierung oder Fehlerbehebung von CSS, Variablen oder bedingtem Styling anbieten, wie du auch in unserem Supportumfang nachlesen kannst.

.

CSS

Falls du das CSS deines Dokuments manuell anpassen möchtest, damit es nach deinen Vorstellungen aussieht, kannst du dies im Stil-Menü des Dokumentvorlagen-Editors tun.:

Bevor du beginnst, das CSS anzupassen, empfehlen wir dir, zunächst ein Theme anzuwenden. Dadurch erhältst du eine Grundstruktur, die du anschließend nach deinen Vorstellungen anpassen kannst.

CSS-Klassen

Jedes Element in der Rentman-Dokumentvorlage verfügt über eine CSS-Klasse, die du in deinem CSS nutzen kannst, um das jeweilige Element individuell zu gestalten. Zwar haben wir keine vollständige Liste der Klassen, die wir zur Verfügung stellen können, aber du kannst ganz einfach die benötigte CSS-Klasse herausfinden, indem du im Dokumentvorschau-Bereich die „Element untersuchen“-Funktion deines Browsers verwendest.

Im obigen Beispiel siehst du, dass Zeilen mit Mietartikeln im Materialmodul die Klasseitem rental haben.

Tipp: Zeilen können dynamisch generiert werden und möglicherweise die gleiche Klasse besitzen. Zum Beispiel haben alle Mietartikel die oben genannte Klasse. Um gezielt einzelne Artikel anzusprechen, kannst du Pseudo-Sektoren wie:nth-child(i) verwenden.

PHP

Wenn du den Textblock in einer Systemvorlage bearbeitest, wirst du feststellen, dass sich die Darstellung der Informationen ändert. Während du vorher beispielsweise den Namen deines Kunden als „Rentman“ gesehen hast, erscheint er nun als {$f.customer.displayname}. Das ist eine Variable. Diese Variable ruft den Anzeigenamen des Kunden für das Projekt ab, aus dem du das Dokument generierst, und fügt ihn im fertigen Dokument anstelle der Variablen ein.

Variablenmodifikatoren

In den meisten Fällen reicht es aus, eine spezifische Variable einfach in dein Dokument einzufügen, um sie anzuzeigen. Es gibt jedoch Situationen, in denen du eine Variable anpassen möchtest oder musst. Beispielsweise musst du einen Preis in eine Zahl umwandeln, bevor du ihn in einer If-Bedingung mit einer anderen Zahl vergleichen kannst (siehe den Abschnitt unten).

Dies kann erreicht werden, indem ein Variablenmodifikator zur Variablen selbst hinzugefügt wird. Ausgehend von dem oben genannten Beispiel und unter Verwendung des Modifikators regex_replace sieht die Variable für den Gesamtpreis des Projekts, {$f.project_total_price}, so aus, wenn sie in eine Zahl umgewandelt wird:

{$f.project_total_price|regex_replace:'/[^0-9]/':''|intval}

Bitte lies diese dir diese Seite zu Variablenmodifikatoren durch, um zu erfahren, welche Arten von Variablenmanipulationen möglich sind..

Hinweis: Nicht alle Variablenmodifikatoren sind im Vorlagen-Editor erlaubt. Wenn ein Modifikator nicht erlaubt ist, wird dir der Editor dies mitteilen. Sieh dir auch den Abschnitt unten an, in dem einige benutzerdefinierte Modifikatoren und Funktionen aufgeführt sind, die du in unserem Vorlagen-Editor verwenden kannst.

"lcfirstLocal",
"lcfirstlocal",
"ucfirstLocal",
"ucfirstlocal",
"formatTime",
"formatBytes",
"formatDateTime",
"formatDiscount",
"formatDistance",
"formatDuration",
"formatMonth",
"formatDay",
"formatDate",
"formatBoolean",
"formatNumber",
"formatPrice",
"formatPercentage",
"formatSpellout",
"formatPriceCustom",

public const F_TYPE = [
       'is_array',
       'is_bool',
       'is_countable',
       'is_int',
       'is_integer',
       'is_object',
       'is_null',
       'is_string',
       'is_float',
       'is_double',
       'isset',
   ];

   public const F_CAST = [
       'intval',
       'boolval',
       'doubleval',
       'floatval',
   ];

   public const F_DATETIME = [
       'time',
       'date',
   ];

   public const F_ARRAY = [
       'empty',
       'count',
       'sizeof',
       'current',
       'explode',
       'array_key_exists',
       'array_keys',
       'array_values',

   ];

   public const F_REGEX = [
       'regex_replace',
   ];

   public const F_STRING = [
        'nl2br',
        "ucfirst",
        "lcfirst",
        "ucwords",
        "htmlentities",
        "htmlspecialchars",
        "trim",
        "ltrim",
        "rtrim",
        "strtolower",
        "strtoupper",
        "mb_strtoupper",
        "count",
        "escape",
        "strlen",
        "mb_strlen",
        "substr",
        "mb_substr",
        "str_replace",
        'str_pad',
        'wordwrap',
        'sprintf',
        'strip_tags',
        'urlencode',
   ];

   public const F_MISC = [
        'min',
        'max',
        'abs',
        'rand',
        'number_format',
        'round',
        'ceil',
        'floor',
   ];

   public const F_RENTMAN = [
        "Rentman\\getTemplateVal",
        "sumprice",
        "substr",
        "multiplyprice",
        "removePrice",
        "toDate",
        'buildrow',
        'roundcents',
   ];

If-Anweisungen

If-Anweisungen sind, wie der Name schon sagt, eine Möglichkeit, deinen Dokumenten eine bestimmte Aktion auszuführen, wenn eine bestimmte Bedingung erfüllt ist, andernfalls wird etwas anderes ausgeführt. Eine solche Anweisung findest du im allerersten Textblock aller unserer Systemvorlagen für Angebote, Verträge und Rechnungen. Wenn du diesen Textblock bearbeitest, siehst du den folgenden Code:

{$f.customer.displayname}
{iff $f.contact > 0}attn. {$f.contact.firstname} {$f.contact.surfix} {$f.contact.lastname}
{/iff}{$f.customer.post_street} {$f.customer.post_number}
{$f.customer.post_postalcode} {$f.customer.post_city} {iff $f.customer.country != $company.country}{$f.customer.country}{/iff}

Die Bedingung in diesem Fall ist die folgende und wird immer zu Beginn der If-Anweisung definiert:

{iff $f.contact > 0}

Wenn der von der Variable {$f.contact} zurückgegebene Wert (die Anzahl der Ansprechpartner, die der Kunde hat) größer als 0 ist, wird im Dokument das angezeigt, was vor dem schließenden Tag {/iff} eingefügt wurde. In diesem Fall handelt es sich um den Text „attn.“ sowie den Vornamen, Nachnamen und Titel des Ansprechpartners. Wenn diese Bedingung nicht erfüllt ist (der Kunde hat keinen Ansprechpartner), wird alles innerhalb der If-Anweisung ignoriert, und es werden keine entsprechenden Informationen gedruckt. 

Ein weiteres Beispiel für ein zusätzliches Eingabefeld mit Ja/Nein-Eingabe:

{iff $f.project.custom_1 == 'Yes'}
    The answer was yes
{else}
    The answer was no
{/iff}

Das kann auch mit mehr als einer Bedingung durchgeführt werden, indem du {elseif} verwendest. Zum Beispiel:

{iff $name ='Fred'}
    Welcome Sir.
{elseif $name = 'Wilma'}
    Welcome Ma'am.
{else}
    Welcome, whatever you are.
{/iff}

Bedingtes Styling

Bedingtes Styling ermöglicht es dir, eine von dir definierte CSS-Klasse anzuwenden, wenn die von dir gewählte Spalte einen bestimmten Wert hat. Angenommen, du hast ein zusätzliches Eingabefeld für deine Materialien, das zwei Werte haben kann: blau und orange. Durch bedingtes Styling kannst du festlegen, dass Materialzeilen mit der Farbe blau die CSS-Klasse .blue haben, während Materialzeilen mit der Farbe orange die CSS-Klasse .orange haben.

Nachdem du dies eingerichtet hast, kannst du die Materialzeilen basierend auf ihrer Klasse separat gestalten: Beispielsweise kannst du für das „orange“-Material einen orangen Hintergrund in deiner Tabelle festlegen, während die „blauen“ Materialien einen blauen Hintergrund erhalten.

Sobald du bedingtes Styling erfolgreich anwendest, sind die visuellen Änderungen, die du an deinem Dokument vornehmen kannst, nahezu unbegrenzt. Jedes Styling, das du auf deine Dokumente anwenden kannst, kannst du auch auf die Klassen anwenden, die du über das bedingte Styling definierst.

Bedingtes Styling kann im Bereich „Optionen“ (Ausschneiden/Einfügen) eines ausgewählten Moduls definiert werden:

Struktur

Beim Öffnen des Bereichs „Optionen“ (Ausschneiden/Einfügen) wird dir ein Fenster wie dieses angezeigt:

Um bedingtes Styling anzuwenden, kannst du den folgenden Code direkt vor der schließenden Klammer der Optionen (Ausschneiden/Einfügen) hinzufügen:

,
  "conditionalstyling": [
    {
      "condition": {
        "field": "templVarName",
        "comparator": "comparatorValue",
        "value": {
          "value": "valueValue"
        }
      },
      "class": "cssClass"
    }
  ]

Du musst dann den obigen Code anpassen, um deine Bedingungen festzulegen, wobei:

• templVarName = der Wert, den du für das Feld templVar in der Spalte sehen möchtest, auf die du die Bedingung anwenden willst. Wenn du das obige Screenshot-Beispiel verwendest und eine Bedingung basierend auf dem Wert des Faktors (staffel) definieren möchtest, würdest du “staffel”schreiben.
• comparatorValue = die Art des Vergleichs, den du zwischen dem Wert im zuvor definierten Feld und dem von dir festgelegten Vergleichswert durchführen möchtest. Du kannst verschiedene Vergleichsoperatoren verwenden, wie: = (gleich), != (ungleich), > (größer als), < (kleiner als), *= (enthält), *!= (enthält nicht). Wenn du überprüfen möchtest, ob der Faktor größer als 3 ist, würdest du hier > verwenden.
• valueValue = der Wert, den du vergleichen möchtest. Wenn du überprüfen möchtest, ob der Faktor größer als 3 ist, würdest du hier 3 schreiben. Es ist auch möglich, den Wert eines anderen Feldes zu vergleichen, wie folgt: "value":{"value":"templVarName", "type: "templVar"}}
• cssClass = die CSS-Klasse, die du den Zeilen zuweisen möchtest, die die von dir definierte Bedingung erfüllen. Zum Beispiel factorGreaterThanThree