Wiederholen Sie für eine Live-Version

Diese Seite (https://blogpascher.com/elementor/comment-creer-site-web-complet-elementor) ist derzeit offline. Da die Site jedoch die Always Online ™ -Technologie von Cloudflare verwendet, können Sie weiterhin einen Schnappschuss der Site durchsuchen. Wir werden weiterhin im Hintergrund nachsehen und sobald die Site zurückkommt, wird Ihnen automatisch die Live-Version zugestellt. Always Online ™ wird betrieben von Cloudflare | Ausblenden dieser Alarm

Springe zum Hauptinhalt

So erstellen Sie eine vollständige Website mit Elementor

Divi: das am einfachsten zu verwendende WordPress-Theme

Divi: Das beste WordPress-Theme aller Zeiten!

Mehr 901.000 Downloads, Divi ist das beliebteste WordPress-Theme der Welt. Es ist vollständig, einfach zu bedienen und enthält mehr als 62-freie Vorlagen. [Empfohlen]

Elementor bietet regelmäßig Themen an, mit denen Sie daraus eine vollständige Website erstellen können. Jeden Monat veröffentlichen wir neue Themen, die sich um eine bestimmte Nische drehen und dennoch so flexibel sind, dass Sie sie endlich an Ihre eigenen Bedürfnisse anpassen können.

In Kombination mit Elementor Pro helfen Ihnen diese Themen dabei, schnell mit jedem Teil Ihrer Website zu beginnen, einschließlich:

die pstatisches Alter, wie die Homepage,

  • der Header
  • die Fußzeile
  • Seite 404
  • der Archivbereich 
  • der Blog
  • Popups und andere

In diesem Tutorial zeigen wir Ihnen, wie Sie mit dem visuellen Seitenersteller von Elementor eine vollständige Website erstellen.

Aber vorher, wenn Sie WordPress Discover noch nie installiert haben Wie man ein Wordpress-Blog 7 Schritte für die Installation et Wie finden, zu installieren und ein Wordpress-Theme auf Ihrem Blog aktivieren 

Dann zurück zu warum wir hier sind.

So erstellen Sie eine vollständige Website mit Elementor-Themen

In diesem Tutorial lernen Sie, wie Sie ein Thema als Grundlage für alle wichtigen Teile Ihrer Website verwenden und dann alles zusammenfügen, um eine zusammenhängende Website zu erstellen.

Genauer gesagt das Thema digital-Agentur.

Ihre Website enthält eine Reihe grundlegender Seiten, z. B. Seiten:

  • Start
  • Über die Marke
  • Dienstleistungen
  • Kunden
  • Blog
  • Kontakt

Außerdem bietet es Abschnitte, die sich auch dynamischen Inhalten widmen. Beispielsweise stimmen Ihre Blogpost-Archive und Post-Vorlagen automatisch mit Ihren eigenständigen Seiten überein. Sie können auch Kopf- und Fußzeile sowie ändern Seiten 404

So erstellen Sie eine vollständige Website oder einen Blogpascher 1

So erstellen Sie eine Website mit einem Elementor-Thema:

1. Installieren und aktivieren Sie das Elementor Hello-Design 

Da Sie Elementor und eine Designvorlage zum Erstellen Ihrer gesamten Website verwenden, müssen Sie nicht nach anderen Elementen suchen.

Stattdessen benötigen Sie nur eine leichte, leistungsoptimierte Website, die das Elementor Hello-Thema bietet.

Um zu beginnen, gehen Sie zu Aussehen → Themen → Hinzufügen und suche“Hallo Elementor“. Dann installiere und aktiviere das Theme. 

2. Konfigurieren Sie die grundlegenden statischen Seiten Ihrer Website

Dann gehen Sie zum Menü Seiten → Hinzufügen um die Basisseiten Ihrer Website zu erstellen.

Erstellen Sie zunächst eine Seite mit dem Namen " Start Klicken Sie auf die Schaltfläche Mit Elementor bearbeiten, um Elementor zu starten.

geöffnet Seite Optionen und ändern Sie seine Layout so dass es gleich ist Elementor Volle Breite.

Öffnen Sie dann die Elementor-Vorlagenbibliothek und suchen Sie unter nach "Digital Agency" Seiten :

So erstellen Sie eine vollständige Website oder einen Blogpascher 2.

Sie sollten eine Liste der Seitenvorlagen dieses Themas sehen. Vorlage einfügen Startseite aus der Liste der Modelle.

Jetzt sollten Sie eine vollständige Homepage sehen. Der Header sieht vorerst etwas langweilig aus - aber keine Sorge, das werden wir bald beheben.

So erstellen Sie eine vollständige Website oder einen Blogpascher 3

Verwenden Sie dann Elementor Finder, um eine weitere Seite hinzuzufügen, die für Ihre Seite verwendet werden soll.Über die Marke".

Ändern Sie nach wie vor das Layout - Seitenlayout - à Elementor Volle Breite. Öffnen Sie dann die Vorlagenbibliothek und fügen Sie die Vorlage ein Über uns des Digital Agency-Themas.

Wiederholen Sie jetzt einfach den gleichen Vorgang, um alle anderen Seiten zu erstellen, einschließlich: Dienstleistungen, Kunden und Kontakt.

Erstellen Sie ganz einfach Ihre Website mit Elementor

Mit Elementor können Sie auf einfache Weise jedes Website-Design mit einem professionellen Look erstellen. Zahlen Sie nicht mehr teuer für das, was Sie selbst tun können. [Kostenlos]

Mach dir noch keine Sorgen um die Blog-Seite. Diese Seite ist nicht statisch wie die anderen. Aus diesem Grund erstellen Sie es dort mit einer anderen Methode (die wir später in diesem Tutorial behandeln werden).

Um die Einrichtung Ihrer statischen Seiten abzuschließen, müssen Sie Ihre WordPress-Installation anweisen, eine statische Homepage zu verwenden. Um dies zu tun…

  • gehe zu Einstellungen → Lesen
  • Wählen  Statische Seite unter Ihren Homepage-Einstellungen 
  • Wählen Sie die Seite aus, die die Homepage-Vorlage des Themas enthält

3. Erstellen Sie die anderen Teile Ihrer Website

Jetzt können Sie die anderen Teile Ihrer Website mit Elementor erstellen. Mit Elementor können Sie nicht nur statische Seiten erstellen (wie oben beschrieben).

Mit Elementor können Sie auch Abschnitte entwerfen wie: en-Kopf; die Fußzeile, etc ...

Dank des Elementor-Themas können Sie Vorlagen für alle Abschnitte importieren, die sich bereits auf den statischen Seiten befinden, die Sie im vorherigen Schritt erstellt haben.

Um auf den Visual Builder von Elementor zuzugreifen, gehen Sie zu Vorlagen → Theme Builder. Sie müssen Elementor Pro installieren, um darauf zugreifen zu können.

Jetzt ist es Zeit, Ihre Abschnitte zu erstellen

Kopfzeile

Gehen Sie zunächst zur Registerkarte Kopfzeile Klicken Sie dann in der Visual Builder-Oberfläche auf Neuen Header hinzufügen. Geben Sie im nächsten Bildschirm einen Namen ein und klicken Sie dann auf Vorlage erstellen.

Dann sehen Sie eine Auswahl von Vorlagen in der Elementor-Bibliothek. Suchen Sie wie bei den statischen Seiten nach „Digital Agency“ und fügen Sie sie ein:

So erstellen Sie eine vollständige Website oder einen Blogpascher 4

Jetzt sollten Sie eine visuelle Vorschau Ihrer Kopfzeile sowie einen leeren Bereich für Ihr Navigationsmenü sehen.

Derzeit ist das Navigationsmenü leer, da Sie noch kein Menü erstellt haben. So erstellen Sie Ihr Menü ...

  • gehe zu  Aussehen → Menüs in Ihrem WordPress-Dashboard
  • Geben Sie Ihrem Menü einen Namen
  • Klicken Sie auf Erstellen Sie das Menü

So erstellen Sie eine vollständige Website oder einen Blogpascher 4

Nachdem Sie ein Menü erstellt haben, können Sie die in Schritt 2 erstellten Seiten zu Ihrem Navigationsmenü hinzufügen.

Lesen Sie auch: 10 Automatisierungstools für das Marketing von Kleinunternehmen

Wenn Sie mit dem Hinzufügen von Menüelementen fertig sind, speichern Sie Ihr Menü und kehren Sie zu Ihrer Kopfzeilenvorlage in der Elementor-Oberfläche zurück.

ensuite, veröffentlichen Ihren Header und verwenden Sie Anzeigebedingungen, um Ihre Header-Vorlage auf Ihrer gesamten Website anzuzeigen. Wenn Sie möchten, können Sie auch Anzeigebedingungen verwenden, um verschiedene Kopfzeilen für verschiedene Arten von Inhalten zu erstellen:

So erstellen Sie eine vollständige Website oder einen Blogpascher 6

Dann drücken Speichern und schließen.

Fußzeile

Jetzt ist es Zeit, Ihre Website-Fußzeile zu erstellen:

  • Kehren Sie zur Oberfläche des visuellen Seitenerstellers zurück
  • Klicken Sie auf die Registerkarte Fußzeile 
  • Klicken Sie auf die Schaltfläche zu Neue Fußzeile hinzufügen
  • Geben Sie im Popup Ihrer Fußzeile einen Namen und klicken Sie auf Vorlage erstellen

Jetzt sollten Sie eine Liste mit Fußzeilenvorlagen sehen, genau wie Sie es mit Ihrer Kopfzeile getan haben. Suchen Sie nach "Digital Agency" und fügen Sie die Fußzeilenvorlage ein.

Sobald Sie die Fußzeilenvorlage eingefügt haben, sollte eine Vorschau Ihrer Fußzeile angezeigt werden:

So erstellen Sie eine vollständige Website oder einen Blogpascher 7

ensuite, veröffentlichen Ihre Fußzeilenvorlage und verwenden Sie die Anzeigebegriffe, um sie auf Ihrer gesamten Website anzuzeigen.

Suchst du nach den besten WordPress Themes und Plugins?

Laden Sie die besten Plugins und WordPress-Themes auf Envato herunter und erstellen Sie ganz einfach Ihre Website. Schon mehr als 49.720.000 Downloads. [EXCLUSIVE]

Blog-Seite

Im Gegensatz zu den statischen Seiten, die Sie in Schritt 2 erstellt haben, ist die Blog-Seite Ihrer Website ein " Archiv ". Grundsätzlich bedeutet dies, dass die neuesten Inhalte auf Ihrer Website dynamisch angezeigt werden.

Wenn ein Benutzer auf ein bestimmtes Element auf der Blogseite klickt, wird er zu einer Seite mit dem Inhalt dieses Elements weitergeleitet. Dies wird als „Einzelseite“ bezeichnet. Ihr einzigartiges Design stellt sicher, dass alle Ihre Inhalte den gleichen grundlegenden Stil haben – das einzige, was sich ändert, ist der eigentliche Inhalt (wie Artikeltitel, Textkörper, vorgestelltes Bild usw.).

Entdecken So fügen Sie mit Elementor ein Inhaltsverzeichnis in WordPress hinzu

Um Archivseiten und eindeutige Seitenvorlagen zu erstellen, sollten Sie den Elementor Visual Builder verwenden - keine Zonen ! ou Artikel WordPress Standard.

Beginnen…

  • Öffnen Sie die Theme Builder-Oberfläche
  • Gehen Sie zur Registerkarte Archiv
  • Klicken Sie auf Neues Archiv hinzufügen
  • Geben Sie ihm einen Namen und klicken Sie auf Vorlage erstellen

Wie bei Ihrer Kopf- und Fußzeile sehen Sie eine Liste mit Archivseitenvorlagen. Suchen Sie nach der Vorlage „Digitale Agentur“ und fügen Sie sie ein.

Jetzt sollten Sie das grundlegende Design für Ihre Nachrichtenseite sehen, obwohl der einzige Inhalt der Standard „Hallo Welt! Von WordPress:

So erstellen Sie eine vollständige Website oder einen Blogpascher 8

Im Moment müssen Sie nur noch etwas tun veröffentlichen Ihre Archivseite und stellen Sie sie so ein, dass sie in allen Archiven angezeigt wird.

Lesen Sie unseren Leitfaden weiter So migrieren Sie eine WordPress-Website manuell

Dann können Sie in den Bereich für reguläre Beiträge von WordPress gehen und neue Blog-Beiträge erstellen. Ordnen Sie jeden Artikel einer Kategorie mit dem Namen "Beyond News" zu.

Wenn Sie jetzt zu Ihrer Archivseite navigieren, sollten alle diese neuen Beiträge automatisch angezeigt werden:

So erstellen Sie eine vollständige Website oder einen Blogpascher 9

Erstellung der Blogpost-Vorlagenseite

Zu diesem Zeitpunkt sieht Ihre Blog-Seite recht benutzerfreundlich aus. Wenn Sie jedoch auf einen bestimmten Blog-Beitrag klicken, stimmt das Layout nicht mit dem Rest Ihrer Website überein.

Um dieses Problem zu lösen, müssen Sie mit Elementor eine "eindeutige" Vorlage erstellen:

  • Öffnen Sie Elementor Visual Builder
  • Gehen Sie zur Registerkarte Einzel
  • Klicken Sie auf Neue Single hinzufügen

Im Popup Neue Vorlage :

  • Geben Sie ihm einen Namen
  • wählen Posten in der Dropdown-Liste Wählen Sie Post Type. Dies teilt Elementor mit, dass Sie diese Vorlage für Ihre Blog-Posts verwenden möchten (im Gegensatz zu Pages oder einem anderen benutzerdefinierten Post-Typ, den Sie verwenden könnten).

Sie sehen erneut die Elementor-Vorlagenbibliothek. Suchen Sie die einzigartige Artikelvorlage der Vorlage „Digitale Agentur“ und fügen Sie sie ein.

Lesen Sie auch Wartungsmodus unter WordPress: Erläuterung und Konfiguration

Wenn Sie möchten, können Sie die vielen Widgets für dynamische Veröffentlichungsdaten verwenden, um das Erscheinungsbild Ihrer Seite zu steuern.

Zum Beispiel, wenn Sie das Widget ändern  Beitragsinfokönnen Sie die Metadatenelemente steuern, die wie in der Veröffentlichung angezeigt werden ...

  • Autor
  • Erscheinungsdatum
  • Bemerkungen
  • Usw.

So erstellen Sie eine vollständige Website oder einen Blogpascher 10

Wenn Sie mit Ihrem Artikelmodell zufrieden sind, klicken Sie auf Veröffentlichen. Dann können Sie die Anzeigeoptionen so nutzen, dass diese einzigartige Vorlage nur für Beiträge in der Kategorie „Beyond News“ gilt:

  • Wählen Sie aus der catégorie
  • Wählen Sie die Kategorie Jenseits der Nachrichten

So erstellen Sie eine vollständige Website oder einen Blogpascher 11

Dann drücken Registrieren et schließen.

Jetzt sollten alle Ihre Blog-Beiträge ein Design haben, das zum Rest Ihrer Website passt.

Um die Sache zu beenden, gehen Sie zu Aussehen → Menüs und fügen Sie Ihre Blog-Seite zu Ihrem Navigationsmenü hinzu. Dazu können Sie im Abschnitt einen Link zur Kategorie „Beyond News“ hinzufügen Kategorien.

Erstellen Sie einfach Ihren Online-Shop

Laden Sie kostenlos WooCommerce herunter, die besten E-Commerce-Plugins, um Ihre physischen und digitalen Produkte auf WordPress zu verkaufen. [Empfohlen]

Seite 404

Schließlich müssen Sie die 404-Seite Ihrer Website erstellen. Auf der 404-Seite Ihrer Website sehen Besucher, ob sie einem fehlerhaften Link folgen oder versuchen, eine nicht vorhandene Seite zu besuchen.

Entdecken Sie auch unsere 5 Wordpress-Plugins, um eine bessere Fehler zu verwalten 404

Verwenden Sie zum Erstellen Ihrer 404-Seite den visuellen Builder von Elementor, um eine weitere eindeutige Vorlage hinzuzufügen. Verwenden Sie erst jetzt die Dropdown-Liste Wählen Sie Post Type auswählen 404 Seite :

So erstellen Sie eine vollständige Website oder einen Blogpascher 12

Fügen Sie die 404-Seitenvorlage wie oben beschrieben ein. Veröffentlichen Sie dann Ihre Vorlage, um Ihre Website zu vervollständigen.

Holen Sie sich jetzt Elementor Pro!

Fazit

Hier ist ! In diesem Handbuch erfahren Sie Schritt für Schritt, wie Sie mit Elementor eine vollständige Website erstellen. wenn Sie Kommentare oder Vorschläge, zögern Sie nicht, uns im reservierten Bereich zu informieren.

Sie können sich aber auch beraten unsere RessourcenWenn Sie mehr Elemente benötigen, um Ihre Projekte zur Erstellung von Internetseiten durchzuführen, konsultieren Sie unseren Leitfaden auf der WordPress-Blog-Erstellung oder der eine auf Divi: das beste WordPress-Theme aller Zeiten.

Aber in der Zwischenzeit Teile diesen Artikel in deinen verschiedenen sozialen Netzwerken

...

Dieser Artikel enthält Kommentare 0

Hinterlassen Sie einen Kommentar

Ihre E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind markiert *

Diese Website verwendet Akismet, um unerwünschte Inhalte zu reduzieren. Erfahren Sie mehr darüber, wie Ihre Kommentardaten verwendet werden.

Zurück nach oben
0 Aktien
Aktie
tweet
Registrieren