Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
WPB Cup
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

Ein kompletter Leitfaden für Anfänger zur vollständigen Bearbeitung von WordPress-Seiten

Hinweis der Redaktion: Wir erhalten eine Provision für Partnerlinks auf WPBeginner. Die Provisionen haben keinen Einfluss auf die Meinung oder Bewertung unserer Redakteure. Erfahre mehr über Redaktioneller Prozess.

Möchten Sie lernen, wie man die vollständige Website-Bearbeitung in WordPress nutzt?

Das in WordPress 5.9 eingeführte Full Site Editing hat die Art und Weise verändert, wie Benutzer ihre Websites mit WordPress erstellen können. Es ist so konzipiert, dass es flexibel und für Anfänger einfach zu bedienen ist.

In diesem Artikel zeigen wir Ihnen, wie Sie den WordPress Full Site Editor verwenden. Am Ende dieses Leitfadens können Sie mit WordPress im Handumdrehen eine großartig aussehende Website erstellen.

Beginner's Guide to WordPress Full Site Editing

Was ist Full Site Editing (FSE) in WordPress?

WordPress Full Site Editing (FSE) ist im Wesentlichen eine Fortführung des Gutenberg-Projekts. Dabei handelt es sich um eine Funktion, die die Schnittstelle des Block-Content-Editors für die integrierten Website- und Theme-Anpassungstools von WordPress.org verwendet.

Das bedeutet, dass Sie den Block-Content-Editor nicht nur für die Erstellung des Inhalts Ihrer Seite oder Ihres Beitrags verwenden können, sondern auch für eine Kopfzeile, Fußzeile, Seitenleiste und vieles mehr.

The WordPress Full Site Editor

Das Ziel von Full Site Editing ist es, die Erstellung von Websites in WordPress zu vereinfachen. Obwohl WordPress ziemlich benutzerfreundlich ist, war es für Anfänger nicht immer am einfachsten zu bedienen.

Zunächst einmal ist der frühere klassische Editor ziemlich dürftig. Wenn Sie eine neue Seite erstellen, können Sie nicht sofort sehen, wie sie aussieht. Stattdessen müssen Sie zwischen der Vorschauseite und der Bearbeitungsoberfläche hin- und herwechseln, um zu sehen, wie die Seite im Frontend aussieht.

Classic editor post example

Manche Leute finden auch den WordPress Theme Customizer einschränkend, da er keine Drag-and-Drop-Funktionalität hat.

Mit anderen Worten: Sie können die Elemente nicht genau so verschieben und bearbeiten, wie Sie es möchten. Deshalb installieren viele Leute ein WordPress Page Builder-Plugin, um mehr Flexibilität bei der Gestaltung zu erhalten.

Travel theme in the customizer

Das Gutenberg-Projekt zielt darauf ab, diese Probleme durch die Einführung neuer, benutzerfreundlicherer Tools für die Erstellung von Websites zu lösen, einschließlich der vollständigen Bearbeitung von Websites.

Mit FSE können Anfänger ihre WordPress-Websites mit einem einfachen Drag-and-Drop-Blockeditor erstellen und eine Live-Vorschau sehen, während sie Änderungen vornehmen.

Was Sie vor der Verwendung von WordPress Full Site Editing wissen sollten

Bevor Sie den WordPress Full Site Editor verwenden, sollten Sie wissen, dass diese Funktion nur für Benutzer des WordPress-Block-Themes verfügbar ist.

Wenn Sie ein nicht-blockiertes (klassisches) Theme verwenden, haben Sie keinen Zugriff auf den Full Site Editor. Stattdessen müssen Sie den WordPress-Theme-Customizer oder einen unterstützten Page Builder verwenden, um Anpassungen vorzunehmen.

Wenn Sie sich von einem Block-Theme inspirieren lassen möchten, dann werfen Sie einen Blick auf unseren Leitfaden zu den besten WordPress-Themes für die vollständige Bearbeitung von Websites.

Eine weitere Sache, die Sie beachten sollten, ist, dass WordPress Full Site Editing auf die gleiche Weise funktioniert wie der Gutenberg-Block-Editor. In diesem Sinne empfehlen wir Ihnen, unsere Anleitung zur Verwendung des WordPress-Blockeditors zu lesen.

In diesem Leitfaden werden wir uns darauf konzentrieren, wie Sie die WordPress-Funktionen zur vollständigen Bearbeitung von Design, Inhalt und Layout Ihrer Webseite nutzen können. Sie können diese Kurzlinks verwenden, um zu einem bestimmten Thema zu springen:

Zugriff auf WordPress-Funktionen zur vollständigen Bearbeitung von Websites

Um auf den WordPress Full Site Editor zuzugreifen, müssen Sie Ihr WordPress-Dashboard aufrufen und zu Darstellung “ Editor gehen.

Selecting the Full-Site Editor from the WordPress admin panel

Danach landen Sie auf dem WordPress Full Site Editor.

So sieht die Schnittstelle aus:

The WordPress Full Site Editor

