WordPress 5.4 “Adderley” wurde am 31. März 2020 veröffentlicht und steht zum Herunterladen zur Verfügung.

Es ist also an der Zeit, dass wir uns mit den interessantesten neuen Funktionen und Änderungen von WordPress 5.4 beschäftigen.

In erster Linie bringt WordPress 5.4 viele Funktionen, Verbesserungen und Fehlerbehebungen in den Blockeditor, wobei eine beträchtliche Anzahl von Versionen des Gutenberg-Plugins in den Core integriert wurde. Diese Änderungen betreffen sowohl die Funktionalitäten als auch die Benutzeroberfläche und verbessern die Zugänglichkeit/Bedienbarkeit des Editors und die Erfahrung des Editierens im Allgemeinen.

Neben dem Editor führt WordPress 5.4 interessante Verbesserungen im Site Health Tool und in der REST-API ein, während einige mit WordPress 5.4 erwartete Funktionen verzögert wurden und mit der nächsten Version von WordPress 5.5 im Core gebündelt werden sollten (siehe Block Native Lazy Loading für Bilder und Navigation Block).

Die folgenden Daten und Links aus dem Entwicklungszyklus von WordPress 5.4 sollten gespeichert werden:

  • 11. Februar 2020: Beta 1
  • 18. Februar 2020: Beta 2
  • 25. Februar 2020: Beta 3
  • 3. März 2020: RC 1
  • 10. März 2020: RC 2
  • 17. März 2020: RC 3
  • 24. März 2020: RC 4
  • 27. März 2020: RC 5
  • 30. März 2020: Probelauf für die Veröffentlichung von WordPress 5.4
  • 31. März 2020: Die Veröffentlichung von WordPress 5.4 „Adderley„

Was gibt es Neues in WordPress mit WordPress 5.4?

Was ist neu am Block-Editor?

Eine beträchtliche Anzahl der Gutenberg Plugin-Versionen wurde in den Core integriert, von 6.6 bis 7.5. Wenn man also nicht das Gutenberg-Plugin verwendet, findet man beim Upgrade auf WordPress 5.4 im Block-Editor eine Menge neuer Funktionen, Verbesserungen und Fehlerbehebungen.

Aber es gibt mehr als nur Blöcke und Funktionen im Editor, wobei über allgemeine Leistungsverbesserungen berichtet wird:

“Das Blockeditor-Team hat seit WordPress 5.3 bei einem besonders umfangreichen Beitrag (~ 36.000 Wörter, ~1.000 Blöcke) eine Reduzierung der Ladezeit um 14% und der Zeit bis zur Eingabe um 51% erreicht.”

Das ist eine Menge toller Sachen, also lasst uns eintauchen.

Neue Blockeditor-Funktionen und Verbesserungen

Wir sind uns zwar einig, dass sich der Blockeditor noch in der Entwicklung befindet, aber WordPress 5.4 bringt eine Menge Änderungen mit sich, die die Benutzerfreundlichkeit des Editors sowohl auf dem Desktop als auch auf mobilen Geräten verbessern.

Einige dieser Änderungen beziehen sich ausschließlich auf die Benutzeroberfläche, darunter der standardmäßig aktivierte Vollbildmodus, die verbesserte Blockauswahl, der einfache Wechsel zwischen Bearbeitungs- und Auswahlmodus, die feste mobile Symbolleiste und die Breadcrumbs für die Blocknavigation. Zwei neue Blöcke und zusätzliche Optionseinstellungen fügen dem Editor weitere Funktionalitäten hinzu.

Hier ist eine kurze Liste der Funktionen und Verbesserungen unseres bevorzugten Blockeditors, der mit WordPress 5.4 geliefert wird:

Neuer Block mit Social Icons

Ursprünglich als Social Links bezeichnet, erlaubt der Block Social Icons den Autoren, schnell Icons mit Links zu sozialen Profilen hinzuzufügen, und bietet eine gute Anzahl von Child-Blöcken für Social Icons zur Auswahl. Dieser Block war eine Zeit lang experimentell und ist seit Gutenberg 7.5 stabil.

Der Social Icons Block
Der Social Icons Block

Der Social Icons-Block wird mit drei vordefinierten Stilen für die visuelle Anpassungen geliefert: Standard, nur Logos und Pillenform.

Social Icons Stile
Social Icons Stile

