So fügen Sie Blöcke zum WordPress-Theme hinzu

WordPress ist ein Content-Management-System (CMS), mit dem Sie eine Website oder einen Blog von Grund auf neu erstellen oder eine vorhandene Website verbessern können. WordPress ist eine kostenlose Open-Source-Software, die unter der GPL veröffentlicht wird.
Das Hinzufügen von Blöcken zu WordPress ist ein zweistufiger Prozess. Zuerst müssen Sie ein Plugin installieren, das Blöcke auf Ihrer WordPress-Seite aktiviert. Zweitens müssen Sie Blöcke zu Ihrem WordPress-Theme hinzufügen.
Es sind viele Plugins verfügbar, die Blöcke in WordPress aktivieren. Wir empfehlen die Verwendung des Gutenberg-Plugins. Sobald Sie das Plugin installiert haben, können Sie Blöcke zu Ihrem WordPress-Theme hinzufügen, indem Sie zur Registerkarte Aussehen > Blöcke gehen.
Auf der Registerkarte Blöcke sehen Sie eine Liste der verfügbaren Blöcke. Um einen Block zu Ihrem WordPress-Theme hinzuzufügen, klicken Sie einfach auf den Block und er wird Ihrem Inhaltsbereich hinzugefügt.
Sie können Ihrem WordPress-Design auch Blöcke hinzufügen, indem Sie sie per Drag & Drop in Ihren Inhaltsbereich ziehen. Klicken Sie dazu zuerst auf den Block, den Sie hinzufügen möchten, und ziehen Sie ihn dann in Ihren Inhaltsbereich.
Nachdem Sie Ihrem WordPress-Theme einen Block hinzugefügt haben, können Sie ihn anpassen, indem Sie auf den Block und dann auf die Schaltfläche Anpassen klicken. Dadurch wird der Blockeditor geöffnet, in dem Sie die Einstellungen des Blocks ändern können.
Wenn Sie mit der Anpassung Ihres Blocks fertig sind, klicken Sie auf die Schaltfläche „Veröffentlichen“, um Ihre Änderungen zu speichern.

In dieser Lektion lernen Sie als ersten Schritt in einer Reihe von Übungen, wie Sie Blockdesigns erstellen, die auch als vollständige Websitebearbeitungsdesigns bezeichnet werden. Zu den behandelten Themen gehören die Mindestanforderungen an Dateien, die Themeneinrichtung und die Anforderungen an die Dateistruktur. In dieser Lektion lernen Sie, wie Sie ein leeres WordPress-Design mit Unterstützung für die vollständige Seitenbearbeitung erstellen. Ihr Ordner wird nach Themennamen organisiert: Wenn Ihr Thema FSE ist, steht die Abkürzung für Ganzseitenbearbeitung. Das Design sollte eine style.css-Datei im Stammordner haben. In klassischen Designs ähnelt die Datei /templates/index.html der Datei index.html. Die Blockvorlagen sind Ihre primären HTML-Dateien und sie folgen der WordPress-Vorlagenhierarchie auf die gleiche Weise wie PHP-Dateien in klassischen Themen.

Ein Theme benötigt keine functions.php, um richtig zu funktionieren. Wenn Sie Enqueues benötigen, können Sie benutzerdefinierte Blockstile, benutzerdefinierte Bildgrößen oder Hook-Typen verwenden, die keine Blockgrößen unterstützen. Es gibt keine Anforderungen für die Installation von Widget-Bereichen oder Menüs oder das Hinzufügen von Designunterstützung, solange das benutzerdefinierte Logo, der Header oder die Farbe bereitgestellt werden. Das body-Element enthält Vorlagen.

Blöcke sind WordPress-Themen mit Vorlagen, die vollständig dem Beitragstyp (Seite, Beitrag, …) gewidmet sind, sodass der Blockeditor verwendet werden kann, um alle Aspekte der Website zu bearbeiten, von Kopfzeilen über Fußzeilen bis hin zu Seitenleisten.

Wie füge ich einen benutzerdefinierten Block in WordPress hinzu?

Sie können diesen Block in jedem gewünschten Beitrag oder jeder Seite verwenden, indem Sie ihn bearbeiten. Sie können nach Ihrem Block suchen, indem Sie seinen Namen oder Schlüsselwörter in das Suchfeld Neuen Block hinzufügen eingeben. Im Inhaltsbereich sehen Sie die Blockfelder, die Sie für diesen benutzerdefinierten Block erstellt haben, sowie die Blockfelder, die Sie für andere benutzerdefinierte Blöcke erstellt haben .