Auf der linken Seite finden Sie ein Panel mit den wichtigsten Einstellungen. Auf der rechten Seite sehen Sie eine Vorschau, wie Ihre Website aussieht. Sie können auf diese Seite klicken, wenn Sie Ihre Website sofort bearbeiten möchten.

Es gibt 5 Haupteinstellungen: Navigation, Stile, Seiten, Vorlagen und Muster. Gehen wir sie alle der Reihe nach durch.

Wie Sie Ihr Navigationsmenü mit FSE bearbeiten

Die erste Einstellung oben ist Navigation, mit der Sie das Navigationsmenü Ihres Blockthemas bearbeiten können. Fahren Sie fort und klicken Sie darauf.

Selecting Navigation in WordPress Full Site Editing

Auf dieser Seite können Sie mehrere Dinge tun.

Wenn Sie auf die Schaltfläche mit den drei Punkten neben „Navigation“ klicken, können Sie das Menü umbenennen, duplizieren oder löschen.

Clicking the three-dot button next to Navigation in WordPress Full Site Editing

Sie können auch die im Menü aufgeführten Seiten neu anordnen oder entfernen.

Klicken Sie dazu auf die Schaltfläche mit den drei Punkten neben einer der Seiten. Sie sehen dann die Optionen „Nach oben“, „Nach unten“ und „Seite entfernen“. Wenn Sie die betreffende Seite bearbeiten möchten, können Sie auf die Schaltfläche „Gehe zu …“ klicken.

Clicking the three-dot button next to a page link in Navigation inside WordPress Full Site Editing

Außerdem können Sie das Design des Menüs und der Links anpassen.

Klicken Sie dazu einfach auf das Bleistift-Symbol „Bearbeiten“, um den Block-Editor zu öffnen.

Clicking the pencil edit button for Navigation in WordPress Full Site Editing

Nun erscheint die Bearbeitungsoberfläche für das Navigationsmenü, die wie der normale Blockeditor aussieht.

Hinzufügen, Bearbeiten, Entfernen und Umordnen von Menüelementen

Bevor wir fortfahren, sollten Sie beachten, dass die Position des Navigationsmenüs Ihrer Website von Ihrem Thema abhängt. Es kann sich oben, an der Seite oder versteckt befinden und nur erscheinen, wenn Sie auf eine bestimmte Schaltfläche klicken.

Um einen neuen Seitenlink hinzuzufügen, können Sie im Menü auf die Schaltfläche „+“ für das Hinzufügen eines Blocks klicken. Geben Sie nun einfach den Namen der Seite, den Titel des Beitrags oder die externe URL ein, die Sie in das Navigationsmenü einfügen möchten, und wählen Sie sie aus.

Adding a new page link in a navigation menu using the WordPress Full Site Editor

Wenn die Seite, auf die Sie verlinken möchten, noch nicht erstellt wurde, können Sie trotzdem einen Link zum Navigationsmenü hinzufügen.

Geben Sie einfach den Namen der Entwurfsseite in die Suchleiste ein und klicken Sie auf „Entwurfsseite erstellen“. WordPress erstellt dann eine Seite mit diesem Namen, die Sie später bearbeiten können.

Creating a draft page in the WordPress Full Site Editor for the navigation menu

Wenn Sie die Einstellungen für den Link, den Namen und die Registerkarte der Seite bearbeiten möchten, wählen Sie einfach die Seite aus und klicken Sie auf das Link-Symbol in der Blocksymbolleiste.

Wählen Sie dann die Schaltfläche „Stift“.

Editing a page link from the block toolbar in WordPress Full Site Editing

Jetzt können Sie den Link der Seite ändern und den Link in einer neuen Registerkarte öffnen lassen.

Klicken Sie anschließend einfach auf „Speichern“.

Editing a page link and clicking Save for the navigation menu in WordPress Full Site Editing

Neben Seitenlinks können Sie hier auch neue Navigationsmenüelemente hinzufügen.

Klicken Sie einfach auf die Schaltfläche „+“, um einen Block hinzuzufügen. Danach finden Sie einige Optionen für Navigationsblöcke, die Sie verwenden können, z. B. das Site-Logo oder die Site-Tagline.

Manchmal müssen Sie nach unten blättern, um diese Blöcke zu finden. Sie können auch „Alles durchsuchen“ wählen, um die vollständige Liste der Blöcke zu sehen.

Adding other menu elements besides a page link in WordPress Full Site Editing

Eventuell möchten Sie auch die Menüelemente neu anordnen.

Wählen Sie dazu einen Block aus und wählen Sie eines der Pfeilsymbole, um den Block nach links oder rechts zu verschieben.

Moving menu blocks to the left in WordPress Full Site Editing

Wenn Sie nun einen Seitenlink oder andere Menüelemente entfernen möchten, können Sie das zu löschende Element auswählen.

Klicken Sie dann auf das Drei-Punkte-Menü in der Symbolleiste des Blocks und wählen Sie „Löschen“.

Deleting a block from the navigation menu in WordPress Full Site Editing

Erstellen eines Untermenüs