Seit ihrer Einführung als experimentelle Funktion in Gutenberg 6.5 (und der Zusammenführung in WordPress 5.3) wurden Social Icons zu Gutenberg 7.5 hinzugefügt, und sie funktionieren möglicherweise nicht wie erwartet, wenn man eine veraltete Version des Gutenberg-Plugins verwendet.

Laut Jorge Costa gibt es zwei Möglichkeiten, Probleme mit Social Icons zu verhindern:

  • Manuelle Migration von Inhalten mit Social Icons: Aktualisierung auf WordPress 5.4, Laden des Beitrags im Blockeditor und Speichern des Beitrags. Social Icons werden automatisch auf die neue Version migriert.
  • Lass das Gutenberg-Plugin installiert, wenn du auf WordPress 5.4 aktualisierst: Das Plugin bietet Abwärtskompatibilität und es sollte keine Probleme geben.

Neuer Button Block

Der in Gutenberg 7.2 zum Block-Editor hinzugefügte Buttons-Block ersetzt den einzelnen Button-Block und ermöglicht es WordPress-Benutzern, innerhalb desselben Block-Containers weitere Buttons zu ihrem Inhalt hinzuzufügen.

Der neue Button Block
Der neue Button Block

Einzelne Buttons werden mit zwei voreingestellten Stilen zur Auswahl und mehreren zusätzlichen Optionen zur Feinabstimmung des Erscheinungsbildes der Buttons geliefert.

Button Einstellungen in WordPress 5.4
Button Einstellungen in WordPress 5.4

Mit WordPress 5.4 erhalten Webseiten-Besitzer dank der Hinzufügung von Farbverlaufshintergründen, die auch mit einer Handvoll von Farbverlaufsvoreinstellungen geliefert werden, die den Seiten-Administratoren als Ausgangspunkt für weitere Anpassungen zur Verfügung stehen, eine bessere Kontrolle über das Aussehen und die Handhabung ihrer Call-to-Actions.

Überarbeitete Farbfunktionen für Buttons
Überarbeitete Farbfunktionen für Buttons

Ein Willkommens Leitfaden Modal

WordPress 5.4 fügt eine brandneue Willkommens-Slideshow hinzu, die grundlegende Informationen über den Blockeditor und einen Link zur Online-Dokumentation (hinzugefügt mit Gutenberg 7.1) bietet.

Willkommens Leitfaden Modal
Willkommens Leitfaden Modal

Das Modal ist nur unmittelbar nach der Aktualisierung auf 5.4 sichtbar. Wenn du es wieder auslösen möchtest, öffne einfach das Menü Weitere Werkzeuge & Optionen von der Schaltfläche oben rechts und finde den Link Welcome Guide.

Willkommens Leitfaden
Willkommens Leitfaden

Vollbildmodus standardmäßig aktiviert

Ab WordPress 5.4 öffnet sich der Editor bei neuen Installationen und Geräten standardmäßig im Vollbildmodus. Du kannst den Vollbildmodus ein- und ausschalten, indem du auf das Menü Weitere Werkzeuge & Optionen klickst, wie in der Abbildung unten gezeigt.

Der Vollbildmodus ist in WordPress 5.4 standardmäßig aktiviert
Der Vollbildmodus ist in WordPress 5.4 standardmäßig aktiviert

Vorerst wird diese Einstellung lokal gespeichert, was bedeutet, dass sie bei jeder Einstellungsänderung überschrieben wird, wie es beim Zugriff auf die Webseite im Inkognito-Modus geschieht. In Zukunft wird diese Einstellung in der Datenbank gespeichert, so dass die Wahl des Benutzers in jedem Fall erhalten bleibt.

Beachte, dass die Entscheidung, den Editor standardmäßig im Vollbildmodus zu betreiben, nicht einhellig als potenziell verwirrend für Anfänger und nicht fortgeschrittene Benutzer angesehen wird.

Wenn du mehr über die Bedenken der Leute in Bezug auf den Vollbildmodus wissen möchtest, schau dir die Kommentare zu diesem Beitrag an.

Blockeditor-Entwickler können den Vollbildmodus programmatisch mit nur wenigen Zeilen JavaScript steuern:

const isFullscreenMode = wp.data.select( 'core/edit-post' ).isFeatureActive( 'fullscreenMode' );

if ( isFullscreenMode ) {	
 wp.data.dispatch( 'core/edit-post' ).toggleFeature( 'fullscreenMode' );
}

Unterstützung von Inline-Textfarben in RichText-Blöcken

