Verwaltbare WordPress-Themes schreiben Verzeichnisse

Wenn es darum geht, WordPress-Themes zu erstellen - wie bei vielen anderen Arten von Dingen -, gibt es richtige Wege und falsche Wege. Für diejenigen von uns, die professionelle WordPress-Entwickler sein möchten, für diejenigen, die sich wirklich für die Arbeit interessieren, die wir machen, und für diejenigen, die möchten, dass unsere Arbeit von Dauer ist, müssen wir darüber nachdenken, wie Wir organisieren die Dateien und den Code, der zu unserem Thema gehört.

Ja, der WordPress-Codex enthält einen fantastischen Artikel zur Themenentwicklung, und ich glaube, dass er für jeden, der sich mit dem Erstellen von Themen befasst, unbedingt zu lesen ist - insbesondere Premium-Themen - aber es gibt einige Strategien, die nicht abgedeckt werden und die ich als sehr hilfreich empfunden habe, da sie sich auf das Erstellen, Freigeben und Verwalten von Themen im Laufe der Zeit beziehen.

In den nächsten beiden Artikeln werden wir uns einige Strategien anschauen, die ein wenig tiefer in die Themenentwicklung eingehen und die uns dabei helfen werden, unsere Themen so zu strukturieren, dass sie nicht nur den Richtlinien von WordPress folgen Codex wird es jedoch auch wesentlich einfacher machen, nicht nur WordPress voranzutreiben, zu aktualisieren und zu verbessern, sondern auch, wenn sich unser Thema weiterentwickelt.

Ein Wort zu Themenentwicklungspraktiken

Die Qualität der Organisation der Dateien und des Codes, der zum Erstellen von WordPress-Themes verwendet wird, ist ein heißes Thema. 

Es ist klar, dass dies eines der Dinge ist, über die Entwickler und Designer so gerne sprechen, dass sie sich in etwas verwandelt haben, das die Menschen hassen. Das bedeutet, dass andere häufig schlechte Themen für WordPress kommentieren und dieses Argument dann als Grund dafür verwenden, warum WordPress nicht nur für das Bloggen eine schlechte Plattform ist, sondern auch aus anderen Gründen.

Das ist nicht der Punkt oder das Argument von dem, was wir hier diskutieren werden, noch soll es diese Art von Diskussion in den Kommentaren anregen. Stattdessen setzt diese zweiteilige Serie Folgendes voraus:

  • Sie sind ein WordPress-Entwickler, der Themen erstellt oder erstellt hat,
  • Sie sind ein WordPress-Entwickler, der die Grundlagen der Themenentwicklung bereits aus den Themen des Codex kennt,
  • Sie sind ein WordPress-Entwickler, der nach Möglichkeiten sucht, Prozesse und Organisationsstrukturen zu verbessern, die bereits vorhanden sind, um robustere Produkte zu erstellen.

Natürlich wir Alle haben unsere eigenen Methoden, so dass die Empfehlungen, die in dieser Serie geteilt werden, möglicherweise nicht mit Ihrem aktuellen Workflow funktionieren. Vielleicht möchten Sie sich nicht ändern - und das ist gut so! - oder vielleicht suchen Sie nach einer Veränderung.

Unabhängig vom Fall basiert alles, was hier geteilt wird, auf der Erfahrung mit dem Erstellen und Verwalten erstklassiger WordPress-Themes und hat es wesentlich einfacher gemacht, sie im Laufe der Zeit sowohl themenspezifisch als auch hinsichtlich der Kompatibilität mit WordPress zu verwalten.

Alles über Wartbarkeit

Einer der schwierigsten Teile der Softwareentwicklung ist nicht der Versand der ursprünglichen Version ist hart an und für sich), aber es behält das Produkt nach der Veröffentlichung bei. 

Dies bedeutet nicht nur, dass die Codebase weiterhin mit der zugrunde liegenden Infrastruktur kompatibel ist - worüber wir im nächsten Abschnitt sprechen werden -, sondern auch, dass die Dateien so angeordnet sind, dass sie für das Entwicklungsteam verständlich sind , dass sie ein Maß an Zusammenhalt haben und dass sie einen Reim und einen Grund dafür haben, warum sie benannt und in die Art und Weise gebracht werden, in der sie sind.

Aus dem Kodex wissen wir, dass es eine Reihe von Dateien gibt, die den Kern des Designs ausmachen. Dazu gehören Vorlagen, eine Funktionsdatei und mindestens ein Stylesheet. 