Wenn Sie viele Webseiten haben, z. B. ein Online-Geschäft, dann sollten Sie ein Dropdown-Untermenü erstellen. Auf diese Weise wird Ihr Navigationsmenü nicht mit vielen Links überladen und sieht viel übersichtlicher aus.

Der erste Schritt zur Erstellung eines Untermenüs ist das Klicken auf die Schaltfläche „+“ zum Hinzufügen eines Blocks und die Auswahl des Blocks „Untermenü“.

Selecting the Submenu block in Navigation inside WordPress Full Site Editing

Als nächstes wählen Sie eine Seite oder URL aus, die als übergeordnetes Menü des Untermenüs fungiert.

Wenn Sie z. B. einen Blog betreiben, können Sie Ihre Blogseite als übergeordnetes Menü verwenden. Innerhalb des Untermenüs gibt es dann Links zu den einzelnen Kategorieseiten Ihres Bloginhalts.

In diesem Beispiel werden wir „Blog“ auswählen.

Selecting the Blog page as the submenu's parent menu in WordPress Full Site Editing

Danach klicken Sie einfach auf die Schaltfläche „+“, um einen Block hinzuzufügen.

Es sollte sich unterhalb des übergeordneten Menüs befinden.

Adding a page link block as a submenu in the WordPress Full Site Editor

An dieser Stelle können Sie den Namen des Seitenlinks eingeben, den Sie einfügen möchten, und diesen auswählen. Sie können diesen Schritt beliebig oft wiederholen, um so viele Untermenü-Links wie nötig hinzuzufügen.

Wenn Sie mit dem Navigationsmenü fertig sind, vergessen Sie nicht, Ihre Änderungen zu speichern, indem Sie auf die Schaltfläche „Speichern“ in der oberen rechten Ecke klicken.

Clicking Save to make the menu changes official in WordPress Full Site Editor

Wie Sie die globalen Stile Ihrer Website mit FSE ändern

Die nächste Einstellung unterhalb der Navigation ist Stile. Mit dieser Funktion können Sie das Design Ihrer gesamten Website ändern.

Sobald Sie sich auf der Seite „Stile“ befinden, sehen Sie einige vordefinierte Stiloptionen, die jeweils unterschiedliche Farben, Typografie und Layout-Optionen bieten. Beachten Sie, dass diese vordefinierten Optionen von einem Blockthema zum anderen unterschiedlich aussehen werden.

The Styles page in WordPress Full Site Editor

Sie können auch auf das Augensymbol neben „Stile“ klicken, das für das Stilbuch steht.

Hier sehen Sie die Typografie der Stiloptionen und wie die Textblöcke aussehen werden, die diesen Stil verwenden, z. B. Überschriften, Absätze, Listen und so weiter.

Choosing the Style Book feature in WordPress Full Site Editor

Ähnlich wie im vorherigen Abschnitt gelangen Sie über die Schaltfläche „Stift“ auf dieser Seite zur Bearbeitungsoberfläche.

Hier werden Sie hauptsächlich das rechte Bedienfeld verwenden, um die Typografie, die Farben und das Layout an Ihre Bedürfnisse anzupassen.

The Global Styles settings in WordPress Full Site Editor

Normalerweise sehen Sie im Editor Ihre Homepage. Die Änderungen, die Sie hier vornehmen, werden jedoch auch auf die anderen Webseiten übertragen.

Bearbeiten der Typografie Ihrer Website

Um die Schriftarten Ihrer Website zu ändern, navigieren Sie zur Seitenleiste „Stile“ auf der rechten Seite und wählen Sie „Typografie“.

Jetzt sehen Sie verschiedene Textelemente, die Sie bearbeiten können: Text, Links, Überschriften, Beschriftungen und Schaltflächen.

What Typography elements are available to edit in WordPress Full Site Editor

Die Einstellungen im Element Text bestimmen, wie die Schriftarten auf Ihrer gesamten Website aussehen werden. Das heißt, wenn Sie Änderungen an diesem Element vornehmen, werden diese in allen Blöcken, die Text auf Ihrer Website verwenden, übernommen.

Sie können jedoch auf das Element Links, Überschriften, Bildunterschriften oder Schaltflächen klicken, um den Stil dieser spezifischen Blöcke zu bearbeiten, damit sie sich vom restlichen Text unterscheiden.

Wenn Sie z. B. möchten, dass Ihre Überschriften eine andere Schriftart haben als der Absatzblock, um sich besser abzuheben, dann können Sie die Einstellungen im Element Überschriften konfigurieren.

Im Allgemeinen können Sie für jedes Element die Schriftart, die Größe, das Erscheinungsbild und die Zeilenhöhe ändern.

Die Auswahl der Schriftart hängt von dem von Ihnen verwendeten Thema ab. Unter „Erscheinungsbild“ können Sie festlegen, ob Sie eine normale, fettgedruckte oder kursive Version der Schriftart verwenden möchten.

The Text element settings in WordPress Full Site Editor

Für einige Elemente gibt es spezielle Einstellungen, die Sie daher nach und nach erkunden sollten.

Das Element Überschriften verfügt beispielsweise über Optionen zur Anpassung des Buchstabenabstands und der Groß- und Kleinschreibung.