Indem Sie Inhalts- und Layoutelemente zu WordPress hinzufügen, können Sie ganz einfach Beiträge und Seiten erstellen. Blöcke sind standardmäßig in WordPress integriert. Es ist jedoch möglich, einen eigenen benutzerdefinierten Block zu erstellen, um etwas Bestimmtes zu erreichen. Wie wir Ihnen in diesem Tutorial zeigen werden, können Sie einen vollständig benutzerdefinierten Block erstellen. Zu Beginn müssen Sie zunächst drei Felder in Ihrem Testimonial-Block ausfüllen. Das erste Feld kann durch Klicken auf die Schaltfläche Feld hinzufügen ausgefüllt werden. Schritt 2: Nachdem Sie eine Blockvorlage erstellt haben, können Sie festlegen, wie die Daten angezeigt werden.

Der dritte Schritt besteht darin, die Registerkarte CSS auszuwählen, um Ihr Blockausgabe-Markup zu gestalten. Benutzerdefinierte Blockvorlagen können manuell hochgeladen werden. Wenn Sie mit Ihren benutzerdefinierten Blockfeldern über PHP interagieren müssen, ist dies der richtige Weg. Höchstwahrscheinlich müssen Sie die Editor-Vorlage direkt in Ihr Design hochladen. Ihr benutzerdefinierter Block kann vollständig angezeigt werden. Bevor Sie Ihr HTML/CSS in der Vorschau anzeigen können, müssen Sie einige Testdaten bereitstellen. Installieren Sie einen benutzerdefinierten Gutenberg-Block auf Ihrer WordPress-Seite.

Wenn Sie auf die Schaltfläche „ Neuen Block hinzufügen “ klicken, wird ein Suchfeld für Ihren Block angezeigt, und Sie können seinen Namen oder Schlüsselwörter eingeben. Sie können eine Vorschau Ihres benutzerdefinierten Blocks anzeigen, indem Sie ihn speichern und Ihren Beitrag bearbeiten. Auf unserer Testseite können Sie sehen, wie der Testimonials-Block aussieht.

Warum kann ich einen Block in WordPress nicht bearbeiten?

Es besteht eine sehr hohe Wahrscheinlichkeit, dass Sie einen Konflikt mit einem Ihrer installierten Plugins als eine der Ursachen für Probleme mit dem WordPress-Blockeditor haben. Daher wäre die erste und einfachste Lösung für Sie, alle Plugins von Ihrer WordPress-Website zu entfernen.

Wie erhalte ich Blöcke in WordPress?

Auf diese Frage gibt es keine allgemeingültige Antwort, da der beste Weg, um Blöcke in WordPress zu erhalten, von den spezifischen Anforderungen Ihrer Website abhängt. Einige allgemeine Tipps, wie Sie Blöcke in WordPress erhalten, umfassen jedoch die Installation eines Plugins wie Advanced Custom Fields oder die Verwendung des Block-Editors in Ihrem Design.

Blöcke sind WordPress-Komponenten, die zum Erstellen und Bearbeiten von Elementen in einem Beitrag oder einer Seite verwendet werden. Blocktypen stehen zum Hinzufügen von Text, Mediendateien und Layoutelementen zur Verfügung. Um Ihnen den Einstieg zu erleichtern, gehen wir alles durch, was Sie über WordPress-Blöcke und die Verwendung des neuen Blockeditors wissen müssen. Fügen Sie der Blocksammlung 10 Plugins hinzu, um ihre Funktionen und Optionen weiter zu erweitern. Die Verwendung eines blockbasierten WordPress-Themes ist eine hervorragende Möglichkeit, Vorlagen anzupassen. Die neue WordPress-Version enthält über 90 Blöcke, die in sechs Kategorien unterteilt sind: Text, Medien, Design, Widgets, Design und Einbettung. In diesem Artikel sehen wir uns alle Blöcke im WordPress-Blockeditor und ihre Anpassungsoptionen an.

