- Was ist der Elementor Theme Builder?
- So greifen Sie auf den Theme Builder zu
- Neue Vorlagen erstellen
- Dynamische Inhalte verwenden
- Bedingungen speichern und anwenden
- Globale Vorlagen-Einstellungen verwalten
- Erweiterte Layout- und Responsive-Optionen
- Theme Builder vs Page Builder
- Nützliche Links
- Fazit
Wie man den Elementor Theme Builder verwendet, eröffnet vollständige Kontrolle über das Layout und die Struktur Ihrer WordPress-Website. Von Kopfzeilen und Fußzeilen bis hin zu benutzerdefinierten Vorlagen für Beiträge und Seiten ermöglicht Ihnen Elementor, Ihre gesamte Website visuell zu gestalten – ohne Code oder vorgefertigte Themes.
Was ist der Elementor Theme Builder?
Der Elementor Theme Builder ermöglicht es Nutzern, die Standardteile des WordPress-Themes durch vollständig angepasste Designs zu ersetzen. Er geht über einfaches Seitenbearbeiten hinaus und gibt Ihnen Zugang zu:
- Kopfzeilen und Fußzeilen
- Vorlagen für einzelne Beiträge und Archivseiten
- 404-Fehlerseiten
- WooCommerce-Produkt- und Shop-Seiten
Dieses Tool ist besonders nützlich für Nutzer, die auf ihrer Website ein durchgängiges Markenerlebnis ohne Programmierkenntnisse schaffen möchten. Egal, ob Sie Freiberufler, Geschäftsinhaber oder Agentur sind – Theme Builder bietet Flexibilität und professionelle Ergebnisse.
So greifen Sie auf den Theme Builder zu.
Sie können den Elementor Theme Builder vom WordPress-Dashboard aus oder direkt im Elementor-Editor öffnen:
- Gehen Sie im WordPress-Adminbereich zu <b>Vorlagen > Theme Builder</b>. Hier sehen Sie alle Template-Typen, die Sie erstellen oder bearbeiten können.
- Oder bearbeiten Sie eine Seite mit Elementor, klicken Sie im oberen linken Menü > Theme Builder, um die Ansicht zu wechseln – ohne Ihren Workflow zu verlassen.
Dieser nahtlose Zugriff ermöglicht es Ihnen, mühelos zwischen globaler Vorlagenbearbeitung und individuellen Seitenanpassungen zu wechseln.
Neue Vorlagen erstellen
Wählen Sie den Bereich Ihrer Website aus, den Sie anpassen möchten, und gestalten Sie ihn visuell mit der Drag-and-Drop-Oberfläche von Elementor.
Kopfzeile und Fußzeile
Klicken Sie Neu hinzufügen > Wählen Sie Kopfzeile oder Fußzeile. Verwenden Sie Widgets wie Navigationsmenüs, Logos, Suchleisten und Social-Media-Symbole. Passen Sie Ausrichtung, Responsivität und Verhalten beim Scrollen an (Sticky- oder transparente Header).
Einzelner Beitrag oder Archivseite
Wählen Sie Single oder Archive-Vorlagen, um Blog-Layouts mit dynamischen Inhalten in Elementor zu gestalten. Fügen Sie Beitragsbilder, Titel, Metadaten, Autorenboxen und verwandte Beiträge hinzu. Sie können das Layout auch an Ihre Marke anpassen.
404-Seite oder WooCommerce-Vorlagen
Wenn Sie 404-Seiten mit hilfreichen Links oder einer Suchfunktion erstellen, verbessern Sie die Benutzererfahrung. Wenn Sie WooCommerce-Seiten mit Elementor bearbeiten, können Sie die Produktübersicht, Produktseiten, Warenkorb und Checkout-Layouts anpassen, um bessere Conversions zu erzielen.
Dynamische Inhalte verwenden
Dynamische Inhalte ermöglichen es Ihnen, in Vorlagen Echtzeit-Informationen wie Beitragstitel, Beitragsbild, Autorennamen oder Produktdetails anzuzeigen. Das ist entscheidend für Konsistenz und Personalisierung.
- Klicken Sie auf das Dynamische Tags-Symbol neben jedem Widget-Feld.
- Wählen Sie aus Inhaltsoptionen wie Beitragstitel, Website-Logo oder WooCommerce-Preis.
- Sie können benutzerdefinierte Felder auch mithilfe von Integrationen mit ACF, Pods oder Toolset einbinden.
Bedingungen speichern und anwenden
Sobald Ihre Vorlage fertig ist, klicken Sie auf Veröffentlichen und wählen Sie Anzeigebedingungen. Diese bestimmen, wo und wann Ihre Vorlage angezeigt wird:
- Stellen Sie es so ein, dass es entweder die gesamte Website oder nur bestimmte Seiten, Beiträge oder Kategorien betrifft.
- Sie können einem Blog-Beitrag eine Vorlage zuweisen und eine andere Vorlage für WooCommerce-Produkte verwenden.
- Ausschlussbedingungen ermöglichen das Überschreiben von Standardwerten bei speziellen Layouts.
Bedingungen ermöglichen eine präzise Steuerung darüber, wie Ihre Vorlagen auf der Website eingesetzt werden.
Entdecken Sie über 90 fertige Elementor-Lösungen.
Globale Vorlagen-Einstellungen verwalten
Die Datei-Einbettungsvorlage richtet sich an Website-Besitzer, die Dateien mühelos zu ihren Websites hinzufügen möchten. Diese sofort einsatzbereite Vorlage bietet für jeden etwas und erfordert keine Programmierkenntnisse.
- Wechseln Sie im Elementor-Editor zu Website-Einstellungen.
- Globale Werte für Textgrößen, Link-Farben, Hintergrundstile und das Erscheinungsbild der Formularfelder festlegen.
- Sie können außerdem globale Schriftarten und Farbpaletten hinzufügen, um Ihre Markenidentität widerzuspiegeln.
Globale Einstellungen reduzieren Design-Duplikate und erleichtern zukünftige Updates.
Erweiterte Layout- und Responsive-Optionen
Passen Sie Abstände, Spaltenstrukturen und mobile Breakpoints an, um die Benutzererfahrung auf allen Geräten zu optimieren.
Nutzen Sie Flexbox und Container
Aktivieren Sie fortgeschrittene Layout-Funktionen in Elementor > Einstellungen > Funktionen, um mehr Designflexibilität durch containerbasierte Layouts freizuschalten, die leichter und anpassungsfähiger sind als klassische Abschnitte und Spalten.
Responsives Design
Wechseln Sie zwischen Desktop-, Tablet- und Mobilansicht. Passen Sie Padding, Schriftgröße, Sichtbarkeit und Widget-Reihenfolge pro Gerät an, um eine reibungslose mobile Leistung zu gewährleisten. Verwenden Sie den Responsive-Modus, um jedes Gerät direkt zu testen und zu bearbeiten.
Theme Builder vs Page Builder
Elementor-Seiten-Builder bearbeitet einzelne Seiten, während der Theme-Builder globale Vorlagen steuert, die auf Ihrer Website verwendet werden. Dieses Verständnis hilft Ihnen, Ihren Design-Workflow effizienter zu strukturieren.
| Funktion | Seiten-Builder | Theme Builder |
|---|---|---|
| Umfang | Eine Seite oder ein Beitrag | Text-Bild-Paare zur Hervorhebung von Produkten oder Dienstleistungen |
| Kopfzeile/Fußzeile | Nicht editierbar | Vollständig anpassbar |
| Dynamische Inhalte | Begrenzt | Umfangreich |
| Bedingungen | Keine | Detailliertes Targeting |
Verwenden Sie Theme Builder für globale Konsistenz. Verwenden Sie Page Builder für einzigartige, einmalige Designs oder Landing Pages.
Nützliche Links
Theme Builder verwenden – Erfahren Sie, wie Sie Vorlagen wie Kopfzeilen, Fußzeilen, einzelne Beiträge und mehr mit dem Theme Builder von Elementor erstellen und bearbeiten.
Anzeigebedingungen für globale Vorlagen festlegen – Erfahren Sie, wie Sie Anzeigebedingungen Vorlagen zuweisen, um festzulegen, wo und wann sie auf Ihrer Website erscheinen.
Theme-Stil festlegen – Erfahren Sie, wie Sie globale Stiloptionen für Elemente wie Hintergründe, Überschriften, Schaltflächen und mehr konfigurieren.
Responsives Bearbeiten für Mobilgeräte und Tablets – Lernen Sie, wie Sie Ihre Website so gestalten, dass sie mit verschiedenen Geräten kompatibel ist, mithilfe von Elementors responsiven Bearbeitungsfunktionen.
Was ist dynamischer Inhalt? – Erfahren Sie, wie Sie dynamische Inhalte verwenden, um Echtzeit-Informationen wie Titel von Beiträgen, hervorgehobene Bilder und mehr in Ihren Vorlagen anzuzeigen.
Fazit
Lerne, den Elementor Theme Builder effektiv zu nutzen – das verändert, wie du WordPress-Design verwaltest. Du kannst Kopfzeilen, Fußzeilen, Blog-Vorlagen und WooCommerce-Seiten mit dynamischen Inhalten und globalen Einstellungen erstellen – alles visuell und mit vollständiger Gestaltungsfreiheit. Mit responsiven Layouts, wiederverwendbaren Vorlagen und fortgeschrittener Bedingungslogik ist es ein unverzichtbares Tool für jeden, der maßgeschneiderte WordPress-Websites erstellt, die professionell aussehen und funktionieren.
