Starter Content für Themes

Kennt Ihr das auch? Ihr sucht nach einem neuen Theme und flaniert durch verschiedene Showcases, schaut Euch Livedemos und Vorschaubilder an, die Euch das Theme auf verschiedenen Auflösungsstufen, für Desktop, Tablet und Mobile zeigen. Dann habt Ihr Euch endlich entschieden, ladet das Theme herunter, haut es auf Eure frische WordPress Installation und irgendwie sieht nichts so aus, wie erwartet?

Jetzt beginnt ein ewiges Herumfrickeln, bis über den Customizer oder gar die Theme Optionen die Einstellungen so getroffen sind, dass alles passt. Neue Seiten müssen angelegt werden, um die entsprechenen Page Templates zu testen und Widgets müssen konfiguriert werden. Je nachdem wie umständlich das Ganze wird verfliegt da schnell das anfängliche Hochgefühl, endlich das Theme gefunden zu haben und Frust stellt sich ein.

Manche Themeentwickler⋅innen legen ihren Meisterwerken deshalb Dummydaten bei, welche über den WordPress Importer auf die nagelneue WordPress Installation geladen werden können und so zumindest ein wenig Arbeit abnehmen. Das war zumindest immer eine nette Geste, aber bis WordPress 4.7 fehlte einfach ein ordentlicher Workflow für dieses Problem. Doch jetzt gibt es ein neues Feature, das zwischen all dem Jubel um PDF-Vorschaubilder, REST-API, Shortcuts und ich weiß nicht was, ein bißchen untergegangen ist: Starter Content. STARTER CONTENT! 🎉

Wenn Ihr mit einer frischen WordPress Installation in den Customizer geht, um Twentyseventeen zu konfigurieren, dann werdet Ihr nicht einfach einen leeren Blog mit einem „Hallo Welt“-Beitrag vorfinden. Vielmehr findet Ihr eine vollständig konfigurierte WordPress Installation vor. Es gibt ein Menü, eine Frontpage, eine About-Seite, einen Blog und eine Kontaktseite. Die Sidebar ist schon komplett konfiguriert und es gibt ein „Find us“-Textwidget, die Suche und ein Widget „About this site“. Sogar das Hauptmenü und das Socialmenü im Footer sind schon konfiguriert.

Ein⋅e Anwender⋅in kann nun einfach durch den Customizer spazieren gehen, die Widgets anpassen, raushauen, ersetzen, die Menüs abändern und schließlich mit „Speichern“ die Einstellungen speichern. Der Theme-Installations-Workflow ist also komplett in den Customizer integriert.

Bisher funktioniert dies allerdings nur mit frischen Installationen, auf denen noch keine Seiten, Beiträge, Widgets oder sonstige Inhalte angelegt wurden. Es gibt allerdings schon Planungen, wie das Konzept am Besten auf alte Seiten übertragen werden kann.

Wie bereite ich „Starter Content“ für mein Theme auf?

Der ganze Zaubertrick hängt nun natürlich an den Entwickler⋅innen von WordPress Themes. Sie müssen den Starter Content bereitstellen und die Konfiguration übernehmen. Dieser Beitrag gibt eine Übersicht, wie das zu bewerkstelligen ist.

Alles spielt sich dabei in der Aktion after_setup_theme ab. Hier kann die Unterstützung von starter-content mit Hilfe von add_theme_support() deklariert werden. Das Interessante ist nun der Konfigurationsarray, welcher mit dieser Deklaration übergeben wird.

Wir können Widgets, Posts, Attachments, Navigations-Menüs, Optionen und Theme-Mods in diesem Array übergeben. Wenden wir uns den einzelnen Möglichkeiten nach und nach zu:

Widgets

WordPress liefert schon eine ganze Reihe vorkonfigurierter Widgets mit. Sagen wir, in unserem Theme gibt es eine Sidebar mit der ID sidebar-1 und wir wollen in dieser das Suchwidget und ein Textwidget mit Öffnungszeiten darstellen, so können wir das wie folgt erreichen:

Im widgets-Bereich unseres Konfigurationsarrays sagen wir also: In der sidebar-1 sollen diese beiden Widgets auftauchen. Dies sind die vorformatierten Widgets, welche der WordPress Core bereitstellt:

• text_business_info
• text_about
• archives
• calendar
• categories
• meta
• recent-comments
• recent-posts
• search

Sagen wir aber, Du möchtest einen individuellen Text in ein Textwidget einpflegen, wie würde das gehen? Statt einem einfachen Textstring übergeben wir nun einen Array. Das erste Element des Arrays enthält den Widget-Identifikator (die sogenannte id_base), hier text, der zweite Array enthält alle Informationen, welche das Widget über die $instance zum Rendern des Widgets benötigt:

Dies funktioniert dann natürlich nicht nur mit den schon im WordPress Core vorhandenen Widgets wie dem Archiv oder ähnlichen, sondern auch mit Widgets, welche über Plugins oder (eventuell) über das Theme bereitgestellt werden. Sehen wir uns dazu folgendes Beispiel an:

Wir registrieren hier zunächst unser Widget Mein_Widget() mit der Base ID meine-base-id. Und in der Methode widget() lassen wir uns im Wesentlichen einfach die $instance ausgeben. Schließlich weisen wir in unserer Content-Starter-Deklaration noch die Inhalte diesem Widget zu und schon wird dieses Widget mit den Inhalten angezeigt.

Posts

Um Beiträge, Seiten oder andere Inhalte für die Vorschau zu erstellen, könnt Ihr wie folgt vorgehen:

Wir legen hier eine Seite mit dem Identifikator test an. Wir weisen diesem Inhalt den Posttype page zu, einen Titel und einen Inhalt. Dieser Array wird schließlich als Übergabeparameter an wp_insert_post() genutzt, da diese Starter-Beiträge mit dem Status auto-draft in der Datenbank hinterlegt werden. So können natürlich auch benutzerdefinierte Felder mit übergeben werden, indem der Array um ein meta_input erweitert wird. Wenn Du einer Seite ein bestimmtes Seitentemplate zuweisen möchtest, kannst Du dies so tun:

'template' => 'sample-page-template.php'

Der WordPress Customizer liefert allerdings auch schon vorgefertigte Seiten, wie das folgende Listing darstellt:

Mit diesen sechs vorgefertigten Seiten erspart sich der/die Entwickler⋅in dann einiges an Konfigurationsarbeit.

Attachments

Attachments sind formal gesehen natürlich nichts anderes als ein besonderer Posttype. Allerdings gibt es bei Anhängen noch Dateien, welche mit bedacht werden müssen und diese machen es notwendig, Attachments separat zu konfigurieren. Dann sind sie allerdings eine wirklich interessante Angelegenheit:

Hier registrieren wir zunächst das Attachment featured-image-logo. Dieses steht uns dann zur Verfügung, um es beispielsweise mit Hilfe von {{featured-image-logo}} an einen Beitrag als benutzerdefiniertes Bild anzuhängen.

Unser besonderes Interesse gilt in diesem Listing natürlich dem file-Wert. Verknüpfte Mediendateien müssen im Theme selbst zu finden sein. Der Pfad zur Mediendatei kann entweder absolut oder aber relativ zum Theme-Verzeichnis angegeben werden. Im hier skizzierten Fall läge die Datei also hier:

http://example.com/wp-content/themes/theme-slug/assets/images/featured-logo.jpg

Dem ein oder anderem mag aufgefallen sein, dass wir den „About“-Beitrag, der ja ein WordPress Standard-Eintrag ist, hier mit einem Array registrieren. Wir können sämtliche Standard-Einträge nehmen und die Eigenschaften dieser Beiträge mit Hilfe solcher Arrays erweitern.

Die Navigation

Kommen wir zur Navigation. Sehen wir uns zunächst kurz das Listing an:

Wir erstellen zwei Seiten und machen uns dann daran, unser Menü zu konstruieren. In nav_menus bezeichnen die Array-Keys (hier beispielsweise top) die Menülocation, welche wir zuvor in unserem Theme registriert haben müssen. Mit name übergeben wir den Namen des Menüs und in items schließlich die einzelnen Menüitems. Das erste Item, welches wir übergeben ist page_home, ein WordPress Standard, welcher auf die Standardseite home verweist, welche wir oben registriert haben. Danach haben wir ein Array. Grundsätzlich gibt es zwei Navigationsitem-Typen, welche wir anlegen können: Objekte und Links. Objekte verweisen auf ein registriertes Objekt, in unserem Fall auf die Testseite, welche wir zunächst angelegt haben und dann über object_id mit {{test}} referenzieren. Auch object und type müssen dabei angegeben werden.

Darunter registrieren wir dann einen externen Link als Menüitem. Hierfür muss einfach eine URL in url und ein Titel in title übergeben werden.

Optionen und Theme Mods

Um Optionen oder Theme Mods anzulegen, wird options beziehungsweise theme_mods bereitgestellt. Diese Bereiche sind Schlüssel-Wert-basiert, wie das folgende Listing zeigt:

Hier sagen wir, dass wir auf der Startseite eine einzelne Seite anzeigen lassen wollen, und zwar die von uns angelegte home und dass wir als Blogseite unsere test-Seite verwenden wollen. Außerdem hinterlegen wir in den Theme Mods hinter dem Schlüssel color den (Farb-)Wert #f00.

Die Konfiguration filtern

Der Filter get_theme_starter_content kann diese Konfiguration dann noch einmal filtern. Dies ist vor allem dann nützlich, wenn ein Plugin sich einhaken möchte, um sein eigenes Widget in der einer Sidebar gleich mit zu präsentieren.

Schluss

So, ich hoffe, dieser kleine Überblick über das „Starter-Content“-Feature in WordPress 4.7 konnte Euch ein wenig weiterhelfen. Dieses Feature ist natürlich vor allem für Themeentwickler⋅innen interessant, welche ihre Themes einem größeren Publikum zur Verfügung stellen möchten. Es ermöglicht Euren Benutzer⋅innen einen möglichst schnellen und schmerzlosen Start mit dem von Euch entwickelten Theme.

Was hälst Du vom neuen „Starter-Content“-Feature? Hast Du es schon einmal eingesetzt oder ist es Dir als Anwender⋅in schon einmal aufgefallen?