Wenn es um die Erstellung von Beiträgen und Seiten geht, empfiehlt WordPress die Verwendung des Gutenberg-Blockeditors. Die Themenblöcke der Website sowie das Gesamtdesign und -layout bestehen aus 23 Blöcken. Darüber hinaus steht der Blockeditor für die vollständige Bearbeitung der Website zur Verfügung, wenn ein blockbasiertes Design in WordPress 5 verwendet wird. Blöcke in WordPress können per Drag & Drop verschoben werden in einem Drag-and-Drop-Modus. Sie können jeden Block ablegen, indem Sie ihn auswählen und auf das Symbol „Ziehen“ in der Symbolleiste klicken. Verwenden Sie alternativ die Aufwärts- und Abwärtspfeile der Symbolleiste, um zu dem Block zu navigieren. Es sind mehrere Plugins verfügbar, mit denen Sie Inhaltsblöcke zur Blockbibliothek hinzufügen können.

Es verwendet den Vorlagenbibliotheksblock anstelle des Mustereinfügers, um die Vorlagen zu generieren. Das Plugin enthält zusätzlich 81 ganzseitige Vorlagen, 284 Blockmuster und 56 Wireframes. Blöcke können aktiviert oder deaktiviert werden, um Ihren Editor zu beschleunigen oder zu vereinfachen. PublishPress Blocks bietet auch Blöcke zur Lead-Generierung sowie Newsletter und Kontaktformulare. Stackable bietet eine Vielzahl von Block-, Stil- und erweiterten Einstellungen für jeden Block, mit denen Sie den Block auf vielfältige Weise anpassen können. Um komplexe Layouts auf Blogs oder Seiten zu erstellen, bietet Kadence Blocks eine Reihe von Tools. Die Ultimate Blocks-Website konzentriert sich auf Blogs und Vermarkter.

Das Kadence Blocks-Plugin für den Gutenberg-Blockeditor ist kostenlos. Mit dem Editor können Sie 15 neue Blöcke hinzufügen, darunter Google Maps und Add-to-Cart-Blöcke. Der Abschnittsblock kann standardmäßig als Standardblock für neue Seiten konfiguriert werden. Darüber hinaus enthält das Plugin Animationen und benutzerdefinierte CSS-Funktionen für Otter-Blöcke und WordPress-Blöcke. Das CoBlocks-Plugin für WordPress bietet Ihnen die Möglichkeit, attraktive Layouts und visuelle Designs zu erstellen, ohne dass zusätzliche Codierungen oder Plugins erforderlich sind. Wiederverwendbare Blöcke ermöglichen es Ihnen beispielsweise, einen vorgefertigten Block für die zukünftige Verwendung zu speichern, sodass Sie keine Seite von Grund auf neu erstellen müssen. Sie können Inhalte schnell neu anordnen, indem Sie sie mit der Drag-and-Drop-Funktion in der Blocksymbolleiste ziehen und ablegen.

Warum Sie Blöcke verwenden sollten, um Ihre WordPress-Website anzupassen

Blöcke können Ihnen helfen, Ihre Inhalte auf Ihrer Website zu organisieren und anzupassen. Da sie einfach zu verwenden sind und das Hinzufügen zusätzlicher Informationen zu Ihrer Website erheblich erleichtern, sind diese Vorlagen eine gute Wahl. Sie sind auch anpassbar, sodass Sie ihnen Inhaltselemente wie Absätze, Bilder und Widgets hinzufügen können.
Blöcke sind ein wesentlicher Bestandteil von WordPress. Blöcke sind die effektivste Methode, um Ihrer Website Struktur zu verleihen und sie anzupassen, wenn Sie Flexibilität und Anpassungsmöglichkeiten hinzufügen möchten.

WordPress-Block-Theme-Tutorial

