• Eigenschaften
  • Schablonen
  • Preisgestaltung
  • German
  • Eigenschaften
  • Schablonen
  • Preisgestaltung
  • German
Ops! Ihr gesuchtes Widget wurde nicht gefunden! Haben Sie eine Idee? Wenn ja, einreichen hier

Wie konvertiert man eine HTML-Vorlage in eine Elementor-Seitenvorlage | 4 einfache Schritte

Convert HTML Template to Elementor

Vorlagen sind der schnellste Weg, um Designs in eine Webseite zu importieren. Viele wissen nicht, wie man HTML in Elementor-Seitenvorlagen umwandelt. Infolgedessen werden die Dinge immer komplizierter. Um dieses Problem zu lösen, zeigen wir Ihnen, wie Sie ganz einfach Elementor-Vorlagen erstellen können.

Während wir die Vorlage erstellen, müssen Sie daran denken, dass wir eine vorgefertigte Seite benötigen. Natürlich können Sie sofort eine Webseite erstellen und mit ihr arbeiten. Wir werden unsere Seite in Elementor gestalten.

Für diese Veranstaltung verwenden wir jedoch Widgets, die von Element Pack. Stellen Sie sicher, dass Sie diesen Blog vollständig lesen, um zu erfahren, wie man HTML in eine Elementor-Seitenvorlage konvertiert.

Schritt 1: Gestaltung der Seite für die Vorlage

Als Erstes müssen wir unsere Seite erstellen. Fangen wir damit an.

Designing page for converting HTML template to Elementor

Gehen Sie zu Ihrem WordPress Dashboard> Seiten> Neu hinzufügen.

Geben Sie einen Namen für Ihre Seite ein und klicken Sie auf Bearbeiten mit Elementor. Nun wird Ihre Seite im Elementor-Editor geöffnet.

Open HTML in Elementor page

Als Nächstes gestalten Sie Ihre Seite nach Ihren Wünschen. In der obigen Abbildung haben wir die Seite mit den Widgets Überschrift, Scroll Nav, Erweiterte Schaltfläche, Suche und Schieberegler erstellt. Diese Elementor-Addon-Widgets sind alle von Element Pack gemacht. Jetzt haben wir unsere Seite bereit, in Elementor Seitenvorlage zu konvertieren.

Schritt 2: Umwandlung in eine Elementor-Seitenvorlage

Converting HTML template into Elementor page template

Um eine Vorlage zu erstellen, müssen wir einige Schritte ausführen. Folgen Sie zunächst der obigen Abbildung und klicken Sie unten im Menü auf der rechten Seite auf Als Vorlage speichern. Sie müssen auf den Pfeil neben der Schaltfläche Aktualisieren klicken, damit die Option angezeigt wird. Dies ist der erste Schritt zur Erstellung einer Elementor-Seitenvorlage.

save the elementor template

Daraufhin wird ein neues Popup-Fenster angezeigt. Dort können Sie Ihrer Vorlage einen Namen geben und auf Speichern klicken. Ihre Vorlage wird in Ihrer Elementorbibliothek gespeichert.

Einige Nutzer fragen auch, ob es einen Online-Konverter für die Umwandlung von HTML in Elementor oder ein HTML-Plugin für Elementor gibt, um den Prozess zu vereinfachen. Elementor verfügt zwar nicht über einen direkten Konverter, aber Sie können Ihre Entwürfe ganz einfach erstellen und speichern, indem Sie diese Schritte befolgen.

Schritt 3: Vorlage auf lokales Laufwerk exportieren

Exporting Template into local drive

Wenn Sie die Vorlage speichern, wird Ihre Vorlagenbibliothek angezeigt. Klicken Sie dort auf die markierten Punkte auf Ihrer neu erstellten Vorlage. Es werden zwei Optionen angezeigt. Klicken Sie nun auf Importieren.

import elementor json template

Ihre Vorlage wird heruntergeladen und im Json-Format gespeichert. Nun können Sie diese Datei in Ihrem lokalen Verzeichnis> wp-content> templates ablegen. Diese Datei ist auch bekannt als die elementor vorlage json datei.

Wenn Sie die Datei auf diese Weise speichern, können Sie von jedem WordPress-Dashboard aus auf diese Vorlage zugreifen.