Wenn man normalerweise Artikel in Langform schreibt, sollte man die Unterstützung von Inline-Textfarben zu schätzen wissen. Vor diesem Update waren wir gezwungen, Rich-Text-Blöcke im HTML-Modus hart zu programmieren, um die Farbe einzelner Wörter und Zeichenketten zu ändern.

RichText Farboptionen
RichText Farboptionen

Ab WordPress 5.4 können wir Wörter und Substrings in RichText-Blöcken auswählen und ihre Farben mit der integrierten Farbauswahl schnell ändern.

RichText Farbauswahl
RichText Farbauswahl

Zusätzliche Farboptionen für mehrere Blöcke

WordPress 5.4 fügt dem Blockeditor eine lange Liste von farbbezogenen Funktionen und Verbesserungen hinzu. Wie oben gesehen, sind wir nicht mehr auf Volltonfarben beschränkt. Mehrere Blöcke unterstützen jetzt Farbverlaufshintergründe und vordefinierte Sätze von Farbverläufen.

Hier ist eine kurze Liste mit einigen farbbezogenen Verbesserungen:

  • Unterstützung von Farbverläufen für den Button-Block (Gutenberg 6.7).
  • Unterstützung von Farbverläufen im Hintergrund für den Cover-Block (Gutenberg 6.8).
  • Textfarben-Unterstützung für Gruppenblöcke (Gutenberg 7.4 und 7.5): Verschachtelte Blöcke können jetzt die Textfarbe von ihrem übergeordneten Gruppenblock erben.
  • Unterstützung für Text- und Hintergrundfarbe für Spalten-Block (Gutenberg 7.4 und 7.5).
Cover-Block mit voreingestelltem Farbverlauf-Hintergrund
Cover-Block mit voreingestelltem Farbverlauf-Hintergrund

Eine weitere bemerkenswerte Ergänzung des Blockeditors ist die Unterstützung für die im Block „Neueste Beiträge“ (Gutenberg 7.5) dargestellten Bilder.

Dies ist nur die neueste von mehreren Verbesserungen, die im Laufe der Zeit dem Neueste Beiträge Block hinzugefügt wurden, und stellt einen weiteren Schritt zu „komplexeren dynamischen oder globalen Blöcken“ dar.

Neueste Beiträge Block
Neueste Beiträge Block

In WordPress 5.4 ermöglicht der Block Letzte Beiträge“ das Abrufen von Beiträgen aus einer bestimmten Kategorie, aber es ist nicht möglich, erweiterte Abfragen nach Kategorie/Tag/Posttyp zu erstellen und/oder einzelne Beiträge ein- oder auszuschließen.

Wir hoffen, in Zukunft weitere Verbesserungen bei diesem Block zu sehen.

Eine neue Breadcrumb-Bar für die Block-Navigation

Seit Version 6.7 für Gutenberg-Benutzer verfügbar und jetzt in den Core integriert, soll die neue Breadcrumb-Leiste die Navigation in verschachtelten Blöcken vereinfachen.

Das Bild unten zeigt mehrere verschachtelte Blöcke und das neue Breadcrumb-Menü am unteren Rand.

Das neue Breadcrumb Menü
Das neue Breadcrumb Menü

Blockeditor-Änderungen für Themes- und Blockentwickler

Theme- und Blockentwickler sollten sich über viele Änderungen im Blockeditor mit WordPress 5.4 informieren. Diese Änderungen umfassen:

Block-Editor-Tastaturkürzel

Blockentwickler und fortgeschrittene Benutzer können jetzt benutzerdefinierte Verknüpfungen zum Blockeditor hinzufügen.

Ein neues Paket namens @wordpress/keyboard-shortcuts wurde eingeführt, um die Registrierung, Entfernung und Dokumentation von Editor-Shortcuts zu zentralisieren.

Entwickler können ihre benutzerdefinierten Shortcuts hinzufügen, indem sie die registerShortcut Aktion auf diese Weise aufrufen:

wp.data.dispatch( 'core/keyboard-shortcuts' ).registerShortcut( {

	// Shortcut identifier
	name: 'plugin/shortcut-test',

	// Shortcut category (possible values global, block, selection)
	category: 'global',

	// Shortcut description
	description: 'My first shortcut',

	// The key combination that triggers the shortcut
	keyCombination: {

		// Available modifiers:
		// primary, primaryShift, primaryAlt,
		// secondary, access, ctrl, alt,
		// ctrlShift, shift, shiftAlt
		modifier: 'alt',
		character: 'w',
	},

	// An alias for the key combination
	aliases: [
		{
			modifier: 'primary',
			character: 'q',
		},
	],
} );