WordPress-Blockthemen sind Themen, mit denen Sie Inhaltsblöcke erstellen können, die auf Ihrer Website wiederverwendet werden können. Sie sind eine großartige Möglichkeit, ein konsistentes Erscheinungsbild für Ihre Website zu schaffen und das Hinzufügen neuer Inhalte zu Ihrer Website zu vereinfachen. Beim Erstellen eines WordPress -Blockdesigns sind einige Dinge zu beachten. Zuerst müssen Sie eine neue WordPress-Blockdesigndatei erstellen. Sie können dies tun, indem Sie zum WordPress-Admin-Panel gehen und die Registerkarte „Darstellung“ auswählen. Klicken Sie dann auf „Editor“. Sobald Sie sich im Editor befinden, möchten Sie eine neue Datei namens „block-theme.php“ erstellen. Sie können dies tun, indem Sie auf die Schaltfläche „Neue Datei“ in der oberen linken Ecke des Editors klicken. In der Datei „block-theme.php“ müssen Sie den folgenden Code hinzufügen: /* Template Name: Block Theme */ ? > get_header(); if (have_posts()): while (have_posts()): the_post(); get_template_part( 'Vorlagenteile/Inhalt', 'Seite' ); am Ende; endif; get_footer(); ? > Dieser Code erstellt ein grundlegendes WordPress-Blockdesign. Sie können dieser Datei Ihr eigenes CSS und HTML hinzufügen, um sie an Ihre Bedürfnisse anzupassen.

Da WordPress immer beliebter wird, werden sich Blockthemen als die Zukunft der Plattform herausstellen. Wir werden in Zukunft überdenken müssen, wie wir Websites erstellen und pflegen. Blöcke stehen im Mittelpunkt von Block-Designs, die unter diesem Gesichtspunkt entworfen wurden. Darüber hinaus haben sie einen höheren Grad an Integration mit dem Gutenberg-Blockeditor als ihre gebräuchlicheren Gegenstücke. Sie werden heute im Detail untersucht, um zu sehen, wie sie sich von traditionellen Themen unterscheiden und abheben. PHP kann nicht mehr als Designelement verwendet werden, da es durch HTML und Block-Markup ersetzt wird. Templates sind Dateien mit Namen wie index.php und header.php, die normalerweise in /templates zu finden sind, einem Ordner in der Hierarchie des Themes.

Zu den wiederverwendbaren Elementen in /parts gehören Kopfzeile, Fußzeile und Seitenleiste. Verwenden Sie die Datei theme.json, um dem Blockeditor Standardeinstellungen zuzuweisen. Infolgedessen ist es möglich, dass Sie die style.html-Datei eines Themas überhaupt nicht formatieren müssen. Blockthemen sind trotz ihrer Anfänge eine vielversprechende Technologie in den frühen Entwicklungsstadien. Der neue Site-Editor (Erscheinungsbild) ist die benutzerfreundlichste Art, alles zu bearbeiten (erfordert WordPress 5.9 oder höher). Wenn ein Blockdesign aktiviert ist, ersetzt der Site-Editor den alten Customizer. Trotz der Tatsache, dass sie FSE-Funktionen verwenden, verwendet ein klassisches Thema immer noch PHP als Basis.

So erstellen Sie mithilfe von Blöcken benutzerdefinierte Layouts für Ihre Beiträge und Seiten

Blöcke sind eine einfache Ergänzung zu Ihrem Portfolio. Klicken Sie auf dem Bearbeitungsbildschirm für Beiträge oder Seiten auf die Schaltfläche Block hinzufügen und dann auf die Registerkarte Blockieren auf der Registerkarte Blocks, und Sie sind fertig. Sie können diesen Block dann speichern, indem Sie den Inhalt dafür eingeben und auf die Schaltfläche Speichern klicken.
Mit Blöcken können Sie benutzerdefinierte Layouts für Ihre Posts und Seiten erstellen, was sie extrem leistungsfähig macht. Blöcke können verwendet werden, um Inhalte in Gruppen zu organisieren, Unterabschnitte zu erstellen und Inhalte zu trennen.
Blöcke sind eine gute Wahl für jede Aufgabe, da sie sich gut als einfaches oder komplexes Inhaltslayout eignen.

WordPress-Block-Theme-Starter

Ein WordPress-Block-Theme-Starter ist eine großartige Möglichkeit, mit der Entwicklung Ihres eigenen WordPress-Themes zu beginnen. Es enthält alle notwendigen Dateien und Ordner, die Sie für den Einstieg benötigen. Außerdem bietet es einen großartigen Ausgangspunkt für die Codierung Ihres Themas.