The Headings typography element settings in WordPress Full Site Editor

Anpassen der Farbpalette Ihrer Website

Kommen wir nun zur Einstellung des Farbschemas für Ihre Website. Dazu klicken Sie einfach auf „Farben“ im Bedienfeld „Formatvorlagen“. Sie sehen zwei Abschnitte: Palette und Farbe.

Wählen Sie die Farben in der „Palette“ aus.

Selecting Palette in the Color options within WordPress Full Site Editor

Auf der Registerkarte Festkörper der Palette sehen Sie die Abschnitte Thema, Standard und Benutzerdefiniert.

Das Theme enthält Farben, mit denen Sie die Farbpalette Ihrer gesamten Website anpassen können.

Theme, Default, and Custom color settings in the Styles tab within WordPress Full Site Editor

In der Zwischenzeit können die Standardfarben Blöcke mit Farbeinstellungen ändern. Beachten Sie, dass einige Themes diese Funktion möglicherweise nicht enthalten, so dass Sie dies in Ihrem Editor möglicherweise nicht sehen.

Benutzerdefinierte Farben schließlich sind Farben, die Sie dem Thema hinzufügen können. Sie können diese Einstellung verwenden, wenn weder die Theme- noch die Standard-Farboptionen für Sie geeignet sind.

Um eine neue benutzerdefinierte Farbe hinzuzufügen, klicken Sie einfach auf die Schaltfläche „+ Farbe hinzufügen“ und verwenden Sie das Farbauswahlwerkzeug.

Adding a Custom color in WordPress Full Site Editor

Wenn Sie eine Design-, Standard- oder benutzerdefinierte Farbe ändern möchten, wählen Sie einfach eine Farbe aus und verwenden Sie das Farbauswahlwerkzeug, um zu einer anderen Option zu wechseln.

Denken Sie daran, dass Blöcke, die diese Farben verwenden, ebenfalls betroffen sind.

Changing a solid color in the Styles settings within WordPress Full Site Editor

Wechseln wir zur Registerkarte „Farbverlauf“. Sie ähnelt der Registerkarte „Einfarbig“, aber die Farboptionen liegen in Form von Farbverläufen vor, die eine Mischung aus zwei oder mehr Farben sind.

Die Themenoptionen enthalten einige Optionen für Farbverläufe unter Verwendung der Volltonfarben des Themas. Die Standardeinstellungen hingegen sind Farbverläufe, die Sie zum Anpassen von Blöcken verwenden können.

Duotone Farben sind Filter, die Sie zu Blöcken mit Bildern hinzufügen können. Sie können nur sehen, welche Duotone verfügbar sind, aber Sie können sie hier nicht bearbeiten.

The Gradient tab in Styles settings of WordPress Full Site Editor

Sie können bei Bedarf auch benutzerdefinierte Farbverläufe erstellen.

Klicken Sie dazu einfach auf die Schaltfläche „+ Farbe hinzufügen“. Dann können Sie den Typ Linearer oder Radialer Farbverlauf auswählen und die Richtung des Farbverlaufs durch Ändern des Winkels anpassen.

Außerdem können Sie weitere Farben für den Farbverlauf auswählen, indem Sie auf eine Stelle des Schiebereglers klicken. Es wird ein Farbwähler angezeigt, aus dem Sie eine Farbe auswählen können.

Creating a custom gradient color in WordPress Full Site Editor

Auf der Registerkarte Farben können Sie die spezifischen Farbeinstellungen für Text, Hintergrund, Links, Beschriftungen, Schaltflächen und Überschriften anpassen.

Klicken Sie einfach auf ein Element und wählen Sie eine Vollton- oder Verlaufsfarbe, um die Farbe des Elements zu ändern. Sie können auch den Vorschaubereich auswählen, um auf den Farbwähler zuzugreifen.

Changing the background color in WordPress Full Site Editor

Anpassen des Layouts Ihrer Website

Die letzte Option auf der Registerkarte Stile ist Layout. Hier können Sie den Abstand zwischen den Elementen Ihrer Webseite ändern.

The Styles tab's Layout settings in WordPress Full Site Editor

Oben im Bedienfeld Layout finden Sie Einstellungen zum Ändern der Breite von Inhalt und Breite Ihrer Seite. Die Inhaltsbreite bestimmt die Standardbreite für einen einzelnen Block, wenn die Ausrichtungseinstellung in der Blocksymbolleiste auf „Keine“ gesetzt ist.

Andererseits bestimmt die Breite die Standardbreite für Blöcke, wenn sie auf breite Ausrichtung eingestellt sind.

Darunter befindet sich die Auffüllung, die den äußeren Abstand zum Inhalt Ihrer Webseite bestimmt.

Mit den verfügbaren Schiebereglern können Sie den oberen, unteren, linken und rechten Abstand einstellen. Wenn Sie die Größe der Auffüllung genauer festlegen möchten, können Sie auf das Schieberegler-Symbol klicken, um eine Pixelgröße einzugeben, wie im Screenshot unten.