Wenn Sie mit benutzerdefiniertem HTML arbeiten, finden Sie vielleicht Anleitungen zu html zu json elementor oder html zu elementor jsonaber Elementor erledigt das meiste davon automatisch beim Exportieren und Importieren von Vorlagen.

Beste Web-Lösung: Möchten Sie Ihre Website mit unserem Produkt aufwerten?

Schritt 4: Einfügen der elementor Seitenvorlage

Sie haben die Json-Datei der Vorlage in Ihrem lokalen Verzeichnis, das heißt, sie befindet sich jetzt in der WordPress-Bibliothek. Nun wollen wir sehen, wie Sie sie in Ihre Seite einfügen können.

Inserting the elementor page template

Erstellen Sie zunächst eine neue Seite und bearbeiten Sie sie mit Elementor. Klicken Sie dann auf den im Bild oben gezeigten Vorlagenordner.

insert the template into new elementor page

Jetzt können Sie Ihre Vorlagenbibliothek sehen. Bewegen Sie dort den Mauszeiger auf Ihre Vorlage, klicken Sie auf Einfügen und dann auf Ja. 

Das war's! Ihre Elementor-Vorlage wird auf Ihrer Seite anstelle von HTML angezeigt. Dies ist besonders nützlich, wenn Sie Websites in Elementor konvertieren oder Designs wiederverwenden möchten.

Wie kann ich ein HTML-Element in einer Elementor-Seite ausblenden?

Wenn Sie die HTML-Vorlage nicht in Elementor konvertieren wollen, können Sie sie einfach vorübergehend ausblenden, so dass Sie die HTML-Version wieder aufrufen können. 

Hier sind die einfachsten Schritte, um HTML-Vorlage in Elementor Seite verstecken sind unten:

Schritt 1: Gehen Sie zu Ihrem Elementor-Seite und wählen Sie die elementor html widget.
Schritt 2: Klicken Sie in der linken Menüleiste auf Vorschuss tab.

Schritt 3: Scrollen Sie nach unten und suchen Sie in der Liste das Menü Responsive.
Schritt 4: Aktivieren Sie die Umschaltfunktion zum Ausblenden für Desktop, Handy, Tablet, wie Sie benötigen.

Das war's. Ihre HTML-Vorlagen werden auf Ihrer Elementor-Seite nicht angezeigt. Sie können sie jedoch jederzeit wieder sichtbar machen, indem Sie die Umschaltfunktion deaktivieren.

Häufig gestellte Fragen:

Wie kann man den HTML-Quellcode einer mit Elementor erstellten Seite anzeigen?

Klicken Sie mit der rechten Maustaste auf die Seite, und klicken Sie auf "Seitenquelle anzeigen". Dies zeigt die HTML-Elementor Struktur.

Wie bearbeitet man HTML in Elementor?

Suchen Sie im linken Menü nach HTML. Verwenden Sie die elementor html code Editor-Option und drücken Sie nach der Bearbeitung veröffentlichen. um die Änderungen zu speichern.

Wie fügt man HTML-Code in WordPress Elementor hinzu?

Legen Sie die wordpress elementor html code Block oder der elementor html widget und fügen Sie den Code zwischen ein.

Kann ich Elementor-Entwürfe als HTML exportieren?

Ja, aber Elementor exportiert standardmäßig JSON. Sie benötigen Tools oder manuelle Methoden für elementor-Seite in html umwandeln, oder elementor nach html exportieren.

Schlussfolgerung

Die Konvertierung von HTML in eine Elementor-Seitenvorlage oder der einfache Export Ihres Elementor-Designs als JSON ist keine schwierige Aufgabe, und Sie können es auch tun. Sie müssen nur die Schritte richtig befolgen.

Einige Nutzer bevorzugen den umgekehrten Weg und suchen nach einer elementor zu html konverter oder Wege zur elementor-Seite nach html exportieren. In solchen Fällen können Sie entweder die Speicherfunktion des Browsers oder Plugins verwenden, die elementor in html umwandeln.

Dieser Blog wird gesponsert von Element Pack, das Komplettpaket für Widgets Elementor. Danke, dass Sie diesen Blog gelesen haben. Ich wünsche Ihnen einen schönen Tag.

Lesen Sie auch:

Eine Antwort hinterlassen

Inhaltsübersicht

Urheberrecht © 2025 BdThemes. Alle Rechte vorbehalten.

Money Transfer Logo