Mit dem Layout Editor individuelle Einstellungen vornehmen

  1. WordPress Praxis-Einführung Teil I: Wie bearbeite ich meine WordPress Webseite?
  2. WordPress Praxis-Einführung Teil II: Über Beitäge, Seiten und Portfolio Einträge.

Der Erweiterte Layout Editor. Dieser Editor ist ohne Programmierkenntnisse per Drag & Drop zu bedienen und ermöglicht Ihnen eine schnelle Bearbeitung Ihrer WordPress Webseite – auch ohne technisches Know-How. Im dritten Teil unserer WordPress Einführung beschreiben wir wichtige Funktionen, Tipps und Tricks rund um den erweiterten Layout Editor.

Das Enfold Theme und der Editor geben Ihnen eine Menge Möglichkeiten, um Ihr Design, z.B. Farben, Layout und Schriften, individuell anzupassen. Klicken Sie dazu ganz oben in der Taskleiste auf „Theme Optionen“.

Webseiten machen lassen von hhomepage

WordPress Theme Einstellungen von Enfold

Nun öffnet sich folgendes Menü:

Eigene Homepage machen lassen mit hhomepage | Schweiz

Das Menü der Designvorlage Enfold in WordPress

Hier können Sie nun zahlreiche Änderungen vornehmen und WordPress nach Ihren Wünschen anpassen. Gehen Sie z.B auf „General Layout“, um das Layout zu ändern, oder auf „General Styling“, um die Farben Ihrer Webseite anzupassen. Wenn Sie unter „General Styling“ etwas weiter runterscrollen, sehen Sie Ihre Webseite in unterschiedlichen Bereichen aufgegliedert.

WordPress Seiten erstellen lassen mit hhomepage

Schriftfarben, Schriftgrössen und Farben der WordPress Webseite anpassen

Sie können jeden Bereich nach Belieben anpassen. Es wird unterschieden zwischen:

  • Logo Area: Der oberste Bereich, der auf allen Seiten zu sehen ist – und meist das Erste, was Besucher auf Ihrer Seite sehen.
  • Main Content: Der Hauptteil bzw. das Herzstück der Seite.
  • Alternate Content: Hier können Sie einen weiteren Stil für den Main Content festlegen – und z.B. verschiedene Hintergrundfarben auf einer Seite verwenden.
  • Footer: Der untere Bereich einer Seite, funktioniert ähnlich wie eine Fussnote.
  • Socket: Der unterste Bereich einer Seite, direkt nach dem Footer bietet sich z.B. für das Copyright an.

Möchten Sie einen dieser Bereiche bearbeiten, klicken Sie einfach auf den entsprechenden Button.
Für mehr Einstellungsmöglichkeiten, besuchen Sie „Erweitertes Styling“. Dort finden Sie viele Optionen, um z.B. Layout-Elemente oder einzelne Fonts zu verändern.

Mit dem Enfold Layout Editor Seiten bearbeiten und neu erstellen

Mit dem Layout Editor ist es ziemlich leicht und unkompliziert neue Seiten zu erstellen und zu bearbeiten. Zum Öffnen des Editors haben Sie zwei Möglichkeiten:

Möglichkeit 1: Sie möchten eine neue Seite erstellen

Klicken Sie auf „Seiten – Erstellen“, wie Sie es in Teil II unserer WordPress-Reihe gelernt haben. Nun öffnet sich ein neues Fenster, mit der blauen Schaltfläche „Erweiterter Layout Editor“. Dort klicken Sie drauf.

Webseiten machen lassen von Hürlimann Homepages GmbH

Der erweiterte Layout Editor in WordPress Webseiten

Möglichkeit 2: Sie möchten eine bestehende Seite bearbeiten

Klicken Sie auf die Seite, die Sie bearbeiten möchten – und schon sehen Sie die selbe blaue Schaltfläche „Erweiterter Layout-Editor“. Wenn bei Ihnen dort „Standard-Editor“ steht, müssen Sie nichts weiter tun – dann sind Sie bereits im erweiterten Layout Editor.
Sobald Sie auf „Erweiterter Layout Editor“ geklickt haben, sehen Sie unter „Avia Layout Architekt“ eine neue Menüleiste mit verschiedenen Layout-Optionen bzw. „Layout Elementen“.

Webseiten & Webdesign erstellen lassen von hhomepage

WordPress-Seiten bearbeiten in Enfold

Layout Elemente bearbeiten

Mit den Layout Elementen können Sie Ihre Seite genau an Ihre Wünsche anpassen, in einzelne Abschnitte und Spalten unterteilen oder den Hintergrund bearbeiten. Wählen Sie ein gewünschtes Layout Element aus und ziehen Sie es einfach per Drag & Drop in das Textfeld. Dafür gehen Sie mit Ihrem Mauszeiger über das gewünschte Layout Element, klicken, halten den Mauszeiger gedrückt, gehen mit der Maus über das Textfeld und lassen die Maustaste los. Fertig! Auf dieselbe Art und Weise können Sie jedes Element im Textfeld verschieben.
Besonders praktisch: Sie können jedes Element duplizieren und sich somit einige Klicks sparen. Klicken Sie dazu mit Ihrer Maus auf das kleine Symbol in der Mitte der Taskleiste Ihres Elements.