Dadurch wird automatisch die benutzerdefinierte Verknüpfung zu den modalen Verknüpfungen hinzugefügt, die unter der Schaltfläche Weitere Werkzeuge & Optionen in der oberen rechten Ecke des Editors verfügbar sind.

Eine benutzerdefinierte globale Blockeditor-Verknüpfung wurde hinzugefügt
Eine benutzerdefinierte globale Blockeditor-Verknüpfung wurde hinzugefügt

Dann können wir einen Keyboard Shortcut Handler mit der Funktion useShortcut anhängen:

import { useShortcut } from '@wordpress/keyboard-shortcuts';
import { useCallback } from '@wordpress/element';

const MyComponent = () => {
	useShortcut(

		'plugin/shortcut-test',

		useCallback(
			( event ) => {
				// Do something
			},
			[]
		)
	);
}

Mehr zu den Tastaturkürzeln findest du im Blog Make WordPress Core.

Theme-APIs für Farbverläufe

WordPress 5.4 führt Farbverlaufshintergründe mit einer Handvoll Voreinstellungen für Schaltflächen und Cover-Blöcke ein. Dies geschieht dank der neuen Gradient Theme APIs.

Die neuen APIs bieten die editor-gradient-presets für Theme-Unterstützung, die es den Themeentwicklern ermöglicht, die Standardvorgaben zu überschreiben und eigene Voreinstellungen zu definieren:

add_theme_support(
	'editor-gradient-presets',
	array(
		array(
			'name'		=> __( 'CadetBlue to Chartreuse', 'themeLangDomain' ),
			'gradient'	=> 'linear-gradient(135deg,rgba(95,158,160,1) 0%,rgb(127,255,0) 100%)',
			'slug'		=> 'cedetblue-chartreuse'
		),
		array(
			'name'		=> __( 'Chocolate to Coral', 'themeLangDomain' ),
			'gradient'	=> 'linear-gradient(135deg,rgba(210,105,30,1) 0%,rgba(255,127,80,1) 100%)',
			'slug'		=>  'chocolate-to-coral',
		),
		array(
			'name'		=> __( 'DarkMagenta to DarkOrchid', 'themeLangDomain' ),
			'gradient'	=> 'linear-gradient(135deg,rgb(139,0,139) 0%,rgb(153,50,204) 100%)',
			'slug'		=> 'darkmagenta-to-darkorchid',
		),
		array(
			'name'		=> __( 'DeepSkyBlue to DodgerBlue', 'themeLangDomain' ),
			'gradient'	=> 'linear-gradient(135deg,rgba(0,191,255,1) 0%,rgba(30,144,255,1) 100%)',
			'slug'		=> 'deepskyblue-to-dodgerblue',
		),
	)
);
Benutzerdefinierte Voreinstellungen für Farbverläufe in WordPress 5.4
Benutzerdefinierte Voreinstellungen für Farbverläufe in WordPress 5.4
  • name: eine aussagekräftige Beschriftung für den Tooltip mit Informationen über den Farbverlauf. Dies ist besonders nützlich für Screenreader und Benutzer, die Schwierigkeiten haben, bestimmte Farben zu unterscheiden.
  • gradient: CSS-Werte für den Farbverlauf.
  • slug: ein Bezeichner zur Erzeugung von CSS-Klassen, die im Blockeditor verwendet werden.
Benutzerdefinierte Farbverlaufsvoreinstellungen
Benutzerdefinierte Farbverlaufsvoreinstellungen

Du kannst benutzerdefinierte Farbverläufe mit der Option disable-custom-gradients theme-support deaktivieren:

add_theme_support( 'disable-custom-gradients' );

Die Farbverlauf-Funktionalität kann sowohl mit Hilfe von disable-custom-gradients als auch mit Hilfe von editor-gradient-presets vollständig entfernt werden:

add_theme_support( 'disable-custom-gradients' );
add_theme_support( 'editor-gradient-presets', array() );

Markup- und Stiländerungen im Blockeditor