Was passiert jedoch, wenn Ihr Thema komplizierter wird? Sag, dass du…

  • Führen Sie eine Art CSS-Vorverarbeitung ein, z. B. LESS oder Sass? 
  • Wie sieht es mit der Minifizierung Ihres JavaScript-Codes aus?? 
  • Was ist mit Partials - oder wiederverwendbaren Vorlagenteilen -, die im gesamten Design verwendet werden??
  • Haben Übersetzungen einen bestimmten Ort zum Leben?? 
  • Was ist mit Hilfsfunktionen und anderen Hilfsfunktionen, mit denen die Geschäftslogik von der Präsentationslogik getrennt bleibt??
  • Was passiert, wenn Sie Bibliotheken von Drittanbietern einladen?? 

Alle oben genannten Elemente können in einem WordPress-Designverzeichnis sauber organisiert werden. Wir werden uns alle etwas ausführlicher ansehen und die Gründe für ihre Platzierung im Themenverzeichnis in der Hoffnung betrachten, dass dadurch die Themenentwicklung sauberer wird und die Wartbarkeit erheblich erleichtert wird.

1. Stylesheets und JavaScript

Obwohl diese in vielen Zusammenhängen unabhängig voneinander diskutiert werden können, da sie für unterschiedliche Dinge verantwortlich sind, ist ihre Organisationsstruktur innerhalb eines Themas so ähnlich, dass es sinnvoll ist, sie zusammenzufassen.

Vorausgesetzt, Sie verwenden keine Art von CSS-Vorprozessor, sollte für jeden dieser Dateitypen ein Verzeichnis vorhanden sein. Das heißt, Sie sollten eine haben css Verzeichnis und a js Verzeichnis (oder vielleicht nennen Sie sie Stile und Javascript). 

In jedem Fall sollte sich jeder Dateityp in einem eigenen Verzeichnis befinden. Von dort können Sie dann verwenden Functions.php um die Dateien bei Bedarf zu registrieren und zu erfassen. Wenn es sich um eine Datei handelt, die im gesamten Thema verwendet wird, registrieren Sie sie unbedingt.

Wenn es sich jedoch um einen Stil oder ein Skript handelt, das nur für eine bestimmte Vorlage, einen bestimmten Beitragstyp oder sogar für einen Teil des Dashboards verwendet wird, können und sollten Sie die Datei bedingt bedingen.

Aber lassen Sie uns das sagen sind mit einem Präprozessor. An diesem Punkt bleiben Ihnen Ihre vorverarbeiteten Dateien und Ihre nachverarbeiteten Dateien. Abhängig von der Art Ihres Projekts können Sie möglicherweise nicht alles auf eine einzige Datei reduzieren. 

ich würde Empfehlungen zur Benennung von Dateien geben; Die Variation der Themen, die Art und Weise, wie Menschen ihre Arbeit aufbauen, und das Problem, das ein bestimmtes Thema darstellt, versuchen jedoch, die Probleme zu lösen, und das lässt uns über den Rahmen dieser speziellen Strategie hinausgehen.

Wenn Sie einen Vorprozessor verwenden, empfehle ich Ihnen, ein Unterverzeichnis in der css und js Verzeichnisse aufgerufen dev (oder Entwicklung oder was auch immer Sie sich entscheiden, es anzurufen). In diesem Verzeichnis schreiben Sie alle Ihre vorverarbeiteten Dateien, und lassen Sie dann das Werkzeug Ihrer Wahl (CodeKit, Grunt oder ähnliches) die verarbeiteten Dateien in das Stammverzeichnis des Ordners ausgeben css und js Verzeichnisse.

Auf diese Weise haben Sie immer noch Code verarbeitet, kombiniert und / oder minimiert und verfügen über ein Verzeichnis, das die Quelle dieser Dateien enthält. Wenn es Zeit für das Versenden des Designs ist, haben Sie nicht nur die Functions.php-Aufrufdateien in den entsprechenden Verzeichnissen, sondern Sie können auch die ausschließen dev Verzeichnis aus dem endgültigen Build, so dass der Endbenutzer ein kleineres Designpaket erhält und nichts weiter als das Design benötigt.

2. Schablonenteile

Schablonenteile werden oft als Teiltitel bezeichnet (in anderen Sprachen als in WordPress) und werden häufig mit aufgerufen get_template_part in WordPress. Kurz gesagt, ihr Zweck besteht darin, sich wiederholenden Code zu abstrahieren, der leicht in mehrere Vorlagen integriert werden kann.

