Kick-Start WordPress-Entwicklung mit Twig Einführung

Es wurde viel über die Zukunft von WordPress geschrieben, und viele glauben, dass ihr eine Templatiersprache fehlt, besonders wenn Plattformen wie Django, Ruby on Rails, Node.js, Laravel und sogar Drupal eine besitzen. Fakten wie "WordPress macht fast 25% des Webs aus " Es ist schwierig, das aktuelle PHP-basierte Templating-System in Frage zu stellen. Da die Modularität im Code jedoch noch fehlt, kann man sich fragen, wann der Kern eine Templating Engine hat.

Die guten Nachrichten sind hier richtig! Die Twig-Template-Engine zusammen mit einem Plugin namens Timber kann uns dabei helfen, sehr sauberen und modularen Code in WordPress zu schreiben. In dieser Serie werden wir die Implementierung und Integration mit WordPress besprechen. Ich beginne mit den Grundlagen von Twig und warum Sie es brauchen. In den nächsten drei Artikeln werde ich verschiedene Arten von Twig-Vorlagen erklären, die in WordPress über Timber integriert sind.

Was ist Zweig??

Twig ist eine flexible, schnelle und sichere Template Engine für PHP. Twig wird von Fabien Potencier, dem Entwickler des Symfony-Frameworks, für Sie bereitgestellt und gilt als reich an Funktionen, umfangreich, schnell und effizient. 

Wenn Sie in WordPress kodieren, mischen Sie normalerweise PHP-Teile mit HTML (so nennen wir Spaghetti-Code). Dies wird nicht als Super-Clean-Markup bezeichnet. Im Interesse eines modularen und Doing it Right ™ -Ansatzes muss der Aussicht getrennt von Daten. Mit Twig können Sie das trennen Aussicht Schicht vom Rest der Anwendung. Twig arbeitet mit dem Model-View-Controller (MVC) -Muster und hilft, sauberen Code zu erhalten.

Warum Zweige verwenden??

Im Laufe der Jahre wurden verschiedene PHP-Templating-Engines entwickelt, doch Twig übertrifft sie sicherlich in den folgenden Kapazitäten.

Funktionsreich

Twig ist eine der leistungsfähigsten und leistungsstärksten PHP-Templates. Es unterstützt die Mehrfachvererbung und das automatische Escape-Verfahren für die Ausgabe und hilft, die Vorlage in mehrere Blöcke oder Komponenten aufzuteilen, um ein modulares Design zu erhalten. Darüber hinaus können Entwickler weitere Plugins hinzufügen, um alle Front-End-Anforderungen zu erfüllen.

Schnell und effizient 

Templates, die über Twig erstellt werden, haben im Vergleich zu herkömmlichen PHP-Templates einen wesentlich geringeren Aufwand. Die Codierroutinen werden stark optimiert und Sie sparen viel Entwicklungszeit. Dies ist auch nützlich, wenn Sie das Basis-Framework ändern möchten, da Twig eine separate Templating-Ebene erstellt, die mit einem beliebigen Back-End-Framework verbunden werden kann, sei es Laravel oder WordPress.

Designer und Entwicklerfreundlich

Twig entspricht den Anforderungen von Designern und Entwicklern. Auch wenn Sie kein Code-Nerd sind, ist die Verwendung von Twig einfach und es fühlt sich gut an, eine modulare Vorlage basierend auf Komponenten zu codieren. Seine Syntax ist leicht zu verstehen und führt keine dynamischen PHP-Operationen in den Vorlagendateien ein. Alles in allem ist es recht modern und an die neuesten Kodierungsstandards anpassbar. Das Output-Escaping-Konzept ist im Umgang mit Twig sehr umfangreich. 

Beginnen wir mit einem einfachen Beispiel.

In normalem PHP erhalten Sie eine Ausgabe wie diese:

 

In Twig werden die Dinge wesentlich vereinfacht, d. H. Der obige Code wird komprimiert zu:

foo foo | escape foo | e # Abkürzung, um eine Variable zu umgehen #

Die Ausgabe von Ausgaben ist in Twig so einfach. Fügen Sie einfach doppelte Klammern hinzu, geben Sie den Namen der Variablen ein und Sie erhalten eine Ausgabe. Legen Sie eine Pfeife mit einem e daneben und wir haben angefangen, dem Zeug zu entkommen. Mehr dazu in den nächsten drei Artikeln dieser Serie.

Sichern

Twig desinfiziert und sichert die Daten selbst. Es ist exklusiv Sandkasten Modus überwacht intelligent den gesamten Code und filtert die bestmöglichen Ergebnisse. Dies bedeutet, dass die vom Benutzer erstellten Vorlagen einfach und sicher implementiert werden können. Die Sandbox-Umgebung kann nur für bestimmte Vorlagen wie diese global oder lokal aktiviert werden:

include ('post.html', sandboxed = true)

Im Falle eines Syntaxfehlers behebt Twig Ihre Datei, indem er eine Nachricht generiert, die Details wie Ihren Dateinamen und die Zeilennummer mit dem problematischen Code enthält.

Flexibel

