{"id":10865,"date":"2026-04-16T14:11:39","date_gmt":"2026-04-16T14:11:39","guid":{"rendered":"\/de\/tutorials\/?p=10865"},"modified":"2026-04-16T14:11:41","modified_gmt":"2026-04-16T14:11:41","slug":"wordpress-gutenberg-editor","status":"publish","type":"post","link":"\/de\/tutorials\/wordpress-gutenberg-editor","title":{"rendered":"Was ist WordPress Gutenberg? Den Block-Editor verstehen"},"content":{"rendered":"<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"780\" height=\"454\" src=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image.jpeg\" alt=\"\" class=\"wp-image-10866\" srcset=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image.jpeg 780w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-300x175.jpeg 300w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-768x447.jpeg 768w\" sizes=\"(max-width: 780px) 100vw, 780px\" \/><\/figure><p>Wenn Sie WordPress noch nicht kennen, sollten Sie sich zuerst mit Gutenberg, dem Block-Editor, vertraut machen, um die Plattform effektiver zu verwalten. Er wurde als Ersatz f&uuml;r den klassischen Editor eingef&uuml;hrt und ist inzwischen ein zentraler Bestandteil der Website-Erstellung im Content-Management-System.<\/p><p>WordPress Gutenberg verwendet ein blockbasiertes Designsystem und ist dadurch f&uuml;r alle Erfahrungsstufen deutlich benutzerfreundlicher. Wenn Sie seine Funktionen und Gestaltungsm&ouml;glichkeiten verstehen, k&ouml;nnen Sie Ihre ideale Website erstellen, ohne programmieren zu m&uuml;ssen.<\/p><p>Ganz gleich, ob Sie einen pers&ouml;nlichen Blog oder eine mehrseitige Website erstellen: Diese Anleitung hilft Ihnen dabei, das Beste aus dem Block-Editor herauszuholen.<\/p><p>\n\n\n\n\n\n<div class=\"protip\">\n                    <h2 class=\"featured-snippet title\">Was ist WordPress Gutenberg?<\/h2>\n                    <p>Gutenberg ist der Standard-Editor von WordPress, der den klassischen Editor ersetzt hat. Damit k&ouml;nnen Sie Inhalte ganz einfach erstellen und gestalten, indem Sie Bl&ouml;cke f&uuml;r verschiedene Website-Elemente wie Text, Bilder und Videos verwenden. Dank der Drag-and-Drop-Oberfl&auml;che ist Gutenberg einfach zu bedienen und gibt Ihnen mehr Flexibilit&auml;t, Ihre Website genau nach Ihren Vorstellungen zu gestalten.<\/p>\n                <\/div>\n\n\n\n<\/p><h2 class=\"wp-block-heading\"><\/h2><p>In der WordPress-Community ist Gutenberg nicht nur ein Inhaltseditor &ndash; es ist Teil eines gr&ouml;&szlig;eren laufenden Projekts, das die gesamte Bearbeitung von Websites ver&auml;ndern soll. Das WordPress-Core-Team hat daf&uuml;r eine <a href=\"https:\/\/wordpress.org\/about\/roadmap\/\" target=\"_blank\" rel=\"noopener\">Roadmap<\/a> definiert:<\/p><ul class=\"wp-block-list\">\n<li><strong>Einfachere Bearbeitung.<\/strong> Der mit WordPress 5.0 eingef&uuml;hrte Gutenberg-Block-Editor bietet einen intuitiveren Ansatz f&uuml;r die Website-Erstellung.<\/li>\n\n\n\n<li><strong>Anpassung.<\/strong> WordPress 5.9 erg&auml;nzte vollst&auml;ndige Website-Bearbeitung, Blockmuster, ein Blockverzeichnis und blockbasierte Themes auf Grundlage der Gutenberg-Oberfl&auml;che.<\/li>\n\n\n\n<li><strong>Zusammenarbeit.<\/strong> Zuk&uuml;nftige Updates sollen die gemeinsame Erstellung von Inhalten vereinfachen und benutzerfreundlicher machen.<\/li>\n\n\n\n<li><strong>Mehrsprachigkeit.<\/strong> Das Team arbeitet daran, mehrsprachige Websites direkt in der Kernsoftware zu unterst&uuml;tzen.<\/li>\n<\/ul><h3 class=\"wp-block-heading\"><strong>So funktioniert der Gutenberg-Editor<\/strong><\/h3><p>Der Gutenberg-Block-Editor von WordPress erleichtert das Hinzuf&uuml;gen und Bearbeiten verschiedener Elemente in Ihren Beitr&auml;gen und Seiten, indem er einzelne Inhaltsbl&ouml;cke verwendet. Jeder Block funktioniert als eigenst&auml;ndiges Element mit anpassbaren Einstellungen.<\/p><p>Der Einstieg in den Block-Editor ist einfach. Gehen Sie zu Ihrem WordPress-Dashboard und dann zu <strong>Seiten<\/strong> oder <strong>Beitr&auml;ge<\/strong> &rarr; <strong>Erstellen<\/strong>, um die Gutenberg-Oberfl&auml;che zu &ouml;ffnen.<\/p><figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"449\" src=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-14-1024x449.png\" alt=\"\" class=\"wp-image-10882\" srcset=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-14.png 1024w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-14-300x132.png 300w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-14-768x337.png 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure><p>Um einen Block hinzuzuf&uuml;gen, klicken Sie oben links auf das Symbol <strong>+<\/strong>, um alle verf&uuml;gbaren, nach Typ geordneten Optionen anzuzeigen. Ziehen Sie einen Block per Drag-and-Drop in den Editor und platzieren Sie ihn an der gew&uuml;nschten Stelle.<\/p><p>Sie k&ouml;nnen jeden Block &uuml;ber die Werkzeugleiste oberhalb des Elements oder &uuml;ber das Einstellungsfeld auf der rechten Seite anpassen.<\/p><p>F&uuml;r ein schnelleres Design bietet Gutenberg <a href=\"https:\/\/www.hostinger.com\/tutorials\/wordpress-block-patterns\">Blockmuster<\/a> &ndash; vorgefertigte Kombinationen aus Bl&ouml;cken, etwa Spalten mit Bildern und Buttons.<\/p><p>Wenn Sie technisch versiert sind, k&ouml;nnen Sie sogar eigene <a href=\"https:\/\/www.hostinger.com\/tutorials\/wordpress-blocks\">WordPress-Bl&ouml;cke<\/a> oder Blockmuster erstellen und mit anderen teilen.<\/p><h2 class=\"wp-block-heading\" id=\"h-gutenberg-editor-vs-klassischer-editor\"><strong>Gutenberg-Editor vs. klassischer Editor<\/strong><\/h2><p>Um den Block-Editor besser zu verstehen, vergleichen wir ihn mit seinem Vorg&auml;nger und sehen uns an, welche Verbesserungen er mitbringt.<\/p><figure class=\"wp-block-image size-full is-resized\"><img decoding=\"async\" width=\"514\" height=\"233\" src=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-24.png\" alt=\"\" class=\"wp-image-10905\" style=\"width:743px;height:auto\" srcset=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-24.png 514w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-24-300x136.png 300w\" sizes=\"(max-width: 514px) 100vw, 514px\" \/><\/figure><p>Der klassische WordPress-Editor, der auf dem TinyMCE-HTML-Editor nach dem Prinzip What You See Is What You Get (WYSIWYG) basiert, bietet eine unkomplizierte, vertraute Oberfl&auml;che zum Erstellen und Bearbeiten von Beitr&auml;gen und Seiten. Er orientiert sich an klassischen Textverarbeitungsprogrammen wie Microsoft Word und bietet Fett, Kursiv und Listen f&uuml;r eine schnelle Formatierung.<\/p><p>&Uuml;ber den visuellen Editor k&ouml;nnen Nutzer Medien &uuml;ber den integrierten Bild-Uploader hochladen. Wenn Sie zum Texteditor wechseln, k&ouml;nnen Sie benutzerdefinierten HTML-Code zu Beitr&auml;gen und Seiten hinzuf&uuml;gen.<\/p><p>Der klassische Editor ist zwar zuverl&auml;ssig und einfach zu bedienen, bietet aber nur wenig Flexibilit&auml;t beim Design. F&uuml;r komplexe Layouts oder fortgeschrittene Designs sind oft zus&auml;tzliche Plugins oder benutzerdefiniertes HTML erforderlich. Das Hinzuf&uuml;gen von Bildern und Videos wirkte umst&auml;ndlich. Au&szlig;erdem k&ouml;nnen Sie keine Echtzeitvorschau Ihrer Live-Inhalte sehen.<\/p><p>Hier kommt der Gutenberg-Block-Editor ins Spiel, um diese Einschr&auml;nkungen zu beheben.<\/p><p>Statt auf ein einzelnes Textfeld zu setzen, verwendet Gutenberg einzelne Bl&ouml;cke f&uuml;r verschiedene Elemente, einschlie&szlig;lich Medien. Dieser Ansatz macht das Seitendesign visueller und intuitiver.<\/p><p>Die Drag-and-Drop-Funktion macht Shortcodes und zus&auml;tzliche Plugins &uuml;berfl&uuml;ssig, sodass Sie benutzerdefinierte Layouts erstellen und die Ergebnisse in Echtzeit sehen k&ouml;nnen. Sie k&ouml;nnen au&szlig;erdem Blockmuster und deren Layouts an Ihre Anforderungen anpassen.<\/p><p>Mit der vollst&auml;ndigen Website-Bearbeitung k&ouml;nnen Sie jetzt Header, Footer und andere Website-Elemente in Beitr&auml;gen und Seiten gestalten. Au&szlig;erdem ist Gutenberg entwicklerfreundlich und erm&ouml;glicht technisch versierten Nutzern, benutzerdefinierte Bl&ouml;cke und wiederverwendbare Vorlagen zu erstellen.<\/p><p>Hier ist eine Zusammenfassung der Unterschiede zwischen dem Gutenberg-Editor und dem klassischen Editor:<\/p><figure tabindex=\"0\" class=\"wp-block-table\"><table class=\"has-fixed-layout\"><tbody><tr><td><\/td><td><strong>Gutenberg-Editor<\/strong><\/td><td><strong>Klassischer Editor<\/strong><\/td><\/tr><tr><td><strong>Editor-Oberfl&auml;che<\/strong><\/td><td>Reaktionsschnell und intuitiv mit selbsterkl&auml;renden Men&uuml;einstellungen.<\/td><td>Einfache Textoberfl&auml;che, &auml;hnlich wie bei einer Online-Textverarbeitung wie Google Docs.<\/td><\/tr><tr><td><strong>Inhaltserstellung<\/strong><\/td><td>Verwendet Bl&ouml;cke mit integrierten Inhalts- und Anpassungsfunktionen.<\/td><td>Bietet eine leere Fl&auml;che zum Schreiben von Beitr&auml;gen und Seiten.<\/td><\/tr><tr><td><strong>Benutzerfreundlichkeit<\/strong><\/td><td>Verwendet Drag-and-drop-Bl&ouml;cke. Programmierung ist optional.<\/td><td>Funktioniert wie Google Docs, ist aber mit grundlegenden HTML-Kenntnissen einfacher zu nutzen.<\/td><\/tr><tr><td><strong>Funktionen<\/strong><\/td><td>Bietet Drag-and-drop-Bl&ouml;cke, Echtzeitvorschauen und einfache Anpassungen f&uuml;r jedes Kenntnisniveau.<\/td><td>Bietet ein einfaches Textfeld mit grundlegenden Formatierungswerkzeugen.<\/td><\/tr><tr><td><strong>Vorteile<\/strong><\/td><td>Bietet flexibles Design, Drag-and-drop-Bl&ouml;cke, Echtzeitvorschauen und wiederverwendbare Vorlagen.<\/td><td>Einfache, vertraute Oberfl&auml;che mit leichter Formatierung und minimalem Lernaufwand.<\/td><\/tr><tr><td><strong>Nachteile<\/strong><\/td><td>Es braucht etwas &Uuml;bung, um sich daran zu gew&ouml;hnen.<\/td><td>Es fehlen Flexibilit&auml;t beim Design, visuelle Layout-Werkzeuge und moderne Anpassungsfunktionen.<\/td><\/tr><\/tbody><\/table><\/figure><p>Der Gutenberg-Block-Editor ist in WordPress 5.0 und neueren Versionen vorinstalliert. Wenn Sie eine &auml;ltere Version verwenden, k&ouml;nnen Sie weiterhin darauf zugreifen, indem Sie das <a href=\"https:\/\/wordpress.org\/plugins\/gutenberg\/\" target=\"_blank\" rel=\"noopener\">Gutenberg-Plugin<\/a> installieren. Wir empfehlen jedoch, auf die neueste WordPress-Version zu aktualisieren, um die Sicherheit zu optimieren.<\/p><p>Sie vermeiden den Aufwand manueller Updates, indem Sie zu Hostinger wechseln. <a href=\"https:\/\/www.hostinger.com\/wordpress-hosting\">Die Managed-WordPress-Tarife von Hostinger<\/a> enthalten <strong>Smart WordPress Auto Updates<\/strong>, sodass Ihre Website nach der Aktivierung sicher und aktuell bleibt. Da jedes WordPress-Update in der Regel Verbesserungen f&uuml;r Gutenberg enth&auml;lt, sparen Sie mit aktivierten Smart Updates Zeit.<\/p><figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/2\/2024\/06\/New-WP_in-text-banner.png\/public\" alt=\"\" class=\"wp-image-111781\"><\/figure><h2 class=\"wp-block-heading\" id=\"h-so-verwenden-sie-den-wordpress-gutenberg-block-editor\"><strong>So verwenden Sie den WordPress Gutenberg-Block-Editor<\/strong><\/h2><p>Sehen wir uns die wichtigsten <a href=\"https:\/\/www.hostinger.com\/tutorials\/wordpress-hidden-features\">WordPress-Funktionen<\/a> und die Schritte an, mit denen Sie Gutenberg f&uuml;r Ihre Website verwenden k&ouml;nnen.<\/p><h3 class=\"wp-block-heading\"><strong>So f&uuml;gen Sie einen neuen Block hinzu<\/strong><\/h3><p>Der erste Schritt bei der Verwendung des Block-Editors besteht darin, einen neuen Block hinzuzuf&uuml;gen. Daf&uuml;r gibt es mehrere M&ouml;glichkeiten.<\/p><p>Wenn Sie den Gutenberg-Editor &ouml;ffnen, sehen Sie, dass bereits ein Titelblock vorhanden ist. Um einen weiteren Block hinzuzuf&uuml;gen, bewegen Sie den Cursor einfach darunter und klicken auf das schwarze <strong>+<\/strong>-Symbol, um aus den verf&uuml;gbaren Optionen auszuw&auml;hlen. Wenn Sie den ben&ouml;tigten Block nicht sehen, klicken Sie auf <strong>Alle durchsuchen<\/strong>, um weitere anzuzeigen.<\/p><figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"422\" src=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-15-1024x422.png\" alt=\"\" class=\"wp-image-10885\" srcset=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-15.png 1024w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-15-300x124.png 300w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-15-768x317.png 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure><p>Alternativ k&ouml;nnen Sie oben links den Block-Inserter umschalten, der mit einer blauen <strong>+<\/strong>-Schaltfl&auml;che markiert ist. Dort k&ouml;nnen Sie auf einen Block klicken, um ihn an der Position Ihres Cursors einzuf&uuml;gen, oder ihn zwischen vorhandene Bl&ouml;cke im Editor ziehen.<\/p><figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"422\" src=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-15-1024x422.png\" alt=\"\" class=\"wp-image-10884\" srcset=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-15.png 1024w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-15-300x124.png 300w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-15-768x317.png 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure><p>Eine weitere praktische Methode ist, einen Schr&auml;gstrich (<strong>\/<\/strong>) gefolgt vom Namen des Blocks einzugeben. Sobald er angezeigt wird, dr&uuml;cken Sie die <strong>Eingabetaste<\/strong>, um ihn Ihrer Seite oder Ihrem Beitrag hinzuzuf&uuml;gen.<\/p><figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"538\" height=\"556\" src=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-5.png\" alt=\"\" class=\"wp-image-10876\" srcset=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-5.png 538w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-5-290x300.png 290w\" sizes=\"(max-width: 538px) 100vw, 538px\" \/><\/figure><p>Es stehen sechs Arten von Bl&ouml;cken zur Auswahl &ndash; Text, Medien, Design, Widgets, Theme und Einbettungen. Wenn der ben&ouml;tigte Block nicht verf&uuml;gbar ist, schl&auml;gt der Inserter Optionen aus dem <a href=\"https:\/\/wordpress.org\/documentation\/article\/block-directory\/\" target=\"_blank\" rel=\"noopener\">Gutenberg-Block-Verzeichnis<\/a> vor, das Teil des WordPress-Plugin-Verzeichnisses ist.<\/p><figure class=\"wp-block-image size-full is-resized\"><img decoding=\"async\" width=\"291\" height=\"636\" src=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-25.png\" alt=\"\" class=\"wp-image-10908\" style=\"width:504px;height:auto\" srcset=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-25.png 291w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-25-137x300.png 137w\" sizes=\"(max-width: 291px) 100vw, 291px\" \/><\/figure><h3 class=\"wp-block-heading\"><strong>So passen Sie Bl&ouml;cke an<\/strong><\/h3><p>Das Anpassen von Gutenberg-Bl&ouml;cken in WordPress ist einfach. Klicken Sie einfach im Editor auf einen Block, dann erscheint seine Werkzeugleiste oben.<\/p><p>Die Werkzeugleiste &auml;ndert sich je nach ausgew&auml;hltem Block. Wenn Sie zum Beispiel mit einem Tabellenblock arbeiten, sehen Sie Optionen zum Anpassen der Textausrichtung oder zum Hinzuf&uuml;gen von Zeilen und Spalten.<\/p><figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"867\" height=\"548\" src=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-4.png\" alt=\"\" class=\"wp-image-10873\" srcset=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-4.png 867w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-4-300x190.png 300w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-4-768x485.png 768w\" sizes=\"(max-width: 867px) 100vw, 867px\" \/><\/figure><p>Sie k&ouml;nnen auch auf weitere Einstellungen zugreifen, indem Sie oben rechts im Editor auf das Zahnradsymbol klicken. Dadurch &ouml;ffnet sich ein Bereich in der rechten Seitenleiste, in dem Sie Stile anpassen, Abmessungen &auml;ndern und die Typografie &auml;ndern k&ouml;nnen. Fortgeschrittene Nutzer k&ouml;nnen benutzerdefiniertes HTML oder CSS hinzuf&uuml;gen, um beliebige &Auml;nderungen vorzunehmen.<\/p><figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"445\" src=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-7-1024x445.png\" alt=\"\" class=\"wp-image-10871\" srcset=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-7.png 1024w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-7-300x130.png 300w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-7-768x333.png 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure><h3 class=\"wp-block-heading\"><strong>So ordnen Sie Bl&ouml;cke an<\/strong><\/h3><p>Einer der gr&ouml;&szlig;ten Vorteile des Wechsels zu Gutenberg ist, wie einfach sich Elemente anordnen lassen. Um einen Block zu verschieben, klicken Sie einfach darauf, w&auml;hlen in der Werkzeugleiste das Symbol mit den sechs Punkten aus und ziehen ihn an die gew&uuml;nschte Stelle.<\/p><figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"516\" height=\"331\" src=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-26.png\" alt=\"\" class=\"wp-image-10909\" srcset=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-26.png 516w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-26-300x192.png 300w\" sizes=\"(max-width: 516px) 100vw, 516px\" \/><\/figure><p>Sie k&ouml;nnen auch mehrere Bl&ouml;cke gleichzeitig verschieben. Halten Sie die <strong>Umschalttaste<\/strong> gedr&uuml;ckt, klicken Sie auf den ersten Block und w&auml;hlen Sie dann die weiteren aus, die Sie einbeziehen m&ouml;chten. Sobald sie vor&uuml;bergehend gruppiert sind, verwenden Sie das Symbol mit den sechs Punkten, um sie gemeinsam zu ziehen.<\/p><figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"700\" height=\"452\" src=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-6.png\" alt=\"\" class=\"wp-image-10890\" srcset=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-6.png 700w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-6-300x194.png 300w\" sizes=\"(max-width: 700px) 100vw, 700px\" \/><\/figure><h3 class=\"wp-block-heading\"><strong>So gruppieren Sie mehrere Bl&ouml;cke<\/strong><\/h3><p>Angenommen, Sie erstellen auf einer Homepage einen Abschnitt f&uuml;r Services, in dem jedes Element ein Bild, eine &Uuml;berschrift und eine Beschreibung enth&auml;lt, die alle sauber ausgerichtet sind. Das Gruppieren von Bl&ouml;cken eignet sich daf&uuml;r ideal, weil Sie so den gesamten Abschnitt als eine Einheit verwalten k&ouml;nnen.<\/p><p>Sie k&ouml;nnen Bl&ouml;cke mit den Bl&ouml;cken <strong>&bdquo;Gruppe&ldquo;<\/strong>, <strong>&bdquo;Spalten&ldquo;<\/strong>, <strong>&bdquo;Zeile&ldquo;<\/strong> oder <strong>&bdquo;Stapel&ldquo;<\/strong> aus dem Bereich <strong>&bdquo;Design&ldquo;<\/strong> im Block-Inserter gruppieren. Diese Designbl&ouml;cke erstellen verschachtelte Bl&ouml;cke &ndash; also Bl&ouml;cke innerhalb eines &uuml;bergeordneten Blocks &ndash; und geben Ihrem Layout eine klare Struktur.<\/p><figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"440\" height=\"684\" src=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-2.png\" alt=\"\" class=\"wp-image-10875\" srcset=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-2.png 440w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-2-193x300.png 193w\" sizes=\"(max-width: 440px) 100vw, 440px\" \/><\/figure><p>Zum Beispiel kann ein Spaltenblock als &uuml;bergeordneter Block dienen und untergeordnete Bl&ouml;cke wie Text und Bilder enthalten, die im Editor darunter einger&uuml;ckt angezeigt werden.<\/p><p>So verwenden Sie den Block &bdquo;<strong>Spalten<\/strong>&ldquo;:<\/p><ol class=\"wp-block-list\">\n<li>&Ouml;ffnen Sie den Block-Inserter &rarr; <strong>Design<\/strong> &rarr; <strong>Spalten<\/strong>.<\/li>\n\n\n\n<li>W&auml;hlen Sie ein vorgefertigtes Layout aus oder erstellen Sie ein eigenes.<\/li>\n<\/ol><figure class=\"wp-block-image size-full is-resized\"><img decoding=\"async\" width=\"522\" height=\"228\" src=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/Screenshot-2026-04-16-at-16.03.06.png\" alt=\"\" class=\"wp-image-10919\" style=\"width:747px;height:auto\" srcset=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/Screenshot-2026-04-16-at-16.03.06.png 522w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/Screenshot-2026-04-16-at-16.03.06-300x131.png 300w\" sizes=\"(max-width: 522px) 100vw, 522px\" \/><\/figure><p>3. F&uuml;gen Sie innerhalb jeder Spalte Bl&ouml;cke hinzu, indem Sie auf das <strong>+<\/strong>-Symbol klicken.<\/p><figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"450\" src=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-21-1024x450.png\" alt=\"\" class=\"wp-image-10899\" srcset=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-21.png 1024w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-21-300x132.png 300w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-21-768x337.png 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure><p>4. Passen Sie das Layout und die Ausrichtung &uuml;ber die Symbolleiste oder die Einstellungen in der Seitenleiste an.<\/p><p>In der Seitenleiste finden Sie Optionen wie <strong>&bdquo;Innere Bl&ouml;cke verwenden die Inhaltsbreite&ldquo;<\/strong>. Aktivieren Sie diese Option, damit die inneren Bl&ouml;cke in die Breite des &uuml;bergeordneten Blocks passen und ein stimmiges Design entsteht.<\/p><h3 class=\"wp-block-heading\"><strong>So f&uuml;gen Sie &Uuml;berschriften und Text hinzu<\/strong><\/h3><p>Mit Absatz- und &Uuml;berschriftenbl&ouml;cken k&ouml;nnen Sie Beitr&auml;ge oder Seiten um Text erg&auml;nzen.<\/p><p>Um einen Absatz hinzuzuf&uuml;gen, beginnen Sie direkt im Gutenberg-Editor zu tippen. Alternativ k&ouml;nnen Sie den Block-Inserter verwenden und <strong>&bdquo;Absatz&ldquo;<\/strong> ausw&auml;hlen.<\/p><figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"421\" src=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-8-1024x421.png\" alt=\"\" class=\"wp-image-10870\" srcset=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-8.png 1024w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-8-300x123.png 300w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-8-768x316.png 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure><p>Dieser Block verf&uuml;gt &uuml;ber eine Symbolleiste mit grundlegenden Optionen wie Textausrichtung, Fettschrift, Kursivschrift und dem Hinzuf&uuml;gen von Links. Sie k&ouml;nnen sogar zus&auml;tzliche Elemente wie Fu&szlig;noten, Hervorhebungen, Inline-Bilder sowie tief- und hochgestellten Text einf&uuml;gen. &Uuml;ber die Einstellungen in der Seitenleiste k&ouml;nnen Sie Textfarbe, Typografie und Abmessungen f&uuml;r ein professionelles Erscheinungsbild anpassen.<\/p><p>&Uuml;berschriftenbl&ouml;cke helfen dabei, Ihre Inhalte zu strukturieren, damit Leser und Suchmaschinen dem Aufbau leichter folgen k&ouml;nnen. Um einen solchen Block hinzuzuf&uuml;gen, verwenden Sie eine der Methoden zum Hinzuf&uuml;gen von Bl&ouml;cken und w&auml;hlen Sie <strong>&bdquo;&Uuml;berschrift&ldquo;<\/strong> aus. W&auml;hlen Sie anschlie&szlig;end in der Symbolleiste die &Uuml;berschriftenebene (H1 bis H6).<\/p><figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"700\" height=\"452\" src=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-6.png\" alt=\"\" class=\"wp-image-10889\" srcset=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-6.png 700w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-6-300x194.png 300w\" sizes=\"(max-width: 700px) 100vw, 700px\" \/><\/figure><p>Wie beim Absatzblock k&ouml;nnen Sie auch beim &Uuml;berschriftenblock Ausrichtung, Breite und weitere Attribute &uuml;ber die Symbolleiste oder die Einstellungen in der Seitenleiste anpassen.<\/p><h3 class=\"wp-block-heading\"><strong>So f&uuml;gen Sie Bilder und Medien hinzu<\/strong><\/h3><p>Mit dem Gutenberg-Editor k&ouml;nnen Sie Ihren Beitr&auml;gen und Seiten ganz einfach verschiedene Medientypen hinzuf&uuml;gen, etwa Bilder, Audio, Videos und Dateien. Au&szlig;erdem stehen einige dynamische Bl&ouml;cke zur Verf&uuml;gung, darunter:<\/p><ul class=\"wp-block-list\">\n<li><strong>Medien &amp; Text.<\/strong> Kombiniert Medien und Text nebeneinander f&uuml;r ein besseres Storytelling.<\/li>\n\n\n\n<li><strong>Bildergalerie.<\/strong> Zeigt mehrere Bilder in einem Bereich an, ideal f&uuml;r Portfolios und Fotografie-Websites.<\/li>\n\n\n\n<li><strong>Titelbild.<\/strong> F&uuml;gt Bildern oder Videos Text&uuml;berlagerungen hinzu, ideal f&uuml;r auff&auml;llige Header oder Hervorhebungen.<\/li>\n<\/ul><figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"439\" height=\"570\" src=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-1.png\" alt=\"\" class=\"wp-image-10867\" srcset=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-1.png 439w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-1-231x300.png 231w\" sizes=\"(max-width: 439px) 100vw, 439px\" \/><\/figure><p>Um diese Bl&ouml;cke zu verwenden, w&auml;hlen Sie einen aus der Blockbibliothek aus und laden Sie Ihre Medien hoch oder w&auml;hlen Sie Dateien aus der Mediathek aus. Alternativ k&ouml;nnen Sie URLs hinzuf&uuml;gen, um Dateien wie Audio oder Bilder einzuf&uuml;gen. Bei Bild- und Galerie-Bl&ouml;cken k&ouml;nnen Sie mehrere Dateien gleichzeitig per Drag-and-drop hinzuf&uuml;gen, um Zeit zu sparen.<\/p><figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"439\" src=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-12-1024x439.png\" alt=\"\" class=\"wp-image-10877\" srcset=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-12.png 1024w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-12-300x128.png 300w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-12-768x329.png 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure><p>Jeder Block hat eigene Einstellungen. Der <strong>Bild<\/strong>-Block erm&ouml;glicht es Ihnen zum Beispiel, Ecken, Rahmen und Radius anzupassen, w&auml;hrend der <strong>Medien-&amp;-Text<\/strong>-Block Optionen f&uuml;r Ausrichtung, Stapelung auf Mobilger&auml;ten, Farben und Typografie bietet.<\/p><figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"477\" src=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-17-1024x477.png\" alt=\"\" class=\"wp-image-10897\" srcset=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-17.png 1024w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-17-300x140.png 300w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-17-768x358.png 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure><p>Sie brauchen mehr visuelle Inhalte? &Ouml;ffnen Sie den Block-Inserter und klicken Sie auf <strong>Medien<\/strong> &rarr; <a href=\"https:\/\/openverse.org\/\" target=\"_blank\" rel=\"noopener\">Openverse<\/a>, um die Sammlung frei lizenzierter Bilder der Plattform zu durchsuchen.<\/p><figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"712\" height=\"768\" src=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-16.png\" alt=\"\" class=\"wp-image-10888\" srcset=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-16.png 712w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-16-278x300.png 278w\" sizes=\"(max-width: 712px) 100vw, 712px\" \/><\/figure><h3 class=\"wp-block-heading\"><strong>So betten Sie Medien ein<\/strong><\/h3><p>Standardm&auml;&szlig;ig unterst&uuml;tzt der WordPress-Block-Editor verschiedene Medientypen von unterschiedlichen Diensten.<\/p><p>Hier sind einige Beispiele f&uuml;r spezielle Bl&ouml;cke zum Einbetten von Inhalten:<\/p><ul class=\"wp-block-list\">\n<li>Videos von YouTube, TikTok, Vimeo, Dailymotion und TED.<\/li>\n\n\n\n<li>Bilder von Instagram, Flickr, Imgur und Pinterest.<\/li>\n\n\n\n<li>Beitr&auml;ge von Facebook, X, Bluesky und Reddit.<\/li>\n\n\n\n<li>Audiodateien von Spotify, SoundCloud und Mixcloud.<\/li>\n\n\n\n<li>Dokumente von Scribd und Issuu.<\/li>\n\n\n\n<li>Umfragen und Befragungen von Crowdsignal.<\/li>\n<\/ul><p>So betten Sie Medien im Gutenberg-Editor ein:<\/p><ul class=\"wp-block-list\">\n<li>1. &Ouml;ffnen Sie den Block-Inserter und scrollen Sie nach unten zum Abschnitt <strong>Einbettungen<\/strong>.<\/li>\n\n\n\n<li>2. W&auml;hlen Sie Ihre Medienquelle aus.<\/li>\n\n\n\n<li>3. F&uuml;gen Sie die Medien-URL ein und w&auml;hlen Sie Einbetten aus.<\/li>\n\n\n\n<li>4. Die Seite oder der Beitrag zeigt nun den eingebetteten Inhalt an.<\/li>\n<\/ul><figure class=\"wp-block-image size-full is-resized\"><img decoding=\"async\" width=\"513\" height=\"232\" src=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-27.png\" alt=\"\" class=\"wp-image-10912\" style=\"width:840px;height:auto\" srcset=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-27.png 513w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-27-300x136.png 300w\" sizes=\"(max-width: 513px) 100vw, 513px\" \/><\/figure><h3 class=\"wp-block-heading\"><strong>So erstellen Sie Muster<\/strong><\/h3><p>Muster, fr&uuml;her als wiederverwendbare Bl&ouml;cke bezeichnet, sind praktische Inhaltsbausteine, die Sie auf Ihrer gesamten Website einsetzen k&ouml;nnen, um Zeit zu sparen und ein einheitliches Design &uuml;ber Ihre Seiten und Beitr&auml;ge hinweg beizubehalten.<\/p><p>Es gibt zwei Arten von Mustern:<\/p><ul class=\"wp-block-list\">\n<li><strong>Synchronisierte Muster.<\/strong> Das sind wiederverwendbare Inhaltsbl&ouml;cke, die auf Ihrer gesamten Website miteinander verkn&uuml;pft sind. Alle &Auml;nderungen, die Sie an einem synchronisierten Muster vornehmen, werden automatisch &uuml;berall aktualisiert, wo das Muster verwendet wird &ndash; ideal f&uuml;r konsistente Elemente wie Banner, Call-to-Action-Bereiche oder Header.<\/li>\n\n\n\n<li><strong>Nicht synchronisierte Muster.<\/strong> Diese Muster funktionieren als eigenst&auml;ndige Kopien. Wenn Sie ein nicht synchronisiertes Muster in einen Beitrag oder eine Seite einf&uuml;gen, hat das keine Auswirkungen auf andere Instanzen. Das ist n&uuml;tzlich, wenn Sie ein Design wiederverwenden, den Inhalt aber f&uuml;r bestimmte Seiten anpassen m&ouml;chten.<\/li>\n<\/ul><p>So erstellen Sie eines:<\/p><ol class=\"wp-block-list\">\n<li>Klicken Sie auf <strong>Dokument&uuml;bersicht<\/strong> &rarr; <strong>Listenansicht<\/strong>. Halten Sie die Umschalttaste gedr&uuml;ckt und w&auml;hlen Sie die Abschnitte aus, die Sie als Muster speichern m&ouml;chten.<\/li>\n<\/ol><figure data-wp-context='{\"imageId\":\"69e255838968a\"}' data-wp-interactive=\"core\/image\" class=\"wp-block-image aligncenter size-large wp-lightbox-container\"><img decoding=\"async\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on-async--click=\"actions.showLightbox\" data-wp-on-async--load=\"callbacks.setButtonStyles\" data-wp-on-async-window--resize=\"callbacks.setButtonStyles\" src=\"\/tutorials\/wp-content\/uploads\/sites\/2\/2022\/03\/gutenberg-blocks-pattern-1024x509.png\" alt=\"Selecting blocks for a pattern in Gutenberg\n\" class=\"wp-image-119378\"><button class=\"lightbox-trigger\" type=\"button\" aria-haspopup=\"dialog\" aria-label=\"Vergr&ouml;&szlig;ern\" data-wp-init=\"callbacks.initTriggerButton\" data-wp-on-async--click=\"actions.showLightbox\" data-wp-style--right=\"state.imageButtonRight\" data-wp-style--top=\"state.imageButtonTop\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\"><\/path>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure><p><br><\/p><p>2. Klicken Sie in der Symbolleiste auf die Schaltfl&auml;che <strong>Optionen<\/strong> und w&auml;hlen Sie <strong>Muster erstellen<\/strong> aus.<\/p><ol class=\"wp-block-list\"><\/ol><figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"863\" height=\"679\" src=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-18.png\" alt=\"\" class=\"wp-image-10887\" srcset=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-18.png 863w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-18-300x236.png 300w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-18-768x604.png 768w\" sizes=\"(max-width: 863px) 100vw, 863px\" \/><\/figure><p>3. Geben Sie Ihrem Muster einen Namen und entscheiden Sie, ob es synchronisiert oder nicht synchronisiert sein soll. Klicken Sie dann auf <strong>Erstellen<\/strong>.<\/p><figure class=\"wp-block-image size-full is-resized\"><img decoding=\"async\" width=\"353\" height=\"368\" src=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-29.png\" alt=\"\" class=\"wp-image-10915\" style=\"width:499px;height:auto\" srcset=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-29.png 353w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-29-288x300.png 288w\" sizes=\"(max-width: 353px) 100vw, 353px\" \/><\/figure><p>Um das Muster zu verwenden, &ouml;ffnen Sie den Block-Inserter und gehen Sie zu <strong>Muster<\/strong> &rarr; <strong>Meine Muster<\/strong>. Sie k&ouml;nnen auch direkt im Editor einen Schr&auml;gstrich (<strong>\/<\/strong>) gefolgt vom Blocknamen eingeben.<\/p><figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"811\" height=\"474\" src=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-13.png\" alt=\"\" class=\"wp-image-10894\" srcset=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-13.png 811w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-13-300x175.png 300w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-13-768x449.png 768w\" sizes=\"(max-width: 811px) 100vw, 811px\" \/><\/figure><p>Auch das Bearbeiten eines vorhandenen Musters ist unkompliziert. Klicken Sie einfach auf das Muster und dann auf <strong>Original bearbeiten<\/strong>. Nehmen Sie die &Auml;nderungen vor und klicken Sie auf <strong>Speichern<\/strong>.<\/p><figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"434\" src=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-20-1024x434.png\" alt=\"\" class=\"wp-image-10883\" srcset=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-20.png 1024w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-20-300x127.png 300w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-20-768x326.png 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure><p>Um alle vorhandenen Muster zu verwalten, klicken Sie oben rechts im Editor auf die Schaltfl&auml;che <strong>Optionen<\/strong> und w&auml;hlen Sie <strong>Muster verwalten<\/strong> aus. Dadurch gelangen Sie zum <strong>Website-Editor<\/strong>, in dem Sie Standardmuster und benutzerdefinierte Muster bearbeiten oder gesammelt verwalten k&ouml;nnen.<\/p><figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"514\" height=\"210\" src=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-30.png\" alt=\"\" class=\"wp-image-10916\" srcset=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-30.png 514w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-30-300x123.png 300w\" sizes=\"(max-width: 514px) 100vw, 514px\" \/><\/figure><p>M&ouml;chten Sie ein Muster auf einer Seite oder in einem Beitrag verwenden, ohne andere zu beeinflussen? &Ouml;ffnen Sie das Drei-Punkte-Men&uuml; in der Werkzeugleiste des Blocks und w&auml;hlen Sie <strong>Muster l&ouml;sen<\/strong> aus. Dadurch wird der Block unabh&auml;ngig, sodass &Auml;nderungen nicht auf der gesamten Website synchronisiert werden.<\/p><p>In unserem Leitfaden zu <a href=\"https:\/\/www.hostinger.com\/tutorials\/wordpress-block-patterns\">WordPress-Blockmustern<\/a> finden Sie Tipps zur Verwendung und Anpassung von Blockmustern.<\/p><h3 class=\"wp-block-heading\"><strong>So verwenden Sie Tastaturk&uuml;rzel in Gutenberg<\/strong><\/h3><p>Tastaturk&uuml;rzel in Gutenberg sind eine hervorragende M&ouml;glichkeit, Ihren Workflow zu beschleunigen und sich auf die Erstellung von Inhalten zu konzentrieren. Mit diesen praktischen Tastenkombinationen k&ouml;nnen Sie Aufgaben im WordPress-Block-Editor ausf&uuml;hren, ohne sich durch Men&uuml;s oder Schaltfl&auml;chen klicken zu m&uuml;ssen.<\/p><p>Hier finden Sie eine Tabelle mit einigen der n&uuml;tzlichsten Tastaturk&uuml;rzel. Die vollst&auml;ndige Liste finden Sie auch, indem Sie auf das Drei-Punkte-Symbol oben rechts im Editor klicken und <strong>Tastaturk&uuml;rzel<\/strong> ausw&auml;hlen.<\/p><p>Wenn Sie macOS verwenden, ersetzen Sie <strong>Ctrl<\/strong> durch <strong>Command (&#8984;)<\/strong> und <strong>Alt<\/strong> durch <strong>Option (&#8997;)<\/strong>.<\/p><figure tabindex=\"0\" class=\"wp-block-table\"><table class=\"has-fixed-layout\"><tbody><tr><td><strong>Aktion<\/strong><\/td><td><strong>Tastaturk&uuml;rzel<\/strong><\/td><\/tr><tr><td>Alle Tastaturk&uuml;rzel anzeigen<\/td><td>Shift + Alt + H<\/td><\/tr><tr><td><strong>Globale Tastaturk&uuml;rzel<\/strong><\/td><td><\/td><\/tr><tr><td>Die Befehlspalette &ouml;ffnen<\/td><td>Ctrl + K<\/td><\/tr><tr><td>Zwischen visuellem Editor und Code-Editor wechseln<\/td><td>Ctrl + Shift + Alt + M<\/td><\/tr><tr><td>Ablenkungsfreien Modus aktivieren<\/td><td>Ctrl + Shift + \\<\/td><\/tr><tr><td>Vollbildmodus aktivieren<\/td><td>Ctrl + Shift + Alt + F<\/td><\/tr><tr><td>Die Listenansicht der Bl&ouml;cke &ouml;ffnen<\/td><td>Shift + Alt + O<\/td><\/tr><tr><td>Die Einstellungsseitenleiste anzeigen oder ausblenden<\/td><td>Ctrl + Shift + ,<\/td><\/tr><tr><td>Zum n&auml;chsten Bereich des Editors navigieren<\/td><td>Ctrl + ` oder Shift + Alt + N<\/td><\/tr><tr><td>Zum vorherigen Bereich des Editors navigieren<\/td><td>Ctrl + Shift + ` oder Shift + Alt + P<\/td><\/tr><tr><td>Zur n&auml;chstgelegenen Werkzeugleiste navigieren<\/td><td>Alt + F10<\/td><\/tr><tr><td>&Auml;nderungen speichern<\/td><td>Ctrl + S<\/td><\/tr><tr><td>Letzte &Auml;nderungen r&uuml;ckg&auml;ngig machen<\/td><td>Ctrl + Z<\/td><\/tr><tr><td>Die letzte R&uuml;ckg&auml;ngig-Aktion wiederholen<\/td><td>Ctrl + Shift + Z<\/td><\/tr><tr><td><strong>Tastaturk&uuml;rzel f&uuml;r die Auswahl<\/strong><\/td><td><\/td><\/tr><tr><td>Beim Tippen den gesamten Text ausw&auml;hlen<\/td><td>Ctrl + A<\/td><\/tr><tr><td>Auswahl aufheben<\/td><td>Escape<\/td><\/tr><tr><td><strong>Tastaturk&uuml;rzel f&uuml;r Bl&ouml;cke<\/strong><\/td><td><\/td><\/tr><tr><td>Den ausgew&auml;hlten Block duplizieren<\/td><td>Ctrl + Shift + D<\/td><\/tr><tr><td>Den ausgew&auml;hlten Block l&ouml;schen<\/td><td>Shift + Alt + Z<\/td><\/tr><tr><td>Vor dem ausgew&auml;hlten Block einen neuen Block einf&uuml;gen<\/td><td>Ctrl + Alt + T<\/td><\/tr><tr><td>Nach dem ausgew&auml;hlten Block einen neuen Block einf&uuml;gen<\/td><td>Ctrl + Alt + Y<\/td><\/tr><tr><td>Auswahl l&ouml;schen<\/td><td>Entf oder R&uuml;cktaste<\/td><\/tr><tr><td>Den ausgew&auml;hlten Block nach oben verschieben<\/td><td>Ctrl + Shift + Alt + T<\/td><\/tr><tr><td>Den ausgew&auml;hlten Block nach unten verschieben<\/td><td>Ctrl + Shift + Alt + Y<\/td><\/tr><tr><td>Den Blocktyp nach dem Hinzuf&uuml;gen eines neuen Absatzes &auml;ndern<\/td><td>\/<\/td><\/tr><tr><td><strong>Textformatierung<\/strong><\/td><td><\/td><\/tr><tr><td>Markierten Text fett formatieren<\/td><td>Ctrl + B<\/td><\/tr><tr><td>Markierten Text kursiv formatieren<\/td><td>Ctrl + I<\/td><\/tr><tr><td>Markierten Text in einen Link umwandeln<\/td><td>Ctrl + K<\/td><\/tr><tr><td>Link entfernen<\/td><td>Ctrl + Shift + K<\/td><\/tr><tr><td>Markierten Text unterstreichen<\/td><td>Ctrl + U<\/td><\/tr><tr><td>Markierten Text durchstreichen<\/td><td>Shift + Alt + D<\/td><\/tr><tr><td>Markierten Text in Inline-Code umwandeln<\/td><td>Shift + Alt + X<\/td><\/tr><tr><td>Ausgew&auml;hlte &Uuml;berschrift in einen Absatz umwandeln<\/td><td>Shift + Alt + 0<\/td><\/tr><tr><td>Ausgew&auml;hlten Absatz oder ausgew&auml;hlte &Uuml;berschrift in eine &Uuml;berschrift der Ebene eins bis sechs umwandeln<\/td><td>Shift + Alt + 1-6<\/td><\/tr><\/tbody><\/table><\/figure><h3 class=\"wp-block-heading\"><strong>So verwenden Sie die Blocklistenansicht<\/strong><\/h3><p>Die Blocklistenansicht im Gutenberg-Editor bietet Ihnen eine baumartige &Uuml;bersicht &uuml;ber alle Bl&ouml;cke in Ihrem Beitrag oder auf Ihrer Seite. Sie ist besonders n&uuml;tzlich, um in langen Dokumenten mit vielen verschachtelten Bl&ouml;cken zu navigieren.<\/p><p>Sie k&ouml;nnen die <strong>Blocklistenansicht<\/strong> &ouml;ffnen, indem Sie oben links im Editor auf das Symbol <strong>&bdquo;Dokument&uuml;bersicht&ldquo;<\/strong> (drei &uuml;bereinanderliegende Linien) klicken oder die Tastenkombination <strong>Shift + Alt + O<\/strong> verwenden. Klicken Sie dort einfach auf einen beliebigen Block in der Liste, um direkt zu seiner Position im Bearbeitungsbereich zu springen &ndash; unabh&auml;ngig davon, wie tief er verschachtelt ist.<\/p><figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"477\" src=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-17-1024x477.png\" alt=\"\" class=\"wp-image-10896\" srcset=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-17.png 1024w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-17-300x140.png 300w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-17-768x358.png 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure><p>Neben der Blocklistenansicht befindet sich die <strong>Gliederung<\/strong>, die Ihnen einen schnellen &Uuml;berblick &uuml;ber die Struktur Ihres Dokuments gibt, einschlie&szlig;lich der &Uuml;berschriften und ihrer Hierarchie. Sie ist ein hervorragendes Werkzeug, um sicherzustellen, dass Ihre Inhalte logisch aufgebaut sind und &Uuml;berschriften korrekt verwendet werden &ndash; ideal f&uuml;r Autorinnen, Autoren und Content-Ersteller.<\/p><figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"571\" src=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-23-1024x571.png\" alt=\"\" class=\"wp-image-10893\" srcset=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-23.png 1024w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-23-300x167.png 300w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-23-768x428.png 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure><h3 class=\"wp-block-heading\"><strong>So passen Sie Bl&ouml;cke mit Full-Site Editing an<\/strong><\/h3><p>Wir haben bereits behandelt, wie Sie den Block-Editor f&uuml;r einzelne Seiten und Beitr&auml;ge verwenden. Gutenberg verf&uuml;gt au&szlig;erdem &uuml;ber den Website-Editor, mit dem Sie Bl&ouml;cke auf Ihrer gesamten Website ganz einfach anpassen k&ouml;nnen, um ein einheitliches Erscheinungsbild zu erzielen.<\/p><figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"513\" height=\"210\" src=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-31.png\" alt=\"\" class=\"wp-image-10917\" srcset=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-31.png 513w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-31-300x123.png 300w\" sizes=\"(max-width: 513px) 100vw, 513px\" \/><\/figure><p>Um auf den Gutenberg-Website-Editor zuzugreifen, gehen Sie in Ihrem WordPress-Dashboard zu <strong>Design &rarr; Editor<\/strong>. Darin k&ouml;nnen Sie verschiedene Bereiche Ihrer Website anpassen:<\/p><ul class=\"wp-block-list\">\n<li><strong>Navigation.<\/strong> Aktualisieren Sie Men&uuml;s mit Elementen wie benutzerdefinierten Links und Website-Logos.<\/li>\n\n\n\n<li><strong>Stile.<\/strong> W&auml;hlen Sie eine Stilkombination aus Ihrem Theme und passen Sie Farben, Typografie und Layouts f&uuml;r Ihre gesamte Website an.<\/li>\n\n\n\n<li><strong>Seiten.<\/strong> Bearbeiten Sie Seiteninhalte direkt im Website-Editor &ndash; ohne die Oberfl&auml;che wechseln zu m&uuml;ssen.<\/li>\n\n\n\n<li><strong>Templates.<\/strong> Erstellen Sie Layouts f&uuml;r bestimmte Seiten, etwa f&uuml;r die Startseite Ihres Blogs oder einzelne Beitr&auml;ge. Einige Themes bieten m&ouml;glicherweise zus&auml;tzliche Layout-Optionen.<\/li>\n\n\n\n<li><strong>Patterns.<\/strong> Verwalten Sie synchronisierte Patterns f&uuml;r konsistente Designelemente auf Ihrer gesamten Website.<\/li>\n<\/ul><p>F&uuml;r ein vollst&auml;ndiges Bearbeitungserlebnis k&ouml;nnen Sie das Template im Editor in der Vorschau anzeigen, w&auml;hrend Sie am Inhalt Ihrer Seite oder Ihres Beitrags arbeiten. &Ouml;ffnen Sie den Tab <strong>&bdquo;Beitrag&ldquo;<\/strong> in der rechten Seitenleiste und w&auml;hlen Sie <strong>Template<\/strong> &rarr; <strong>Template anzeigen<\/strong>. So k&ouml;nnen Sie sehen, wie sich Ihr Inhalt in das gesamte Seitenlayout einf&uuml;gt.<\/p><figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"452\" src=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-19-1024x452.png\" alt=\"\" class=\"wp-image-10898\" srcset=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-19.png 1024w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-19-300x132.png 300w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-19-768x339.png 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure><p>Beachten Sie, dass nur Benutzerinnen und Benutzer mit einem WordPress-Block-Theme Bl&ouml;cke im Full-Site-Editor anpassen k&ouml;nnen. Wenn Sie diese Funktion nutzen m&ouml;chten, sollten Sie zu einem Block-Theme wechseln, zum Beispiel:<\/p><ul class=\"wp-block-list\">\n<li>Twenty Twenty-Four. Ein Standard-WordPress-Theme mit einem klaren und modernen Layout.<\/li>\n\n\n\n<li><a href=\"https:\/\/wordpress.org\/themes\/ona\/\" target=\"_blank\" rel=\"noopener\">Ona<\/a>. Wird mit <a href=\"https:\/\/www.hostinger.com\/tutorials\/how-to-create-wordpress-child-theme\">Child-Themes<\/a> f&uuml;r verschiedene Website-Nischen geliefert.<\/li>\n\n\n\n<li><a href=\"https:\/\/wordpress.org\/themes\/neve-fse\/\" target=\"_blank\" rel=\"noopener\">Neve FSE<\/a>. Die Full-Site-Editing-Version eines beliebten WordPress-Themes, geeignet f&uuml;r alle Arten von Websites.<\/li>\n\n\n\n<li><a href=\"https:\/\/wordpress.org\/themes\/tove\/\" target=\"_blank\" rel=\"noopener\">Tove<\/a>. Enth&auml;lt mehr als 40 Block-Patterns f&uuml;r eine schnellere Anpassung.<\/li>\n\n\n\n<li><a href=\"https:\/\/wordpress.org\/themes\/bricksy\/\" target=\"_blank\" rel=\"noopener\">Bricksy<\/a>. Wird ebenfalls mit vorgefertigten Block-Patterns sowie WooCommerce-Unterst&uuml;tzung geliefert.<\/li>\n<\/ul><h3 class=\"wp-block-heading\"><strong>So verwenden Sie die Befehlspalette<\/strong><\/h3><p>Die <a href=\"https:\/\/www.hostinger.com\/tutorials\/wordpress-command-palette\">Befehlspalette<\/a> ist ein Schnellzugriffswerkzeug, mit dem Sie Aktionen ausf&uuml;hren oder innerhalb des Editors navigieren k&ouml;nnen &ndash; &uuml;ber eine einfache Suchleiste, ohne sich m&uuml;hsam durch Men&uuml;s klicken zu m&uuml;ssen.<\/p><p>Diese Funktion ist im Gutenberg-Block-Editor &uuml;ber die Tastenkombination <strong>Strg + K<\/strong> (oder <strong>Cmd + K<\/strong> auf dem Mac) oder durch Klicken auf die Leiste oben in der Benutzeroberfl&auml;che verf&uuml;gbar.<\/p><figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"235\" src=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-3-1024x235.png\" alt=\"\" class=\"wp-image-10869\" srcset=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-3.png 1024w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-3-300x69.png 300w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-3-768x176.png 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure><p>Wenn Sie darauf klicken, sehen Sie eine Suchleiste und eine kurze Liste h&auml;ufiger Aufgaben wie <strong>Duplicate<\/strong>, <strong>Delete<\/strong> und <strong>Add after<\/strong>. Geben Sie einfach einen Buchstaben oder ein Schl&uuml;sselwort ein, das zur gesuchten Aufgabe passt, um relevante Optionen anzuzeigen.<\/p><figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"658\" height=\"722\" src=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-9.png\" alt=\"\" class=\"wp-image-10879\" srcset=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-9.png 658w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-9-273x300.png 273w\" sizes=\"(max-width: 658px) 100vw, 658px\" \/><\/figure><p>Hier sind einige Anwendungsf&auml;lle, die Ihren Workflow beschleunigen k&ouml;nnen:<\/p><ul class=\"wp-block-list\">\n<li>Zu einem bestimmten Beitrag oder einer bestimmten Seite springen, indem Sie einfach den Titel eingeben.<\/li>\n\n\n\n<li>Eine neue Seite oder einen neuen Beitrag hinzuf&uuml;gen.<\/li>\n\n\n\n<li>Den Vollbildmodus beenden, um die WordPress-Admin-Seitenleiste anzuzeigen.<\/li>\n\n\n\n<li>In den ablenkungsfreien Modus wechseln.<\/li>\n\n\n\n<li>Ihre Arbeit in einem neuen Tab in der Vorschau anzeigen.<\/li>\n<\/ul><h3 class=\"wp-block-heading\"><strong>So deaktivieren Sie den WordPress-Block-Editor<\/strong><\/h3><p>Wenn Ihnen die Umstellung auf den Gutenberg-Editor schwerf&auml;llt, k&ouml;nnen Sie ihn in WordPress mit einem Plugin oder durch Bearbeiten der Datei <a href=\"https:\/\/www.hostinger.com\/tutorials\/functions-php-wordpress\">functions.php<\/a> deaktivieren.<\/p><p>Installieren Sie das Plugin <a href=\"https:\/\/wordpress.org\/plugins\/classic-editor\/\" target=\"_blank\" rel=\"noopener\">Classic Editor<\/a>, um Gutenberg nach der Aktivierung vollst&auml;ndig zu deaktivieren. Wenn Sie mehr Kontrolle m&ouml;chten, verwenden Sie das Plugin <a href=\"https:\/\/wordpress.org\/plugins\/disable-gutenberg\/\" target=\"_blank\" rel=\"noopener\">Disable Gutenberg<\/a>. Das Plugin deaktiviert Gutenberg auf der gesamten Website. Sie k&ouml;nnen die Plugin-Einstellungen jedoch so anpassen, dass es nur f&uuml;r bestimmte Rollen, Beitragstypen oder Vorlagen gilt.<\/p><p>Alternativ f&uuml;gen Sie Ihrer Datei <strong>functions.php<\/strong> einen Code-Snippet hinzu &ndash; mit dem WordPress Theme File Editor, einem File Manager oder per File Transfer Protocol (FTP).<\/p><p>So geht es mit dem File Manager von Hostinger im hPanel-Dashboard:<\/p><ol class=\"wp-block-list\">\n<li>&Ouml;ffnen Sie den <strong>File Manager<\/strong> in hPanel und navigieren Sie zu <strong>public_html &rarr; wp-content &rarr; themes<\/strong>.<\/li>\n\n\n\n<li>&Ouml;ffnen Sie den Ordner Ihres aktiven Themes und doppelklicken Sie auf die Datei <strong>functions.php<\/strong>, um sie zu &ouml;ffnen.<\/li>\n\n\n\n<li>F&uuml;gen Sie den folgenden Code vor der letzten Zeile ein:<\/li>\n<\/ol><p>add_filter(&sbquo;use_block_editor_for_post&lsquo;, &sbquo;__return_false&lsquo;);<\/p><p>4. Speichern und schlie&szlig;en Sie die Datei und laden Sie dann Ihre WordPress-Website neu.<\/p><p>Wenn Ihnen das Bearbeiten von Code zu heikel erscheint, probieren Sie stattdessen das Plugin <a href=\"https:\/\/wordpress.org\/plugins\/code-snippets\/\" target=\"_blank\" rel=\"noopener\">Code Snippets<\/a> aus:<\/p><ol class=\"wp-block-list\">\n<li>Gehen Sie nach der Installation und Aktivierung des Plugins im Dashboard zu <strong>Snippets<\/strong> &rarr; <strong>Add New<\/strong>.<\/li>\n\n\n\n<li>Benennen Sie den Snippet und f&uuml;gen Sie den obigen Code dann in den Tab <strong>Functions PHP<\/strong> ein. W&auml;hlen Sie die Option <strong>Only run in administration area<\/strong>.<\/li>\n<\/ol><figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"420\" src=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-10-1024x420.png\" alt=\"\" class=\"wp-image-10880\" srcset=\"https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-10.png 1024w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-10-300x123.png 300w, https:\/\/www.hostinger.com\/de\/tutorials\/wp-content\/uploads\/sites\/29\/2026\/04\/image-10-768x315.png 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure><p>3. Klicken Sie auf <strong>Save Changes<\/strong> and <strong>Activate<\/strong>.<\/p><p>Beachten Sie, dass das Deaktivieren von Gutenberg nur eine vor&uuml;bergehende L&ouml;sung ist, da es der Standardeditor von WordPress ist. Da Gutenberg kontinuierlich um neue Funktionen erweitert wird, hilft Ihnen der Abschied vom klassischen Editor dabei, die M&ouml;glichkeiten von WordPress voll auszusch&ouml;pfen.<\/p><p>\n\n\n<div class=\"protip\">\n                    <h4 class=\"title\">M&ouml;chten Sie Ihr WordPress-Erlebnis auf das n&auml;chste Level bringen?<\/h4>\n                    <p> Entdecken Sie die besten mit Gutenberg kompatiblen WordPress-Plugins, um Ihre Website zu erweitern.<\/p>\n                <\/div>\n\n\n\n<\/p><h4 class=\"wp-block-heading\"><strong>Fazit<\/strong><\/h4><p>Der Gutenberg-Block-Editor hat die Art und Weise verbessert, wie Sie Websites mit WordPress erstellen und gestalten k&ouml;nnen. Mit seinen flexiblen Bl&ouml;cken f&uuml;r verschiedene Website-Elemente erhalten Sie eine einfache und zugleich flexible M&ouml;glichkeit, Beitr&auml;ge und Seiten nach Ihren Vorstellungen zu erstellen.<\/p><p>Indem Gutenberg die Einschr&auml;nkungen des klassischen Editors beseitigt, macht die Drag-and-drop-Oberfl&auml;che die Anpassung f&uuml;r Nutzer aller Erfahrungsstufen einfach. Funktionen wie synchronisierte Muster sorgen f&uuml;r ein einheitliches Design, w&auml;hrend Sie mit dem erweiterten Website-Editor Themes direkt anpassen k&ouml;nnen, ohne zus&auml;tzliche Plugins zu ben&ouml;tigen.<\/p><p>Wir hoffen, dass Ihnen dieser Leitfaden geholfen hat zu verstehen, wie Gutenberg funktioniert und wie Gutenberg Ihr WordPress-Erlebnis verbessern kann. Weitere Tipps und Tricks zu Gutenberg finden Sie in unserem Leitfaden zum <a href=\"https:\/\/www.hostinger.com\/tutorials\/how-to-create-a-website-with-gutenberg\">Erstellen einer Website mit Gutenberg<\/a>.<\/p><h2 class=\"wp-block-heading\" id=\"h-wordpress-gutenberg-faq\"><strong>WordPress Gutenberg (FAQ)<\/strong><\/h2><h3 class=\"wp-block-heading\"><strong>Ist Gutenberg kostenlos?<\/strong><\/h3><p>Ja. Gutenberg ist im WordPress-Core integriert, daher ist es kostenlos und mit WordPress 5.0 und neuer bereits vorinstalliert.<\/p><h3 class=\"wp-block-heading\"><strong>Ist Gutenberg besser als Elementor?<\/strong><\/h3><p>Das h&auml;ngt von Ihren Anforderungen und Vorlieben ab. Gutenberg bietet mit einem kostenlosen, schlanken Block-Editor Einfachheit und Performance f&uuml;r einfache bis mittlere Anpassungen. Elementor ist eine kostenpflichtige L&ouml;sung, die sich besonders f&uuml;r anspruchsvolles Design eignet und eine Drag-and-drop-Oberfl&auml;che mit Widgets und Vorlagen f&uuml;r pr&auml;zise Layouts bietet. Kurz gesagt: W&auml;hlen Sie Gutenberg f&uuml;r Geschwindigkeit und einfache Bedienung oder Elementor f&uuml;r kreative Flexibilit&auml;t und detaillierte Kontrolle &uuml;ber das Design &ndash; behalten Sie dabei jedoch die Abonnementkosten im Blick.<\/p><h3 class=\"wp-block-heading\"><strong>Ist Gutenberg gut f&uuml;r SEO?<\/strong><\/h3><p>Ja, Gutenberg ist hervorragend f&uuml;r SEO geeignet. Es erzeugt sauberes, strukturiertes HTML, das Suchmaschinen dabei hilft, Ihre Inhalte zu verstehen. Der Block-Editor erleichtert au&szlig;erdem die Optimierung von Bildern und &Uuml;berschriften, was f&uuml;r gutes SEO entscheidend ist. Au&szlig;erdem funktioniert Gutenberg perfekt mit <a href=\"https:\/\/www.hostinger.com\/tutorials\/best-seo-plugins-wordpress\">beliebten SEO-Plugins<\/a> wie <strong>Yoast SEO<\/strong>.<\/p><h3 class=\"wp-block-heading\"><strong>Was ist der Unterschied zwischen Bl&ouml;cken und Widgets?<\/strong><\/h3><p>In WordPress werden Bl&ouml;cke verwendet, um Beitr&auml;ge und Seiten im Editor zu gestalten, w&auml;hrend Widgets Funktionen zu Bereichen wie Seitenleisten und Footern hinzuf&uuml;gen. Mit WordPress 5.8 f&uuml;hrte die Plattform den blockbasierten Widget-Editor ein, sodass Nutzer Widgets mit Bl&ouml;cken verwalten k&ouml;nnen &ndash; &auml;hnlich wie der Gutenberg-Editor bei Beitr&auml;gen und<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Wenn Sie WordPress noch nicht kennen, sollten Sie sich zuerst mit Gutenberg, dem Block-Editor, vertraut machen, um die Plattform effektiver zu verwalten. Er wurde als Ersatz f&uuml;r den klassischen Editor eingef&uuml;hrt und ist inzwischen ein zentraler Bestandteil der Website-Erstellung im Content-Management-System. WordPress Gutenberg verwendet ein blockbasiertes Designsystem und ist dadurch f&uuml;r alle Erfahrungsstufen deutlich benutzerfreundlicher. [&#8230;]<\/p>\n<p><a class=\"btn btn-secondary understrap-read-more-link\" href=\"\/de\/tutorials\/wordpress-gutenberg-editor\">Read More&#8230;<\/a><\/p>\n","protected":false},"author":634,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"rank_math_title":"WordPress Gutenberg Editor einfach erkl\u00e4rt und nutzen","rank_math_description":"Den WordPress Gutenberg Editor effektiv nutzen. Lernen Sie Bl\u00f6cke verschieben, Muster erstellen und die Command Palette einsetzen.","rank_math_focus_keyword":"","footnotes":""},"categories":[20],"tags":[],"class_list":["post-10865","post","type-post","status-publish","format-standard","hentry","category-wordpress"],"hreflangs":[],"_links":{"self":[{"href":"https:\/\/www.hostinger.com\/de\/tutorials\/wp-json\/wp\/v2\/posts\/10865","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.hostinger.com\/de\/tutorials\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hostinger.com\/de\/tutorials\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hostinger.com\/de\/tutorials\/wp-json\/wp\/v2\/users\/634"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hostinger.com\/de\/tutorials\/wp-json\/wp\/v2\/comments?post=10865"}],"version-history":[{"count":15,"href":"https:\/\/www.hostinger.com\/de\/tutorials\/wp-json\/wp\/v2\/posts\/10865\/revisions"}],"predecessor-version":[{"id":10924,"href":"https:\/\/www.hostinger.com\/de\/tutorials\/wp-json\/wp\/v2\/posts\/10865\/revisions\/10924"}],"wp:attachment":[{"href":"https:\/\/www.hostinger.com\/de\/tutorials\/wp-json\/wp\/v2\/media?parent=10865"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hostinger.com\/de\/tutorials\/wp-json\/wp\/v2\/categories?post=10865"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hostinger.com\/de\/tutorials\/wp-json\/wp\/v2\/tags?post=10865"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}