Ein Beispiel hierfür wären zum Beispiel die Post-Metadaten. Dies beinhaltet normalerweise die folgenden Informationen:

  • der Name des Autors
  • das Datum, an dem der Beitrag veröffentlicht wurde
  • die Kategorie und die Tags, unter denen der Beitrag abgelegt wurde
  • ob der Beitrag Kommentare enthält (und wenn ja, wie viele Kommentare)

Da diese Informationen in mehreren Vorlagen vorhanden sein können (einzelne Posts, Seiten, Archive usw.), ist es sinnvoll, sie in eine einzige Datei zu abstrahieren und nur dann auf diese eine Datei zu verweisen, wenn Sie sie benötigen.

Die Sache ist, Post Metadaten sind nicht die nur Art von Informationen, die in einem Thema wiederverwendet werden. Identifizieren Sie zu diesem Zweck die wiederverwendeten Kernelemente, fassen Sie sie in eine Datei zusammen und erstellen Sie dann eine partials Verzeichnis. 

Benennen Sie von hier aus jedem Schablonenteil etwas, das angibt, was es darstellt (z post-meta.php, gravatar.php, navigation.php, pagination.php, und so weiter) und rufen Sie das Partial in der Vorlage an, wo es notwendig ist.

Zum Beispiel können Sie in Post-, Seiten- und Archivvorlagen aufrufen get_template_part ('partials / post-meta');. Macht das Lesen viel einfacher und sorgt für ein Single Platz, um Änderungen vorzunehmen, und nicht in jeder Vorlage.

3. Übersetzungen

Wenn Sie ein Thema schreiben, das internationalisiert ist, und wenn Sie es für die Öffentlichkeit veröffentlichen, sollten Sie dies tun, dann gibt es einen sehr klaren und sauberen Weg, dies zu tun.

Wenn dies für Sie ein neues Thema ist, empfehle ich Ihnen, den Artikel im Codex zu lesen. Dort erfahren Sie alles, was Sie wissen müssen, wie Sie Strings für die Übersetzung vorbereiten, verfügbare Werkzeuge usw..

Dann empfehle ich Ihnen, sicherzustellen, dass Sie einen bestimmten Platz in Ihrem Thema für Ihre Sprachen haben. Im Allgemeinen empfehle ich, ein Verzeichnis mit dem Namen in Ihrem Design anzulegen lang oder Sprachen und dann das fallenlassen .po und .mo Dateien in das Verzeichnis. Dies ist auch eine allgemein anerkannte und erwartete Praxis in der gesamten WordPress-Community.

Dadurch werden die Übersetzungen nicht nur an die eigene Stelle innerhalb der Themenstruktur verschoben, sondern sie zeigen auch an, wo nach Übersetzungen gesucht werden soll und wo nach Dateien gesucht werden muss, die die zu übersetzenden Zeichenfolgen enthalten.

Auch hier geht es um Kohäsion und um sicherzustellen, dass Dinge von ähnlicher Nützlichkeit in vernünftiger Weise zusammengefasst werden.

4. Hilfsdateien und Hilfsfunktionen

Abhängig von Ihrem Entwicklungshintergrund werden Funktionen, mit denen Sie Ihre Arbeit erledigen und die Geschäftslogik von der Präsentationslogik (oder in vielen Fällen von PHP direkt aus HTML) unterscheiden, als Hilfsfunktionen oder Hilfsfunktionen bezeichnet.

Für die Zwecke dieser Serie werden wir sie als Hilfsfunktionen bezeichnen, obwohl sie wissen, dass sie alle in einem Gleichen sind.

Dies wirft jedoch zwei Fragen auf:

  1. Sollten diese nicht in leben Functions.php?
  2. Wenn sie nicht wohnen Functions.php, Wo leben sie?

Kurz gesagt, ich bin der Meinung, dass Helfer und Dienstprogramme dies tun sollten nicht lebe in Functions.php. Meine Faustregel lautet einfach: Wenn der Code, den ich schreibe, direkt mit WordPress kommuniziert, wie z add_theme_support, dann gehört es rein Functions.php. Wenn es jedoch Code gibt, den ich schreibe, wird eine benutzerdefinierte Abfrage ausgeführt, um Informationen abzurufen und das verarbeitete Ergebnis an die Vorlage (oder den Vorlagenteil) zurückzugeben, dann gehört es zu einer Hilfsfunktion.