Ich habe gerade erwähnt, dass Twig eine moderne Templating Engine ist, was bedeutet, dass Sie die Funktionalität erweitern können, da sie recht flexibel ist. Es unterstützt voll und ganz eine effiziente Lexer und Parser über die Entwickler benutzerdefinierte Tags, Filter, Funktionen usw. definieren können.

Andere

Abgesehen von den oben genannten Funktionen ist Twig sehr gut dokumentiert und vollständig getestet. Die API- und Vorlagenbibliotheken sind vollständig stabil und können alle Arten von komplexen Aufgaben verarbeiten. Ein spezielles Online-Buch und eine vollständige API-Dokumentation sind ebenfalls verfügbar.

Twig dient als neue Vorlagensprache für Drupal 8, was meine Hauptmotivation dafür ist, diese Vorlagen-Engine mit Zuversicht zu verwenden. Die guten Leute von XWP, insbesondere Weston Ruter, arbeiten an einem Vorschlag, Twig an die VIP-Standards von WordPress.com anzupassen. 

Timber: Integration von Twig mit WordPress

Bisher hat sich die gesamte Diskussion um zwei Dinge gedreht. Erstens sollten wir einen modularen Ansatz verwenden, um Vorlagen von Daten zu trennen, während benutzerdefinierte WordPress-Designs erstellt werden. Zweitens kann Twig uns dabei helfen. Aber was bringt diese beiden zusammen??

Es wurden verschiedene Anstrengungen unternommen, um die bestmögliche Integration zwischen Twig und WordPress zu erreichen. Ein mutiger Versuch ist Timber, der von einer Webagentur namens Upstatement erstellt wurde. Es verwendet die Twig Templating Engine, die es ermöglicht, modularen und sauberen Code in WordPress zu schreiben. 

Timber und Twig helfen Ihnen beim Erstellen schneller und modularer WordPress-Themes. Auf diese Weise können Sie Ihren HTML-Code von den normalen PHP-Dateien trennen, um ein nachhaltigeres Codemuster zu gewährleisten. Das Konzept, HTML und PHP voneinander zu trennen, ermöglicht es der PHP-Datei, sich strikt auf die Bereitstellung zu konzentrieren Daten und Logik, während sich die HTML-Datei (Twig-Datei) auf die Aussicht Schicht der Webanwendung.

Insgesamt führt Timber drei Hauptaufgaben aus:

  • Es integriert Twig in WordPress.
  • Es rendert die Twig-Vorlagen.
  • Es fügt einen grundlegenden WordPress-Datensatz hinzu.

Ich denke, in ihrem Leitbild heißt es alles:

Timber ist ein Tool für Entwickler, die ihren HTML-Code über eine intuitive, konsistente und vollständig zugängliche Benutzeroberfläche in qualitativ hochwertige WordPress-Designs konvertieren möchten.

  • Intuitiv: Die API wurde so geschrieben, dass sie auf die Erwartungen eines Programmierers ausgerichtet ist.
  • Konsistent: Auf alle WordPress-Objekte kann über polymorphe Eigenschaften wie Slug, ID und Name zugegriffen werden.
  • Zugänglich: Keine Black Boxes. Es werden alle Anstrengungen unternommen, damit der Entwickler zu 100% auf HTML zugreifen kann.

Wie funktioniert Holz??

Bei einem regulären WordPress-Theme werden alle Fragmente des PHP- und HTML-Codes in die gleichen PHP-Vorlagendateien integriert und geändert. Mit Timber teilen wir jedoch Vorlagendateien in zwei verschiedene Datendateien auf: die PHP-Datei und die Ansichts- / Vorlagendatei, d. H. Die Twig-Datei. 

Die erste wird also mit der Dateierweiterung gespeichert .php und der zweite hat .Zweig als seine Erweiterung. Daher, wenn Sie Vorlagendateien für erstellen single.php, Ihre Dateien werden benannt single.php und single.twig

Die erste Datei vergleicht die Daten, während die letztere die Vorlage ist, die die Daten in HTML verwendet. Auf diese Weise können Sie dynamische Vorgänge in Ihren WordPress-Designs auf modulare Weise hinzufügen.

Fassen wir alles zusammen:

Timber behandelt die Vorlagendateien Ihres WordPress-Themes in PHP- und HTML-Dateien (Twig). Auf diese Weise trennen Sie die Logik von der Anzeige. Es bietet Ihnen neue Möglichkeiten zum Erstellen, Gestalten und Anzeigen Ihres Designs.

Fazit

Es gibt viel zu lieben an Twig. Dieser Artikel war nur eine Einführung in die Vorteile der Verwendung einer Templating Engine mit WordPress. Modularer Code ist besserer Code und lässt sich leicht warten. Es ist höchste Zeit für Entwickler, diese Workflow-Schicht zu ändern, und ich bin sicher, dass Twig ihnen dabei helfen kann. 

In den nächsten Artikeln werde ich die praktische Umsetzung der Vorlagendateien mit Twig zeigen. Wir werden prüfen, wie wir Twig zum Rendern von WP-Bildern, Kommentaren und Menüs mit Codebeispielen implementieren können. Bis dahin, wenn Sie Fragen haben, können Sie gerne fragen. Vergessen Sie nicht, sich auf Twitter zu melden.