Das eigene WordPress-Theme erstellen – #2: Die style.css und die Metadaten eures Themes

In dieser Serie geht es darum, ein WordPress-Theme zu erstellen – von Grund auf. Im zweiten Teil widmen wir uns einer der wenigen Dateien, ohne die kein WordPress-Theme auskommt: Der style.css.

Die style.css ist eine der wichtigsten Dateien, wenn es um die Erstellung eines WordPress-Themes geht. Ein funktionierendes Theme kann theoretisch nur aus style.css und index.php bestehen – mehr Dateien braucht es im Grunde nicht. In die style.css-Datei kommen nämlich die sogenannten Header-Informationen eures Themes.

Notwendige Angaben für ein WordPress-Theme

Für ein funktionierendes Theme reicht die Angabe des Namens. Für das Hochladen im Theme-Directory müssen allerdings mehr Informationen eingetragen werden. Zwingend notwendig sind die folgenden Angaben:

Theme Name – der Name des Themes.
Description – eine kurze Beschreibung des Themes.
Author – der Name des Entwicklers.
Version – die Versionsnummer des Themes.
Licence – die Lizenz, unter der das Theme steht.
Licence URI – der Link zu der Lizenz.

Die ersten Punkte sollten selbsterklärend sein. Zum Thema Lizenz: Alle Themes, die in das Theme-Directory von WordPress aufgenommen werden sollen, müssen zu 100 Prozent der GPL oder einer kompatiblen Lizenz entsprechen. Darauf müsst ihr auch bei eingebundenen Skripten oder ähnlichem achten.

Wenn ihr euch mal unsicher seid, ob eine Lizenz kompatibel ist, könnt ihr beispielsweise im #themereview-Channel des offiziellen WordPress-Slack fragen. Wie ihr euch dafür registrieren könnt, zeigt eine Seite auf make.WordPress.org.

Kurz und übersichtlich: Die style.css-Datei unseres Themes

Neben diesen vorgeschriebenen Angaben gibt es noch ein paar weitere. So sieht die style.css-Datei unseres Themes aus:

/*
Theme Name: Bornholm
Theme URI: https://florianbrinkmann.com/wordpress-themes/bornholm/
Author: Florian Brinkmann
Author URI: https://florianbrinkmann.com
Description: Bornholm is great for your photoblog or portfolio website. The theme comes with two page templates. One template shows the last galleries from your categories and the other shows all your galleries on one page. Furthermore, it brings two widgets that allow you to display the last galleries and to display featured galleries. If you already have images on your blog, you should regenerate the thumbnails.
Version: 1.0.6
License: GNU General Public License v2
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: white, light, two-columns, right-sidebar, custom-menu, post-formats, sticky-post, translation-ready, threaded-comments, photoblogging
Text Domain: bornholm
*/
Code-Sprache: CSS (css)

Zusätzlich haben wir hier noch die Theme URI eingefügt, die auf eine Seite mit genaueren Details zum Theme verweisen muss. Eine Demo-Version sollte hier nicht verlinkt werden. Die Zeile Author URI ist ebenfalls neu und enthält eine URL zur Website des Entwicklers. Mit der Angabe von Tags könnt ihr euer Theme im Theme-Directory besser auffindbar machen. Die verfügbaren Begriffe könnt ihr unter dem Punkt „Feature Filter“ auf der Theme-Seite von WordPress.org einsehen. Zum Schluss folgt noch die Angabe der Text-Domain, die für die Übersetzung des Themes notwendig ist.

Mehr werden wir in diese Datei nicht eintragen. Natürlich könnte hier auch der CSS-Code des Themes Platz finden. Dagegen spricht aber, dass sich die Datei dann nicht komplett komprimieren ließe.

Der Code zur Serie auf GitHub

Den Quelltext zu der Serie gibt es auf GitHub. Im dazugehörenden Repository findet ihr Tags, die jeweils dem Stand des Themes nach einem Teil der Reihe entsprechen. Den Tag zum Stand dieses Artikels findet ihr hier.

Die weiteren Teile meiner WordPress-Reihe:

Dieser Beitrag ist eine Übernahme meines Beitrags für t3n.de.

Notwendige Angaben für ein WordPress-Theme

Kurz und übersichtlich: Die style.css-Datei unseres Themes

Der Code zur Serie auf GitHub

Schreibe einen Kommentar Antworten abbrechen