So wie WordPress über Vorlagenvorlagen oder Vorlagenfunktionen verfügt, die in einer Vorlage aufgerufen werden können, z der Inhalt(), behandeln Sie Hilfsfunktionen auf ähnliche Weise - Sie können sie in Ihren Vorlagen und in Ihren Partials aufrufen, sie befinden sich jedoch in einer eigenen Datei.

Da diese Helferfunktionen nicht leben Functions.php, dann sollten sie in einer eigenen Datei leben und diese Datei sollte irgendwo in der Codebasis des Themas referenziert werden, oder? Darüber hinaus ist es durchaus möglich, dass Sie Ihre Helfer in mehrere Dateien aufteilen, je nach Komplexität Ihres Designs.

Zu diesem Zweck empfehle ich die Einführung eines inc oder ein beinhaltet Verzeichnis im Kern Ihres Designs. Legen Sie von dort Ihre Hilfedateien in diesem Verzeichnis ab include_once Die Hilfedatei oben in Ihrer Funktionsdatei und die Funktionen sind für den Rest Ihres Themas leicht zugänglich.

5. Bibliotheken von Drittanbietern

Schließlich gibt es Zeiten, in denen wir Bibliotheken von Drittanbietern in unsere Themen aufnehmen werden. Einfach ausgedrückt, sind dies Werkzeuge, die von anderen entwickelt wurden und die frei verfügbar sind, um sie zu verwenden und zu verbreiten, und die es uns auch leicht machen, uns auf die Arbeit anderer einzulassen. 

Wo sollen sie wohnen? Ehrlich gesagt hängt dies von der Art der Bibliothek ab, mit der Sie arbeiten. Bibliotheken können beispielsweise in Form von CSS, JavaScript oder PHP vorliegen. Als solches sollte es einen Platz dafür geben:

  • Wenn Sie mit einer JavaScript-Bibliothek arbeiten, erstellen Sie eine lib Verzeichnis in Ihrem js Verzeichnis. Dies zeigt an, dass der Ordner JavaScript-Bibliotheken enthält.
  • Wenn Sie in ähnlicher Weise mit CSS arbeiten, z. B. die Verwendung von Symbolschriftarten, erstellen Sie eine lib Verzeichnis in Ihrem css Verzeichnis. Dies bedeutet wiederum, dass Sie über eine CSS-Bibliothek verfügen.
  • Wenn Sie eine PHP-Bibliothek verwenden, empfehle ich die Erstellung einer lib Verzeichnis im Stammverzeichnis des Designverzeichnisses. Dies bedeutet, dass es sich nicht um JavaScript oder CSS handelt und dass es zur Funktionalität des Kerndesigns beiträgt (das weitgehend aus PHP-Funktionsaufrufen, Vorlagen-Tags usw. besteht)..

Natürlich habe ich auch einige Entwickler gesehen, die eine erstellen lib Verzeichnis und dann erstellen js, css, und php Unterverzeichnisse innerhalb der lib Verzeichnis. Es ist eine kleine Umkehrung der oben angegebenen Tipps. 

Es ist keine schlechte Strategie. Ich mag diesen Ansatz jedoch nicht, weil er JavaScript-, CSS- und PHP-Dateien in mehrere Verzeichnisse des Designs verteilt.

Über die WordPress-Kompatibilität

Das Erstellen einer organisierten Verzeichnisstruktur ist nur ein Teil davon. WordPress hat eine Vorlagenhierarchie, die eine bestimmte Namenskonvention erfordert. Folgt logischerweise nicht, dass unsere benutzerdefinierten Dateien dasselbe tun sollen?

Wie sieht es außerdem mit den Namenskonventionen von Funktionen aus? Tun sie Echo Daten oder Rückkehr Daten? Darüber hinaus wissen wir, dass wir korrekte API-Funktionsaufrufe durchführen und keine veralteten Funktionen von WordPress verwenden?

Im nächsten Artikel werden wir über all dies sowie über Tools sprechen, die wir installieren können, um diese Fallstricke zu vermeiden. Wir diskutieren auch, wie sie funktionieren und warum sie zusammen mit Funktionsbenennungskonventionen beim Erstellen von Themen von Bedeutung sind.

Im Moment haben wir jedoch Strategien für die Dateiorganisation beschrieben, die ausreichen sollten, um Sie zu beschäftigen, bis der nächste Artikel der Serie veröffentlicht wird. 

Wenn Sie etwas hinzuzufügen haben, tun Sie dies bitte in den Kommentaren!