WordPress 5.4 führt mehrere Änderungen an der DOM-Struktur ein, die Entwickler beachten sollten.

  • Das alte Klassenpräfix des editor- wurde aus den Blockeditor-Skripten entfernt und Entwickler sollten nur noch das block-editor- Präfix verwenden.
  • Die Klasse edit-post-layout__content wurde aus dem DOM des Blockeditors entfernt.
  • Mehrere div-Wrapper wurden aus Blöcken und RicheText als überflüssig entfernt. Diese Änderung bringt eine erhebliche Leistungsverbesserung und vereinfacht den DOM-Baum, was von Block- und Themeentwicklern geschätzt werden sollte.
  • Block paddings und negative Ränder sind verschwunden. Die Blockstile sollten sich entsprechend ändern.

Eine detaillierte Ansicht der DOM- und CSS-Änderungen findet man unter Markup- und stilbezogene Änderungen in WordPress 5.4

Block-Gerüst

Mit dem neuen @wordpress/create block Paket für Blockgerüste haben Entwickler eine neue Möglichkeit, die Verzeichnisstruktur für ein Blockeditor-Plugin zu generieren. Diese Struktur umfasst typischerweise index.php, index.js und style.css.

Block-Entwickler können jetzt einfach den folgenden Befehl ausführen:

$ npm init @wordpress/block block-name

Block-Sammlungen

Blocksammlungen bieten eine Möglichkeit, Sammlungen von Blöcken im Blockeditor-Inserter visuell zu gruppieren. Sammlungen unterscheiden sich von Kategorien und bieten eine zusätzliche Möglichkeit, Blöcke zu gruppieren.

Die neue API bietet eine neue Funktion:

registerBlockCollection( namespace, { title, icon } );
  • namespace: mit einem Block-Präfix abgeglichen.
  • title: Dies ist die Bezeichnung, die im Block-Inserter angezeigt wird.
  • icon: dies ist das Icon, das mit dem Titel im Block-Inserter angezeigt wird.

Die neue API, die mit Gutenberg 7.3 eingeführt und jetzt in den Core integriert wurde, ermöglicht es den Theme- und Blockentwicklern, Blöcke besser zu organisieren, wodurch es für die Benutzer einfacher wird, Blöcke zu finden und dem Inhalt hinzuzufügen.

Block-Variationen

Die Blockvariations-API bietet eine Reihe von Funktionen, mit denen Blockentwickler Variationen von Blöcken hinzufügen/verwalten/entfernen können, aus denen die Benutzer beim Hinzufügen von Blöcken zum Inhalt wählen können. Die Registrierung einer neuen Variation ist recht einfach (JS-Code):

wp.blocks.registerBlockVariation( 'core/heading', { 
	name: 'green-text', 
	title: 'Green Text', 
	description: 'This block has green text. It overrides the default description.',  
	attributes: { 
		content: 'Green Text', 
		textColor: 'vivid-green-cyan' 
	}, 
	icon: 'palmtree', 
	scope: [ 'inserter' ] 
} );
  • blockName: der Name des Blocks (d.h. core/heading).
  • variation: ein Objekt, das eine Variation für den Blocktyp beschreibt.
  • name: (String) der eindeutige Bezeichner der Variation.
  • title: (string) der Titel der von Menschen lesbaren Variation.
  • description: (string) eine detaillierte Beschreibung.
  • : (WPIcon) ein Icon zur Anzeige im Block-Inserter.
  • [isDefault]: (boolean), ob die aktuelle Variante die Standardvariante ist. Voreinstellung ist false.
  • [attributes]: (Objekt-) Werte, die Blockattribute überschreiben.
  • [innerBlocks]: (Array[]) Anfangskonfiguration des verschachtelten Blocks.
  • [example]: (Objekt-) strukturierte Daten für die Blockvorschau. Setze den Wert auf undefiniert, um die Vorschau zu deaktivieren.
  • [scope]: (WPBlockVariationScope[]) Die Liste der Bereiche, in denen die Variation anwendbar ist. Wenn sie nicht angegeben wird, werden alle verfügbaren Bereiche angenommen. Verfügbare Optionen: block, inserter.
Heading Block Variationen
Heading Block Variationen

Für eine genauere Betrachtung der Blockvariations-API schau dir PR #20068 an.

Zusätzliche Blockeditor-Funktionen, die mit WordPress 5.4 kommen

Mit WordPress 5.4 werden zusätzliche bemerkenswerte Funktionen in den Core gebündelt:

  • Ein Menü zum visuellen Umschalten zwischen Bearbeitungs- und Navigationsmodus (7.1)
Umschalten zwischen dem Modus Auswahl und bearbeiten
Umschalten zwischen dem Modus Auswahl und bearbeiten
  • Überschrift zum Tabellenblock hinzugefügt (7.1)