WebREDONE, eine in Serbien ansässige Webagentur, hat ein neues Starter-Theme namens Theme Redone kostenlos veröffentlicht. Es ist ein MVC-basiertes Framework, das zum Erstellen von Websites und zum Erstellen von Gutenberg-Blöcken verwendet wird. Obwohl es mehrere Unterschiede zwischen der Art und Weise gibt, wie Code organisiert ist, und wie Laravel aufgebaut ist, ist Code ähnlich wie Laravel organisiert. Der Motor läuft auf Latte. Neue Blöcke können mit dem NPM-Paket TRB (Theme Redone Blocks) von WebREDONE in wenigen Minuten erstellt werden. Alternativ können Sie das Starter-Design installieren und Gulp 4, ESBuild oder Svelte verwenden, um Kompilierungs- und Überwachungsaufgaben für React, Svelte, Vue und Petite Vue zu erstellen. Auch wenn es vielleicht nicht immer die beste Lösung für alle ist, ist es interessant zu sehen, wie Agenturen ihre Tools weiterentwickeln, um die Blockade-Ära zu unterstützen.

Erstellen Sie ein Block-Design-Plugin

Es gibt viele Möglichkeiten, ein benutzerdefiniertes Block-Theme-Plugin zu erstellen, aber die häufigste Methode ist die Verwendung eines Plugins namens „Block-Theme-Plugin“. Mit diesem Plugin können Sie ein benutzerdefiniertes Blockdesign erstellen, das auf jeder WordPress-Site verwendet werden kann. Sie können dieses Plugin verwenden, um ein benutzerdefiniertes Blockdesign für Ihre eigene Website oder für die Website eines Kunden zu erstellen.

Mit diesem Tool können Sie Ihre eigenen Blockthemen, Kinderthemen und Variationen erstellen. Mit dieser App können Sie auch Themenvorlagen überschreiben, die nicht durch Exportieren eines Zip-Ordners oder Ersetzen von Dateien generiert werden. Darüber hinaus können Sie neue Blockthemen erstellen und andere coole Funktionen hinzufügen. Sie können das aktuelle Design klonen und neue hinzufügen. Klicken Sie einfach auf Design erstellen, um das Design zu speichern, das alle Dateien enthält. Dieses Plugin macht es einfach, Blockdesigns mit dieser Methode zu erstellen. Es ist fantastisch, dass dieses Plugin das Spiel für No-Code/Low-Code-Designer verändert. Ich würde es gerne irgendwann in Core integriert sehen, aber es in einem separaten Feature-Plugin zu haben, ist ein großartiger erster Schritt. Sehen Sie sich alle sieben Rezensionen zu Create Block Theme an.

WordPress-Blockdesign-Generator

Es steht außer Frage, dass WordPress heute eines der beliebtesten Content-Management-Systeme auf dem Markt ist. Millionen von Menschen verwenden WordPress, um ihre Websites zu erstellen und zu verwalten. Und eines der Dinge, die WordPress so beliebt machen, ist die Möglichkeit, Ihre Website einfach mit Themen und Plugins anzupassen. Eines der beliebtesten Themes für WordPress ist das Block-Theme. Blockdesigns wurden entwickelt, um Ihnen die Möglichkeit zu geben, benutzerdefinierte Seiten und Beiträge mit einer Drag-and-Drop-Oberfläche einfach zu erstellen. Und eines der besten Dinge an Blockthemen ist, dass sie sehr einfach zu bedienen sind. Wenn Sie nach einem WordPress-Theme suchen, das einfach zu verwenden und anzupassen ist, sollten Sie sich unbedingt den Block-Theme-Generator ansehen . Mit dem Blockdesign-Generator können Sie ganz einfach benutzerdefinierte Seiten und Beiträge mit einer Drag-and-Drop-Oberfläche erstellen. Außerdem ist der Block-Theme-Generator auch sehr einfach zu bedienen.

So verwenden Sie Blockmuster in WordPress

Das Hinzufügen eines Blockmusters zu Ihren Posts und Seiten kann Ihnen helfen, ihnen Struktur und Organisation zu verleihen. Blockmuster können verwendet werden, um Menüs, Trennlinien, Fußzeilen oder andere Arten von Inhalten zu erstellen, die Sie benötigen.
Erstellen Sie einen neuen Block in WordPress, indem Sie auf die Schaltfläche Neuen Block hinzufügen klicken, und geben Sie dann den Namen oder das Schlüsselwort Ihres Blocks ein, um danach zu suchen. Nachdem Sie den Block in den Inhaltsbereich eingefügt haben, sehen Sie die Blockfelder, die Sie für diesen benutzerdefinierten Block erstellt haben. Sie können den Block auch auf Ihre eigene Weise anpassen.