Configuring the Padding settings in WordPress Full Site Editor

Ganz unten sehen Sie die Einstellungen für die Blockabstände. Diese Option legt die Abstände zwischen den einzelnen Blöcken fest, damit sie nicht zu dicht oder zu weit voneinander entfernt sind. Sie können dies auf die gleiche Weise bearbeiten wie die Auffüllung.

Vergessen Sie nicht, auf die Schaltfläche „Speichern“ in der oberen rechten Ecke zu klicken, um Ihre Änderungen offiziell zu machen.

Saving the global Styles changes with WordPress Full Site Editing

Wie man WordPress-Seiten mit FSE anpasst

Bisher haben wir uns mit der Navigation und den Stilen beschäftigt. Gehen wir nun zu den Seiten über. Auf dieser Registerkarte sehen Sie eine Liste Ihrer vorhandenen Seiten. Wir werden später mehr über deren Bearbeitung sprechen.

The Pages section in WordPress Full Site Editor

Wenn Sie mehrere Seiten auf einmal verwalten möchten, können Sie unten auf die Schaltfläche „Alle Seiten verwalten“ klicken.

Dies bringt Sie zum Abschnitt Alle Seiten im WordPress-Dashboard.

Clicking the Manage all pages button in WordPress Full Site Editor

Sie können eine neue Seite auch direkt im Full Site Editor erstellen.

Klicken Sie dazu einfach auf die Schaltfläche „+“ Entwurf einer neuen Seite im linken Seitenbereich. Danach geben Sie Ihrer neuen Seite einen Namen und klicken auf „Entwurf erstellen“.

Creating a draft page in WordPress Full Site Editor

Von dort aus können Sie mit der Anpassung der Seite beginnen.

Um eine bestehende Seite zu bearbeiten, wählen Sie die Seite aus, die Sie ändern möchten. In diesem Fall ist es die „Seite: 404.‘

Selecting a page to edit in the Pages section inside WordPress Full Site Editor

Klicken Sie anschließend auf die Schaltfläche „Bearbeiten“.

Sie sehen dann die Bearbeitungsoberfläche für diese Seite.

Clicking the pencil button on a page to edit with WordPress Full Site Editing

Die Bearbeitung von Seiten mit dem Full Site Editor ist im Wesentlichen die gleiche wie mit dem Block-Editor.

Weitere Informationen hierzu finden Sie in verschiedenen Leitfäden. Sie können mit diesen beginnen:

Wie man WordPress-Vorlagen mit FSE bearbeitet

Auf der Seite Templates im WordPress Full Site Editor sehen Sie eine Liste der Templates, die von Ihrem Theme bereitgestellt werden.

The Templates page in WordPress Full Site Editor

In WordPress Full Site Editing sind Templates vordefinierte Strukturen, die Sie verwenden können, um einen bestimmten Seitentyp auf Ihrer Website zu gestalten.

Viele WordPress-Block-Themes werden beispielsweise mit einer Single-Post-Vorlage geliefert. Diese Seitenvorlage definiert das Layout einer Blogpost-Seite, was bedeutet, dass jeder Blogpost auf dieser Website diese Vorlage verwendet.

Diese Funktion kann hilfreich sein, wenn Sie mehrere Seiten in Ihrem WordPress-Blog haben und viele von ihnen das gleiche Layout verwenden.

Wenn Sie das gleiche Element auf diesen Seiten ändern müssen, aber nicht jede Seite einzeln bearbeiten wollen, können Sie einfach die Vorlage ändern. Die Änderungen werden dann auf alle Seiten angewendet, die diese Vorlage verwenden.

Um eine Vorlage zu bearbeiten, können Sie darauf klicken. Danach sehen Sie Details über die spezifische Vorlage, ihre Muster und wann sie zuletzt geändert wurde. Wir werden im nächsten Abschnitt mehr über Muster sprechen.

Klicken Sie nun einfach auf die Schaltfläche „Bearbeiten“ mit dem Bleistift.

Clicking the Edit button on a template in WordPress Full Site Editor

Jetzt können Sie die Seitenvorlage wie andere Elemente mit dem Blockeditor bearbeiten. Sie können neue Blöcke hinzufügen und die Block- oder Seiteneinstellungen anpassen.

Wenn Sie eine benutzerdefinierte Vorlage erstellen möchten, wählen Sie die Schaltfläche „+ Neue Vorlage hinzufügen“ im linken Bereich.

Adding a new template in WordPress Full Site Editor

Wählen Sie hier einfach die Seite aus, für die die neue Vorlage gelten soll.

Alternativ können Sie auch ganz nach unten scrollen und „Benutzerdefinierte Vorlage“ wählen.

Selecting a page template to customize with WordPress Full Site Editing

In diesem Stadium sehen Sie die Bearbeitungsoberfläche mit einer leeren Seite, zu der Sie Blöcke hinzufügen können. Ein Schritt-für-Schritt-Beispiel finden Sie in unserer Anleitung zum Erstellen einer benutzerdefinierten Homepage-Vorlage mit dem Block-Editor.