Eine Tabelle mit einer Überschrift in WordPress 5.4
Eine Tabelle mit einer Überschrift in WordPress 5.4
  • Drag-and-Drop Bilder in die Box mit den Featured Images (7.1)
Drag and Drop für Featured Images
Drag and Drop für Featured Images
  • Feste Block-Symbolleiste auf dem Handy (7.1)
Fixierte Block-Symbolleiste auf dem Handy
Fixierte Block-Symbolleiste auf dem Handy
  • Größenauswahl für Bilder zum Galerie-Block hinzugefügt (7.2)
Galerie Block Einstellungen
Galerie Block Einstellungen
  • Links zu Bildern im Block Medien & Text hinzugefügt (7.2)
Links zu Bildern im Medien- und Textblock hinzufügen
Links zu Bildern im Medien- und Textblock hinzufügen

Funktionen und Verbesserungen für WordPress-Entwickler

Entwickler sollten von mehreren neuen Ergänzungen profitieren, die mit WordPress 5.4 kommen.

Zu unseren bevorzugten Änderungen gehören die folgenden:

Ein semantisch korrektes Kalender-Widget und neue CSS-Klassen

Die HTML 5.1-Spezifikation hat die Art und Weise geändert, wie tfoot Elemente in Tabellen verwendet werden müssen. Vor HTML 5.1 konnten tfoot-Elemente dem tbody-Element vorangestellt werden. Die neue Spezifikation ändert die Dinge und jetzt muss tfoot dem tbody folgen.

Altes Kalender Widget
Altes Kalender Widget

Das WordPress-Kalender-Widget ändert sich entsprechend. Ab WordPress 5.4 bewegen sich die Navigationslinks zu einem nav Element außerhalb der Kalendertabelle.

Dies war eine lang erwartete Änderung, da das nav Element das am besten geeignete HTML-Element für Navigationslinks in jedem Wettbewerb ist und auch zur Verbesserung der Zugänglichkeit in Screenreadern beitragen kann. Gemäß der Mozilla-Dokumentation:

“Ein Dokument kann mehrere <nav> Elemente haben, zum Beispiel eines für die Navigation auf der Webseite und eines für die Navigation innerhalb der Seite. aria-labelledby kann in diesem Fall verwendet werden, um die Zugänglichkeit zu fördern…

Benutzer-Agenten, wie z.B. Bildschirmleseprogramme für behinderte Benutzer, können dieses Element verwenden, um zu bestimmen, ob die anfängliche Darstellung von reinen Navigationsinhalten ausgelassen werden soll.”

Zusätzlich wurden die folgenden CSS-Klassen in get_calendar() eingeführt, um die Ausrichtung zu erleichtern:

  • wp-calendar-table für das table Element.
  • wp-calendar-nav für das nav Element.
  • wp-calendar-nav-prev für den Link des Vormonats, wobei #prev ID ersetzt wird.
  • wp-calendar-nav-next für den Link des nächsten Monats wobei #next ID ersetzt wird.

Der folgende Ausschnitt zeigt die HTML-Struktur des neuen Kalenders:

<div class="widget widget_calendar">
	<div class="widget-content">
		<div id="calendar_wrap" class="calendar_wrap">
			<table id="wp-calendar" class="wp-calendar-table">
				<caption>February 2020</caption>
				<thead>
					<tr><!-- Day names --></tr>
				</thead>
				<tbody>
					<!-- Calendar cells -->
				</tbody>
			</table>
			<nav aria-label="Previous and next months" class="wp-calendar-nav">
				<span class="wp-calendar-nav-prev"><a href="http://example.com/?m=201912">« Dec</a></span>
				<span class="pad"> </span>
				<span class="wp-calendar-nav-next"> </span>
			</nav>
		</div>
	</div>
</div>

Themeentwickler sollten ihre Stylesheets möglicherweise entsprechend ändern.

Neues Kalender Widget
Neues Kalender Widget

Shortcodes in PHP Scripts

WordPress 5.4 führt die Funktion apply_shortcodes() als Alias für do_shortcode() ein, die es uns erlaubt, einen Shortcode in einer PHP-Datei zu verwenden.

Vom semantischen Standpunkt aus gesehen können wir erwarten, das Ergebnis von do_*-Funktionen zu sehen, indem wir einfach die Funktion selbst aufrufen. Aber das ist bei do_shortcode nicht der Fall. Um die Ausgabe des angegebenen Shortcodes zu drucken, muss do_shortcode angehängt werden:

// Displays the result of the shortcode
echo do_shortcode( '[shortcode]' . $text . '[/shortcode]' );

WordPress 5.4 ändert die Dinge ein wenig mit der Einführung von apply_shortcodes(), das auf die gleiche Weise wie do_shortcode() funktioniert, aber Entwicklern erlaubt, lesbareren und semantisch korrekteren Code zu erstellen:

// Displays the result of the shortcode
echo apply_shortcodes( '[shortcode]' . $text . '[/shortcode]' );

Ab WordPress 5.4 RC 5 ist es nicht geplant, do_shortcode() zu verwerfen, da es in Plugins von Drittanbietern weit verbreitet ist.

Verbesserungen bei der Favicon-Behandlung in WordPress 5.4

Mit WordPress 5.4 können Themeentwickler Favicon-Anfragen viel flexibler bearbeiten, und mehrere neue Funktionen ermöglichen es, Favicons auf dieselbe Weise zu verwalten wie robot.txt-bezogene Funktionen. Sergey Biryukov erklärt:

Eine Anfrage an favicon.ico sollte auf die gleiche Weise behandelt werden, wie wir robots.txt mit do_robots() behandeln:

  • Wenn eine physische Datei existiert, tue nichts und lasse den Server die Anfrage bearbeiten.
  • Andernfalls bediene ein Fallback-Icon (siehe unten).

Wenn also eine physische favicon.ico-Datei nicht zur Verfügung gestellt wird, wird WordPress sie wie folgt behandeln:

  • Wenn ein Icon-Set im Customizer vorhanden ist, leitet dieser /favicon.ico zu diesem speziellen Icon um.
  • Wenn kein Icon-Set vorhanden ist, wird das WordPress-Logo (wp-admin/images/w-logo-blue.png) als Fallback-Option verwendet.

Eine Handvoll neuer Funktionen und Hooks ergänzt die entsprechenden robots.txt-bezogenen Funktionen/Hooks:

  • Die neue Funktion is_favicon() ergänzt is_robots().
  • Die Aktion do_favicon ergänzt do_robots und wird ausgelöst, wenn der Template-Lader eine Favicon-Anfrage ermittelt.
  • Die Funktion do_favicon() ist an die Aktion do_favicon gekoppelt und ergänzt do_robots().
  • Die Aktion do_faviconico ergänzt do_robotstxt und ermöglicht es Entwicklern, das Standardverhalten zu überschreiben.

Lies mehr über die Favicon-Behandlung.

Neue Hooks zum Hinzufügen von benutzerdefinierten Feldern zu Menüelementen

Mit WordPress 5.4 können Entwickler zwei neue action hooks verwenden, um benutzerdefinierte Felder zu Menüpunkten hinzuzufügen.

Die Aktion wp_nav_menu_item_custom_fields wird ausgelöst, kurz bevor ein Nav-Menüeintrag zum Admin-Menüeditor hinzugefügt wird. Siehe das folgende Beispiel:

function kinsta_add_menu_item_custom_field() {
	echo '<p class="menu-item-custom-field">Hey! This is an example for Kinsta blog readers!</p>';
}
add_action( 'wp_nav_menu_item_custom_fields', 'kinsta_add_menu_item_custom_field' );
Benutzerdefinierte Felder in Navigationsmenüpunkten
Benutzerdefinierte Felder in Navigationsmenüpunkten

Der neue Action Hook unterstützt fünf Parameter, mit denen man das Verhalten der benutzerdefinierten Felder feineinstellen kann:

  • $item_id: die ID des Menüeintrags (ganzzahlig).
  • $item: das Datenobjekt (Objekt) des Menüeintrags.
  • $depth: die Tiefe des Menüeintrags (ganzzahlig).
  • $args: ein Objekt der Menüpunkt-Argumente (Objekt).
  • $id: die Navigationsmenü-ID (ganzzahlig).

Die wp_nav_menu_item_custom_fields_customize_template arbeitet auf die gleiche Weise wie wp_nav_menu_item_custom_fields, wird aber am Ende der Formularfeld-Vorlage für Nav-Menüpunkte im Customizer ausgelöst. Das folgende Bild zeigt den Abschnitt über die Menüs des Customizers in WordPress 5.4.

Benutzerdefinierte Felder in Navigationsmenüpunkten
Benutzerdefinierte Felder in Navigationsmenüpunkten

