Wissensarchiv für Entwickler

Diese Seite ist nicht editierbar. Sie können den Quelltext sehen, jedoch nicht verändern. Kontaktieren Sie den Administrator, wenn Sie glauben, dass hier ein Fehler vorliegt.
====== TWIG (Template-Engine) ======

TWIG ist eine Template-Engine für PHP mit einer einfach zu erlernenden Syntax.

Um den Vorteil für den Einsatz von TWIG zu verstehen verfolgen wir am Besten bei der Umsetzung eines Projektes den folgenden Gedanken:
Es soll die Möglichkeit bestehen, dass Ihr Projekt eines Tages von mehreren Entwicklern, evtl. sogar mit mehreren Teams, weiterentwickelt werden soll.
Dafür ist es sinnvoll, die reine Programmierung (in unserem Falle mit der Programmiersprache PHP) von der optischen Gestalltung (Auszeichnungssprache HTML mit CSS) strikt zu trennen.
So kann später ein Webdesigner selbständig das Layout ändern ohne über Programmierkentnisse zu verfügen. Und andersherum kann ein Programmierer Änderungen an der Logik vornehmen, ohne sich Gedanken über das Layout machen zu müssen.

Da in TWIG-Vorlagen kein PHP verwendet werden kann (das ist schon wegen der abweichenden Dateiendung ".twig" nicht möglich) können hier lediglich mit TWIG-Platzhaltern und -Funktionen verwendet werden.
Die Platzhalter, die Variablen, Arrays und Objekte sein können, werden zuvor mit PHP im Controller vorbereitet und an die TWIG-Vorlage übergeben. So ist die Programmierung sauber vom Layout getrennt.

Die Syntax ist in der offiziellen TWIG-Dokumentation in den folgenden 4 Bereichen aufgeteilt:

  * Tags (z. B. Bedingugen oder Schleifen)
  * Filters (z. B. nur den ersten oder letzten Eintrag anzeigen)
  * Functions (z. B. Zufallswert, kleinster Wert oder größter Wert)
  * Tests (z. B. prüfen, ob Wert leer oder gerade oder ungerade ist)

  * [[http://twig.sensiolabs.org/|Offizielle Homepage von TWIG]]
  * [[http://twig.sensiolabs.org/documentation|Offizielle Dokumentation von TWIG]]

===== Installation in PhpStorm =====

Menüpunkt "Composer" --> "Add dependency..." --> "twig/twig" --> "install" auswählen

----

===== Installation ohne PhpStorm =====

Die Installation von TWIG ist durch den Abhängigkeits-Manager für PHP [[https://getcomposer.org/download/|Composer]] möglich:

<code>composer require twig/twig</code>

----

===== Templates in andere Templates einbinden =====

Es empfiehlt sich, als erstes einen Basis-Template anzulegen, welches in den anderen Seiten eingebunden wird:

<code>{% extends 'base.twig' %}</code>

Anders herum ist es natürlich auch möglich, Templates in andere Templates zu inkludieren:

<code>{% include 'footer.twig' %}</code>

----

===== Syntax =====

**Variable definieren** und Wert zuweisen:

<code twig>{% set variable = 'wert' %}</code>

  * [[twig:vars|variable Variablennamen verwenden]]

Der **Inhalt einer Variable** wird in doppelt geschweiften Klammern ausgegeben:
<code>{{ variable }}</code>

**Tags** werden in TWIG immer in einfachen geschweiften Klammern, gefolgt von einem Prozentzeichen, geschrieben:
<code>
{% tag [ | filter ] %}
	{# HTML #}
{% endtag %}
</code>

  * [[twig:tags|Die wichtigsten Tags]]
  * [[twig:filters|Die wichtigsten Filter]]

**Bedingungen** werden immer in einfachen geschweiften Klammern, gefolgt von einem Prozentzeichen, aufgerufen: <code>
{% if var == a %}...{% endif %}
</code>

  * [[twig:operators|Liste aller Operatoren]]

**Funktionen** werden immer in einfachen geschweiften Klammern, gefolgt von einem Prozentzeichen, aufgerufen: <code>
{% funktion( parameter ) %}
</code>

  * [[twig:functions|Die wichtigsten Funktionen]]

----

===== Twig-Beispiel =====

Das Twig-Beispiel zeigt die sinnvolle Aufteilung von den folgenden Komponenten einer Webseite auf:

  * Konfiguration
  * Page-Controller
  * Mastertemplate
  * Twig-View

[[twig:example|Hier geht's zum Beispiel]]

---

===== Kurzreferenz =====

^ Kurzbeschreibung ^ Beispiel ^
| Abfragen, ob eine Variable leer ist | <code> {% if Statusmeldung %}...{% endif %} </code>|
| Bedingungen | <code> {% if ergebnis == true %}..{% else %}..[% endif %}</code> |
| Inhalt einer Variable ausgeben | <code>{{ Statusmeldung }} </code>|
| Durch ein Objekt oder Array iterieren | <code>{% for entry in data %}...{% endfor %}</code> |
| Inhalt eines Array-Elements oder einer Objekt-Variable in einer Schleife ausgeben | <code>{{ entry.email }} </code>|
| For-Next-Schleife erstellen | <code>{% for i in 0..10 %}<p>{{ i }}</p>{% endfor %}</code> |
| Methode einer Klasse aufrufen | <code>{{ user.checkEmail( email ) }}</code> |
Wissensarchiv für Entwickler

Benutzer-Werkzeuge

Webseiten-Werkzeuge

Seiten-Werkzeuge