Webseiten mit WordPress Editor erstellen lassen

Einzelne Sektionen der WordPress-Seite bearbeiten

Um ein Element zu bearbeiten, klicken Sie auf das Symbol rechts neben dem „Duplizieren-Symbol“.

Homepages erstellen lassen von hhomepage | Schweiz

Elemente in WordPress duplizieren

Dann öffnet sich ein Fenster, indem Sie eine Menge an Einstellungen vornehmen und z.B. die Farben oder den Spaltenabstand ändern können.

Homepages & Webdesign machen lassen von hhomepage

Abstände, Animationen und Farben einzelner Elemente anpassen

Layout Elemente: Hintergrund ändern mit „Farb-Sektion“

Die Farb-Sektion ist ein besonderes Layout Element, denn hier können Sie den Hintergrund Ihrer Webpage bearbeiten – und beispielsweise ein Foto oder sogar ein Video in den Hintergrund einfügen. Ziehen Sie dazu das „Farb-Sektion Element“ in das Textfeld und klicken Sie auf das Bearbeitungs-Symbol. In dem sich nun öffnendem Fenster klicken Sie auf „Section Background“ und wählen „Bild einfügen“ für ein benutzerdefiniertes Hintergrundbild. Sie können auch ein Hintergrund-Video einfügen – sogar per Link von YouTube oder Vimeo. Auch die Farbe können Sie hier ändern.

Günsige Webseiten erstellen lassen mit Hürlimann Homepages GmbH

Farb-Sektionen in WordPress bearbeiten

Sobald Sie Ihre gewünschten Änderungen vorgenommen haben, klicken Sie auf den blauen Button „Speichern“. Keine Sorge: Wenn Sie am Ende doch nicht zufrieden sind, können Sie Ihre Seite jederzeit wieder verändern und neu anpassen.

Mit einem Klick auf „Inhalts Elemente“ oder „Media Elemente“ können Sie weitere Einstellungen vornehmen.

Professionelle Webseiten in der Schweiz | hhomepage.ch

Inhalts- und Media-Elemente in WordPress

Inhalts-Elemente bearbeiten

Hier können Sie Ihrer Seite inhaltliche Elemente hinzufügen. Zum Beispiel:

  • Textblöcke
  • Icons
  • Trennlinien
  • Tabellen
  • Kommentare
  • Kontaktformulare
  • Kundenempfehlungen
  • u.v.m.

Das Prinzip folgt genau der Erstellung und Bearbeitung der Layout-Elemente. Klicken Sie auf das gewünschte Element und ziehen Sie es nach unten ins Textfeld.

Media Elemente bearbeiten

Hier können Sie u.a. folgende Elemente auswählen und hinzufügen:

  • Bilder
  • Videos
  • Galerien
  • Verschiedene Slider und Slideshows
  • Google Maps

Media Elemente: Slideshow erstellen

Eine Slideshow ist eine hervorragende Möglichkeit, um Besuchern verschiedene Inhalte und Bilder zu präsentieren. Ziehen Sie dazu das Element „Einfacher Slider“ ins Textfeld…

Webseite mit Media Elementen erstellen lassen | hhomepage

Slider in WordPress-Webseiten

…und klicken Sie auf das Bearbeitungs-Symbol. Dann öffnet sich ein Fenster, um Ihre Slideshow individuell anzupassen. Sie können nun die Bilder der Slideshow auswählen und hochladen, die Grösse der Slideshow oder den Slideshow-Übergang festlegen. Sie können auch entscheiden, ob Ihre Bilder automatisch wechseln sollen – oder der Besucher aktiv klicken muss, damit die Bilder wechseln.
Für ein automatisches Wechseln, klicken Sie auf das Textfeld neben „Autorotation aktiv?“ und wählen „Ja“ aus. Nun wechseln Ihre Bilder wie von Zauberhand.

Professionelle Webseiten mit WordPress machen lassen

Slider-Autorotation in WordPress Webseiten

Tipp: Unter „Slideshow-Autorotations-Dauer“ können Sie genau auswählen, wie viele Sekunden ein Bild angezeigt werden soll.

Weitere Gestaltungsmöglichkeiten

Auf der rechten Seite finden Sie neben den bereits bekannten Seiten-Einstellungen wie „Vorschau“, „Templates“ und „Eltern“ ( hier mehr dazu lesen), zusätzlich das Menü „Gestaltung“. Dort können Sie mit wenigen Klicks das gewünschte Layout für verschiedene Elemente der Webpage ändern.

Websites machen lassen von hhomepage

Sidebar, Transparenz der Header und mehr in der WordPress Designvorlage Enfold

Wir hoffen Sie hatten Ihren Spass mit unserem kleinen Tutorial.

Teilen Sie diesen Beitrag in Ihren Netzwerken