Um alle Vorlagen auf einmal zu verwalten, können Sie zur Seite Vorlagen zurückkehren und auf die Schaltfläche „Alle Vorlagen verwalten“ klicken.

Clicking the Manage all templates button in WordPress Full Site Editor

Auf dieser Seite können Sie alle Ihre Vorlagenbeschreibungen anzeigen, eine neue Vorlage hinzufügen oder die Anpassungen, die Sie an der Vorlage vorgenommen haben, löschen, um die Standardeinstellungen wiederherzustellen.

So sieht es aus:

Clearing customizations for a template in WordPress Full Site Editor

Wenn Sie eine Seite oder einen Beitrag mit dem Block-Editor bearbeiten und die Vorlage ändern möchten, ohne in den Modus „Full Site Editing“ zu wechseln, können Sie auch das tun.

Rufen Sie einfach die Seite oder den Beitrag auf und öffnen Sie die Seitenleiste mit den Seiten- oder Beitragseinstellungen. Suchen Sie dann den Abschnitt „Vorlage“ unter „Zusammenfassung“ und klicken Sie darauf.

Clicking Edit template on a page to access the WordPress Full Site Editor for Templates

Sie können das Dropdown-Menü verwenden, um die Seitenvorlage zu ändern, oder auf „Vorlage bearbeiten“ klicken, um sofort auf den Vorlageneditor zuzugreifen. Alternativ können Sie auch auf die Schaltfläche „Vorlage hinzufügen“ klicken, um eine neue benutzerdefinierte Vorlage von Grund auf zu erstellen.

Wie man WordPress-Muster mit FSE modifiziert

In WordPress Full Site Editing sind Muster gebrauchsfertige Sätze von Blöcken, die Sie in eine Seite oder einen Beitrag einfügen können. Wenn Sie ein Muster erstellen, wird es zu Ihrem Blockverzeichnis hinzugefügt, und Sie können es ganz einfach zu einem beliebigen Beitrag oder einer Seite auf Ihrer Website hinzufügen.

The Block Pattern directory in WordPress block editor

Muster sind nützlich, wenn Sie denselben Satz von Blöcken für mehrere Seiten oder Beiträge verwenden müssen. Viele Leute haben sie verwendet, um benutzerdefinierte Call-to-Action-Banner oder Bildergalerien in ihren Blogbeiträgen zu entwerfen.

Außerdem haben Sie die Möglichkeit, diese Muster zu „synchronisieren“. Das heißt, wenn ein Muster in mehreren Beiträgen oder Seiten verwendet wird, gelten alle Änderungen, die Sie vornehmen, automatisch für alle Instanzen, in denen das Muster verwendet wird.

Auf der Seite „Muster“ im WordPress Full Site Editor sehen Sie eine Sammlung von Mustern.

The Patterns page in WordPress Full Site Editor

Die mit einem Ordnersymbol gekennzeichneten Menüs enthalten eine Liste von Standardmustern, die von Ihrem gewählten Thema angeboten werden. Diese sind gesperrt und können nicht bearbeitet werden.

Darunter finden Sie „Vorlagenteile“, die eine besondere Art von Mustern sind, die in der Struktur Ihrer Website verwendet werden und nicht unbedingt Teil des Seiteninhalts sind. Beispiele dafür sind die Kopfzeile Ihrer Website, die Fußzeile, der Kommentarbereich und so weiter. Diese sind alle anpassbar.

Um ein neues Muster hinzuzufügen, klicken Sie auf die Schaltfläche „+ Muster erstellen“ im linken Bereich und wählen Sie zwischen der Erstellung eines neuen Musters oder eines Vorlageteils.

Creating a new template part or pattern in WordPress Full Site Editor

Wenn Sie sich nicht sicher sind, welche Vorlage Sie wählen sollen, dann ist ein Muster vergleichbar mit einem wiederverwendbaren Block, den Sie zu Ihrem Seiten- oder Beitragsinhalt hinzufügen können. Ein Vorlagenteil hingegen ist eher ein Satz von Blöcken, die Teil Ihrer Vorlagenstruktur sind, wie Kopfzeile, Fußzeile oder Seitenleiste.

Ein Vorlagenteil wird automatisch synchronisiert, so dass alle an ihm vorgenommenen Änderungen auf Ihrer gesamten Website gelten. Andererseits kann ein Muster synchronisiert oder nicht synchronisiert werden.

Danach müssen Sie das Vorlagenteil oder -muster benennen und festlegen, ob es synchronisiert werden soll. Sobald Sie das getan haben, klicken Sie einfach auf „Erstellen“, und Sie werden zur Bearbeitungsoberfläche weitergeleitet.

Naming a new pattern in WordPress Full Site Editor

Weitere Informationen zur Erstellung und Verwendung von Mustern finden Sie in unserem Leitfaden für Einsteiger zur Verwendung von WordPress-Blockmustern.

Wenn Sie eine Seite oder Vorlage bearbeiten, möchten Sie vielleicht auch ein Blockmuster oder einen Vorlagenteil anpassen. Das können Sie direkt im Editor tun, ohne das Menü „Muster“ aufzurufen.