Zusätzliche Änderungen für Entwickler

Weitere Änderungen für Entwickler und fortgeschrittene Benutzer, die mit WordPress 5.4 kommen, sind

Wie man eine WordPress Entwicklungsversion installiert

Wenn du sicherstellen möchtest, dass deine Themes und Plugins vollständig mit WordPress 5.4 kompatibel sind, oder wenn du einfach nur neugierig auf neue Funktionen bist, die mit der neuesten WordPress Version kommen, kannst du die aktuelle Entwicklungsversion mit wenigen Klicks installieren.

Es gibt zwei Möglichkeiten, eine WordPress-Beta/RC-Version zu installieren:

  • Installiere das WordPress-Beta-Tester-Plugin und führe die Installation im Dashboard einer vorhandenen WordPress-Umgebung aus.
  • Lade die aktuelle Beta/RC-Version manuell herunter und installiere sie. Du kannst den „nightly build“ erhalten, der aus dem Subversion-Repository erstellt wird. Wenn du nach einer bestimmten WordPress-Version suchst, sei es eine stabile oder eine Entwicklungsversion, kannst du im Archiv der Kategorie Releases nachsehen.

Wenn du dich für die Installation des Beta-Tester-Plugins entscheidest, musst du zuerst eine normale WordPress-Installation einrichten, entweder auf deinem lokalen Rechner oder in deiner Staging-Umgebung.

Sobald deine WordPress-Webseite eingerichtet ist, kannst du zu Plugins → Neu hinzufügen gehen und nach dem WordPress-Beta-Tester-Plugin suchen.

Das Plugin bietet einen schnellen und einfachen Weg zum Betatest von WordPress, der es ermöglicht, die aktuelle Beta- oder Release Candidate mit einem Klick auf eine Schaltfläche zu installieren und/oder zu aktualisieren.

Das WordPress Beta Tester Plugin installieren
Das WordPress Beta Tester Plugin installieren

Installiere und aktiviere das Plugin also wie gewohnt.

Scrolle zu Tools → Beta Testing und kreuze die Option Bleeding edge nightlies an und speichere die Änderungen.

Danach navigiere zum Dashboard → Updates und klicke auf die Schaltfläche Update Now.

WordPress Update Bildschirm
WordPress Update Bildschirm

WordPress wird nun das folgende Paket herunterladen und installieren:

https://wordpress.org/nightly-builds/wordpress-latest.zip

Sobald die Installation abgeschlossen ist, wird man zur temporären WordPress About-Seite weitergeleitet.

WordPress Update Vorgang
WordPress Update Vorgang

Und das war’s. Jetzt bist du bereit, deine Tests auf WordPress Beta- und RC-Versionen durchzuführen.

Schaue in der offiziellen Dokumentation nach, um weitere Informationen über WordPress-Beta-Tests zu erhalten.

Zusammenfassung

Da zehn Versionen des Gutenberg-Plugins in den Core integriert wurden, konzentriert sich WordPress 5.4 hauptsächlich auf den Block-Editor. Wir haben zwei neue Blöcke, benutzerdefinierte Verknüpfungen, verbesserte Benutzerfreundlichkeit und Zugänglichkeit, und wir können in naher Zukunft weitere Entwicklungen erwarten.

Aber es gibt noch mehr:

  • Ein Site Health Status Widget wurde dem Dashboard hinzugefügt, das es dem Benutzer erleichtert, den Zustand, die Sicherheit und die Leistung seiner Webseite zu überprüfen.
  • Besseres Fokus-Management, einfachere Tastatur-Navigation und ein leichter zu lesender Leitfaden für Datenschutzrichtlinien verbessern die Zugänglichkeit auf mobilen Geräten und auf dem Desktop.
  • Mehrere Änderungen an den Datenschutz-Tools, die UX beim Export persönlicher Daten vereinfachen.
Das neue Site Health Status Widget
Das neue Site Health Status Widget

Jetzt bist du dran. Was hältst du von WordPress 5.4? Welche Änderungen und Funktionen machen dir am meisten Spaß? Lasst es uns in den Kommentaren wissen!

Carlo Daniele Kinsta

Carlo is a passionate lover of webdesign and front-end development. He has been playing with WordPress for more than 20 years, also in collaboration with Italian and European universities and educational institutions. He has written hundreds of articles and guides about WordPress, published both on Italian and international websites, as well as on printed magazines. You can find him on LinkedIn.