Möchten Sie Ihre eigenen benutzerdefinierten Seitenlayouts in WordPress erstellen? Elementor ist ein Drag & Drop-WordPress-Seitenersteller, mit dem Sie ganz einfach benutzerdefinierte WordPress-Layouts erstellen können, ohne über Programmierkenntnisse zu verfügen. In diesem Artikel zeigen wir Ihnen, wie Sie mit Elementor ganz einfach benutzerdefinierte WordPress-Layouts mit nur wenigen Klicks erstellen.
Warum und wann benötigen Sie benutzerdefinierte WordPress-Layouts?
Viele kostenlose und Premium-WordPress-Themes bieten mehrere Layout-Optionen für verschiedene Arten von Seiten. Manchmal entspricht jedoch keines dieser Layouts Ihren Anforderungen.
Wenn Sie wissen, wie man in PHP, HTML und CSS programmiert, können Sie Ihre eigenen Seitenvorlagen erstellen oder sogar ein untergeordnetes Thema für Ihre Site erstellen. Die Mehrheit der WordPress-Benutzer sind jedoch keine Entwickler, daher funktioniert diese Option für sie nicht.
Wäre es nicht toll, wenn Sie Seitenlayouts einfach per Drag & Drop erstellen könnten?
Genau das macht Elementor. Es ist ein Drag-and-Drop-Plugin zum Erstellen von WordPress-Seiten, mit dem Sie ganz einfach Ihre eigenen benutzerdefinierten WordPress-Layouts ohne Programmierkenntnisse erstellen können.
Es verfügt über eine intuitive Benutzeroberfläche, mit der Sie benutzerdefinierte Layouts mit einer Live-Vorschau erstellen können. Es kommt mit vielen gebrauchsfertigen Modulen für alle Arten von Webdesign-Elementen.
Es gibt mehrere professionell gestaltete Vorlagen, die Sie sofort laden und als Ausgangspunkt verwenden können. Es funktioniert mit allen standardkonformen WordPress-Themes und ist mit allen gängigen WordPress-Plugins kompatibel.
Lassen Sie uns jedoch einen Blick darauf werfen, wie Sie mit Elementor benutzerdefinierte WordPress-Layouts erstellen.
Erste Schritte mit Elementor
Zuerst müssen Sie das Elementor Pro-Plugin kaufen. Es ist die kostenpflichtige Version des kostenlosen Elementor-Plugins und bietet Ihnen Zugriff auf zusätzliche Funktionen und 1 Jahr Support.
Als nächstes müssen Sie das Elementor-Plugin installieren und aktivieren. Weitere Informationen finden Sie in unserer Schritt-für-Schritt-Anleitung zur Installation eines WordPress-Plugins.
Nach der Aktivierung müssen Sie besuchen Elementor » Einstellungen Seite zum Konfigurieren der Plugin-Einstellungen.
Hier können Sie Elementor für verschiedene Beitragstypen aktivieren. Standardmäßig ist es für Ihre WordPress-Beiträge und -Seiten aktiviert. Wenn Sie auf Ihrer Site benutzerdefinierte Beitragstypen haben, werden diese auch hier angezeigt und Sie können sie ebenfalls aktivieren.
Sie können Benutzerrollen ausschließen oder einschließen, die Elementor beim Schreiben von Beiträgen oder Seiten verwenden können. Standardmäßig ist es nur für Administratoren aktiviert.
Vergessen Sie nicht, auf die Schaltfläche Änderungen speichern zu klicken, um Ihre Einstellungen zu speichern.
Erstellen eines benutzerdefinierten WordPress-Layouts mit Elementor
Zuerst müssen Sie eine neue Seite (oder einen neuen Beitrag) auf Ihrer WordPress-Site erstellen. Auf dem Nachbearbeitungsbildschirm werden Sie die neue Schaltfläche „Mit Elementor bearbeiten“ bemerken.
Wenn Sie darauf klicken, wird die Elementor-Benutzeroberfläche gestartet, in der Sie Ihre Seite mit dem Drag-and-Drop-Seitenersteller von Elementor bearbeiten können.
Jetzt können Sie Abschnitte hinzufügen und Ihre Seite von Grund auf neu erstellen oder eine Vorlage hinzufügen.
Vorlagen sind ein schneller Weg, um schnell loszulegen. Elementor wird mit mehreren professionell gestalteten Vorlagen geliefert, die Sie nach Belieben anpassen können.
Beginnen wir mit einer Vorlage, indem Sie auf die Schaltfläche „Vorlage hinzufügen“ klicken.
Dies öffnet ein Popup, in dem Sie verschiedene verfügbare Vorlagen sehen können. Sie sollten nach einer Vorlage suchen, die Ihren Vorstellungen für Ihr Seitenlayout ähnelt.
Klicken Sie nun auf die gewünschte Vorlage und klicken Sie dann auf die Schaltfläche ‚Einfügen‘, um sie zu Ihrer Seite hinzuzufügen.
Elementor lädt nun die Vorlage für Sie.
Sie können nun mit der Bearbeitung der Vorlage beginnen, um sie Ihren Anforderungen anzupassen. Zeigen und klicken Sie einfach auf ein Element, um es auszuwählen, und Elementor zeigt Ihnen seine Einstellungen in der linken Spalte an.
Lassen Sie uns nun darüber sprechen, wie Elementor-Layouts funktionieren.
Elementor-Layouts werden mit Abschnitten, Spalten und Widgets erstellt. Abschnitte sind wie Zeilen oder Blöcke, die Sie auf Ihrer Seite platzieren.
Jeder Abschnitt kann mehrere Spalten haben und jeder Abschnitt und jede Spalte kann ihre eigenen Stile, Farben, Inhalte usw. haben.
Sie können mit Elementor-Widgets alles in Ihren Spalten und Abschnitten hinzufügen.
Diese Widgets sind verschiedene Arten von Inhaltsblöcken, die Sie in Ihren Elementor-Abschnitten platzieren können.
Wählen Sie einfach ein Widget aus und legen Sie es in Ihrem Abschnitt oder Ihrer Spalte ab. Es steht ein umfangreiches Set an Widgets zur Verfügung, die alle gängigen Webdesign-Elemente abdecken, die Sie sich vorstellen können.
Sie können Bilder, Text, Überschriften, Bildergalerien, Videos, Karten, Symbole, Erfahrungsberichte, Schieberegler, Karussells und vieles mehr hinzufügen.
Sie können auch Standard-WordPress-Widgets und sogar die Widgets hinzufügen, die von anderen WordPress-Plugins auf Ihrer Site erstellt wurden.
Wenn Sie mit der Bearbeitung fertig sind, können Sie auf die Schaltfläche Speichern klicken, um Ihre Änderungen zu speichern.
Notiz: Durch das Speichern eines Layouts wird die Seite nicht auf Ihrer WordPress-Site veröffentlicht. Es wird nur Ihr Seitenlayout speichern.
Sie können jetzt eine Vorschau Ihrer Seite anzeigen oder zum WordPress-Dashboard gehen.
Dies bringt Sie zurück zum WordPress-Post-Editor. Sie können nun Ihre WordPress-Seite speichern oder auf Ihrer Website veröffentlichen.
Erstellen eigener Vorlagen in Elementor
Mit Elementor können Sie Ihre eigenen benutzerdefinierten Layouts als Vorlagen speichern. Auf diese Weise können Sie Ihre eigenen Vorlagen wiederverwenden, um in Zukunft noch schneller neue Seiten zu erstellen.
Bearbeiten Sie einfach die Seite, die Sie als Vorlage speichern möchten, mit Elementor.
Klicken Sie in der Elementor-Builder-Benutzeroberfläche auf das Ordnersymbol neben der Schaltfläche zum Speichern und wählen Sie dann „Vorlage speichern“.
Dadurch wird ein Popup angezeigt, in dem Sie einen Namen für Ihre Vorlage eingeben und auf die Schaltfläche Speichern klicken müssen.
Wenn Sie das nächste Mal ein benutzerdefiniertes Seitenlayout erstellen, können Sie es auf der Registerkarte „Meine Vorlagen“ auswählen.
Sie können diese Vorlage auch exportieren und mit Elementor auf anderen WordPress-Sites verwenden.
Sie müssen besuchen Elementor » Bibliothek Seite, um Ihre gespeicherten Vorlagen anzuzeigen. Fahren Sie mit der Maus über Ihren Vorlagennamen und klicken Sie dann auf den Link ‚Vorlage exportieren‘.
Nachdem Sie Ihre Vorlagendatei heruntergeladen haben, können Sie mit Elementor zur Bibliotheksseite einer anderen WordPress-Site gehen und dann Ihre Vorlage importieren.
Das ist alles für jetzt.
Wir hoffen, dieser Artikel hat Ihnen geholfen zu lernen, wie Sie mit Elementor benutzerdefinierte WordPress-Layouts erstellen. Vielleicht möchten Sie auch unsere Schritt-für-Schritt-Anleitung sehen, wie Sie WordPress beschleunigen und die Leistung steigern können.