Fahren Sie einfach mit dem Mauszeiger über das Muster oder den Vorlagenteil. Klicken Sie dann auf „Bearbeiten“. Sie werden dann zum Full Site Editor für dieses Element weitergeleitet.

Clicking Edit on a pattern or template part when editing a post or page using the block editor

Tipps zur optimalen Nutzung von WordPress für die vollständige Bearbeitung von Websites

Nachdem Sie nun mit den Grundlagen der vollständigen Website-Bearbeitung vertraut sind, wollen wir nun einige Tipps und Tricks besprechen, um das Beste daraus zu machen.

Verwenden Sie die Befehlssuchleiste

Mit der Befehlssuchleiste können Sie schnell zu einem bestimmten Teil Ihrer Website navigieren oder Aktionen zur Bearbeitung Ihres Webdesigns durchführen.

Diese Funktion kann hilfreich sein, wenn Sie eine bestimmte Einstellung im Full Site Editor sofort finden möchten, anstatt verschiedene Schaltflächen und Menüs zu durchlaufen.

Wenn Sie sich im Hauptmenü des Full Site Editor befinden, können Sie auf das Lupensymbol klicken, um es zu verwenden.

Clicking the magnifying glass icon in WordPress Full Site Editor

Alternativ können Sie auch Strg/Befehl+K auf Ihrer Tastatur drücken, während Sie sich in der Bearbeitungsoberfläche befinden.

Geben Sie dann einfach ein, was Sie suchen oder tun möchten. So können Sie beispielsweise einen neuen Beitrag oder eine neue Seite hinzufügen, ohne zum WordPress-Dashboard zurückzukehren.

Using the Command Search Bar to add a new post or page

Blöcke mit Listenansicht verwalten

Wenn Sie eine Seite, eine Vorlage oder ein Muster bearbeiten, fügen Sie möglicherweise so viele Blöcke hinzu, dass es schwierig ist, den Überblick zu behalten.

An dieser Stelle kann die Listenansicht nützlich sein. Mit dieser Funktion können Sie jeden Block sehen, der der Seite, der Vorlage oder dem Muster hinzugefügt wurde, einschließlich der Blöcke, die in einem anderen übergeordneten Block verschachtelt sind.

Um die Listenansicht zu aktivieren, müssen Sie nur auf die dreizeilige Schaltfläche oben links in der Menüleiste des Editors klicken. Sie sehen dann alle Blöcke, die in dieser Seite, diesem Beitrag, dieser Vorlage oder diesem Muster verwendet werden.

Wenn Sie einen bestimmten Block konfigurieren möchten, der sich in einer Gruppe, Zeile, Spalte oder ähnlichem befindet, klicken Sie einfach auf diesen Block in der Listenansicht. Von dort aus wird der Block ausgewählt und die Symbolleiste erscheint.

Activating the List View on Full Site Editor

Vertraut werden mit Tastaturkürzeln

Wenn Sie Ihre Website schneller bearbeiten möchten, sollten Sie Tastaturkürzel lernen. Mit Tastenkombinationen können Sie mit der Tastatur durch die verschiedenen Schaltflächen und Einstellungen navigieren, anstatt die Maus hin und her zu bewegen.

Die Tastenkombinationen, die im Block-Inhalts-Editor verwendet werden, funktionieren auch in der vollständigen Website-Bearbeitung. Weitere Informationen finden Sie in unserer Liste der WordPress-Tastaturkürzel.

Einschränkungen der vollständigen Bearbeitung von WordPress-Seiten

WordPress Full Site Editing hat es neuen WordPress-Benutzern definitiv einfacher gemacht, ihre Websites anzupassen. Dennoch hat diese Funktion einige Unzulänglichkeiten.

Zum einen benötigen Sie ein Block-Theme, um es zu verwenden. Es gibt viele neue Block-Themes, aber nicht so viele wie normale WordPress-Themes. Wenn Sie WooCommerce verwenden, kann die Auswahl an Themes sogar noch begrenzter sein.

Außerdem kann ein Wechsel des Themes mühsam sein, da Sie das Theme neu einrichten und prüfen müssen, ob es Kompatibilitätsprobleme mit Ihren WordPress-Plugins gibt.

Außerdem hängt ein Großteil Ihrer Anpassungen von den Optionen ab, die Ihr WordPress-Theme bietet. Dies kann Ihre Kreativität beim Aufbau Ihrer Website einschränken.

So verwenden Sie eine Alternative zur vollständigen Bearbeitung der Website

Wenn Sie auf der Suche nach einer Alternative für WordPress Full Site Editing sind, dann sollten Sie sich SeedProd ansehen. Es ist ein leistungsfähiges Plugin für die Seitenerstellung und ein Theme-Builder mit mehr als 300 mobilfreundlichen Vorlagen zur Erstellung jeder Art von Website.

Der Drag-and-Drop-Builder ist einfach zu bedienen, und es stehen über 90 Seitenblöcke für Inhaltselemente zur Verfügung. Es gibt auch Dutzende von vorgefertigten Abschnitten, wie z. B. Aufrufe zum Handeln, die für Konversionen optimiert sind, sodass Sie diese Elemente nicht von Grund auf neu entwerfen müssen.

