HTML-Code in WordPress bearbeiten [2024] 💥
Das Hinzufügen oder Bearbeiten von HTML-Code erfolgt in Wordpress mit einem Editor. Dies ist ein kurzes Tutorial für alle wichtigen Editoren wie Gutenberg, DiviBuilder, Elementor und WP-Bakery Pagebuilder. Je besser Sie mit HTML umgehen können, desto nützlicher ist es, diese Technik zu verwenden. Beginnen wir mit Gutenberg, da es heute der grundlegende Editor in Wordpress ist.
Anzeige
1. HTML-Code in WP mit Gutenberg bearbeiten
Jeder Block in Gutenberg kann als HTML bearbeitet werden. Klicken Sie im Menü zuerst auf die drei Punkte, dann auf „Als HTML bearbeiten“. So lassen sich Texte stylen oder Bilder bearbeiten und vieles mehr. Siehe Screenshot unten.
Gutenberg hat auch einen speziellen Block für HTML. Klicken Sie im Post-Bereich Ihres WordPress-Dashboards auf die Schaltfläche „Neu hinzufügen“. Klicken Sie auf das „+“. Geben Sie in der angezeigten Suchleiste „HTML“ oder „benutzerdefiniertes HTML“ in das Feld ein. Klicken Sie auf die Schaltfläche "Benutzerdefiniertes HTML". Lassen Sie uns nun den HTML-Code einfügen. Sie können Ihren eigenen HTML-Code erstellen, z. B. <div> oder <stark>. Oder Sie können den in Gutenberg generierten HTML-Code anzeigen, indem Sie auf "Vorschau" klicken.
2. HTML-Code in WP mit DiviBuilder bearbeiten
Fahren wir mit dem Divi-Builder, der beste Pagebuilder, den es gibt. Fast 1 Million Menschen verwenden diesen Editor in ihrem Wordpress. Öffnen Sie eine Seite/einen Beitrag mit Divi, „Mit Divi bearbeiten“. Klicken Sie einfach auf einen Textblock und dann auf die Konfigurationsschaltfläche mit der Aufschrift "Moduleinstellungen". Siehe Screenshot unten.
Es öffnet sich ein Pop-up, das anzeigt, dass sich derselbe Text auf der Seite befindet. Hier wechseln wir wie im Screenshot unten von „Visual“ zu „Text“. Wie Sie sehen können, konnte ich starke Tags hinzufügen, sodass der Text fett angezeigt wird. Auf der Seite selbst sehen Sie das unmittelbare Ergebnis.
3. HTML-Code in WP mit Elementor bearbeiten
Öffnen Sie eine Seite/einen Beitrag mit Elementor. Elementor hat immer die Box auf der linken Seite offen, im Gegensatz zu Divi, wo wir diese Box öffnen mussten. Natürlich ist es in Divi auch möglich, es zu öffnen, aber Elementor hat nur einen Modus. Wir müssen also nur irgendwo in ein Textfeld klicken, um den Inhalt auf der linken Seite anzuzeigen. Wechseln Sie nun von „Visuell“ zu „Text“. Und natürlich den HTML-Code nach Belieben bearbeiten.
4. HTML-Code in WP mit WP-Bakery bearbeiten
Öffnen Sie eine Seite/einen Beitrag mit „Mit WPBakery Page Builder bearbeiten“. Bewegen Sie den Mauszeiger über einen Textblock und klicken Sie auf das Stiftsymbol mit der Aufschrift „Textblock bearbeiten“. Es öffnet sich ein Popup, in dem Sie von „Visuell“ auf „Text“ umschalten. Sie können jetzt HTML im Feld hinzufügen oder bearbeiten. Siehe Screenshot unten von WP-Bakery Pagebuilder.
5. HTML-Code in WP mit Classic Editor bearbeiten
Öffnen Sie eine Seite/einen Beitrag, indem Sie einfach auf den Titel klicken. Wenn der Classic Editor installiert ist, gibt es kein Gutenberg, was eine gute Nachricht ist.
Und so bearbeiten Sie HTML-Code in Wordpress mit den am häufigsten verwendeten Pagebuildern. Viel Glück!
Anzeige