SeedProd theme builder

Weitere Informationen finden Sie in unserem Bericht über SeedProd und in unserem Artikel über die Erstellung eines eigenen WordPress-Themes.

Wir hoffen, dass dieser Leitfaden für Einsteiger Ihnen geholfen hat, den Umgang mit WordPress Full Site Editing (FSE) zu erlernen. Vielleicht möchten Sie auch unsere Liste der besten WordPress Page Builder Plugins und unseren Artikel über häufige Probleme mit dem WordPress Block Editor lesen.

Wenn Ihnen dieser Artikel gefallen hat, dann abonnieren Sie bitte unseren YouTube-Kanal für WordPress-Videotutorials. Sie können uns auch auf Twitter und Facebook finden.

Offenlegung: Unsere Inhalte werden von unseren Lesern unterstützt. Das bedeutet, dass wir möglicherweise eine Provision verdienen, wenn Sie auf einige unserer Links klicken. Mehr dazu erfahren Sie unter Wie WPBeginner finanziert wird , warum das wichtig ist und wie Sie uns unterstützen können. Hier finden Sie unseren redaktionellen Prozess .

Das ultimative WordPress Toolkit

Erhalte KOSTENLOSEN Zugang zu unserem Toolkit - eine Sammlung von WordPress-bezogenen Produkten und Ressourcen, die jeder Profi haben sollte!

Reader Interactions

15 KommentareEine Antwort hinterlassen

  1. Syed Balkhi says

    Hey WPBeginner readers,
    Did you know you can win exciting prizes by commenting on WPBeginner?
    Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
    You can get more details about the contest from here.
    Start sharing your thoughts below to stand a chance to win!

  2. Simone says

    Thanks for the comprehensive guide.
    Im looking a way to add custom icons (for example Font Awesome) near items (pages, categories, submenus, custom links) in the navigation. Is that possible?

  3. Mrteesurez says

    For me, I still love Classic editing, yes. Even some ecommerce plugins and other recommendations Classic editior.

    Gutenberg is quite slow, sluggish, and not in anyway friendly on mobile.

    I prefer using page builder may be like Seedprod or elementor instead of gutenberg.

    There are still many works for the community to do on that part of gutenberg to make it friendly, fast and mobile optimize.

      • Mrteesurez says

        But one thing I am thinking of is that, one day, Gutenberg might chase away page builders once it’s well developed to be friendly and fast.

        Block editor should be the best if given attention the community, may be later in future.

        This gives me a hope that WordPress still have future.

        • Moinuddin Waheed says

          Gutenberg is the future as for as wordpress is concerned.
          see as for the WordPress developers are concerned, they are making every effort possible to make the WordPress as accessible and available open source as possible.
          As for complexity, we have been used to using classic editor for a long time, given the time and energy invested, it is but natural to have an inclination towards it.

  4. Jiří Vaněk says

    I avoided editing the website using full site editing for quite a long time. For one simple reason. I don’t like working in Gutenberg, so I automatically assumed that working with full site editing would be as uncomfortable as working in Gutenberg. But after reading this article, I will probably give this possibility a chance and try to explore it more deeply. Thanks to wpbeginner, I’ve already learned to control quite a lot of things in Gutenberg, so I’m slowly getting used to finally knowing where to find what and where to set what specifically.

  5. THANKGOD JONATHAN says

    Can I do the full site editing without any coding skills? As I always egnore this action in my WP admin dashboad because of been afraid not to cause any problems on my site but now as always, I will try to edit some global settings of my site if the editing is visual.

  6. Moinuddin Waheed says

    Full site edit is very good to use for the site to be light and no extra code required. when we install any external plugin for page building, though it makes our task easy but at the same time there is some tradeoff in terms of page speed and load. This full site editor I think will help us build a lightning fast blog which will have fast loading time and Efficient.
    thank you for let us know about full site edit.

    • Jiří Vaněk says

      That’s not quite the case. It always depends on the creator of the website. I built about 7 websites on Elementor, and in pagespeed Insight they all have speeds of 98 to 99. It’s not the pagebuilder, but the overall optimization of the website. Unfortunately, full site editing does not guarantee a fast website. It is important to consider the web as a complex unit.

  7. Ralph says

    Wow, this looks really powerful! Do you guys think it may be answear to the elementor builder? I’ve heard using elementor is bad, as it may slow down website a lot.

    • WPBeginner Support says

      It heavily depends on how you design the site for speed concerns, the plugin itself should not cause a massive performance drop. While the full site editor is improving we would recommend taking a look at the final section of the article for our opinion :)

      Admin

Eine Antwort hinterlassen

Danke, dass du einen Kommentar hinterlassen möchtest. Bitte beachte, dass alle Kommentare nach unseren kommentarpolitik moderiert werden und deine E-Mail-Adresse NICHT veröffentlicht wird. Bitte verwende KEINE Schlüsselwörter im Namensfeld. Lass uns ein persönliches und sinnvolles Gespräch führen.