Anleitung
Ortsvereins-Website
Elementor
Überblick Editor

Führung durch den Elementor Editor

Sobald Sie auf „Bearbeiten mit Elementor“ bei Ihrem Beitrag oder Ihrer Seite geklickt haben, öffnet sich der Elementor Editor. Hier eine kleine Übersicht aller für Sie wichtigen Bereiche des Editors:

3 Hauptbereiche Übersicht
1

Vorschau-Bereich (rechts)

  • Seiten / Beitragsansicht - Vorschau in Echtzeit
  • Grundsätzlicher Seiten- und Beitragsaufbau:
    • Abschnitt (umfassender Container), umschließt alle Spalten mit deren Inhalt
    • Spalte(n) (horizontale Layout-Aufteilung), umschließt / umschließen die inhaltlichen Elemente
    • Elemente (einzelne inhaltliche Elemente, z.B. Textblock oder Bild oder Galerie,...), davon Sonderfall "Innerer Abschnitt" (weiteres Struktur-Element, kein Inhaltselement!)
  • Abschnitte und Elemente werden pink hervorgehoben bei Mausover & Klick
  • Spalten werden grau hervorgehoben bei Mausover & Klick
  • Die einzelnen bearbeitbaren Abschnitte, Spalten und Elemente sind anklickbar - der Editor links ändert sich jeweils entsprechend immer parallel, je nachdem was angeklickt wird
screen-ele-ueberblick-01neu
2

Editor-Bereich (links)

  • Verändert sich je nachdem, was rechts angeklickt wird, in spezifischen Editor mit weiteren Einstellungs-Möglichkeiten (siehe jew. Titel oben mittig, z.B. "Button bearbeiten")
  • "Elemente"-Bereich (früher "Widget"-Bereich) mit allen einbindbaren inhaltlichen Elementen, z.B. Text, Titel, Bild, Galerie, Icon-Liste, Button, Innerer Abschnitt, Video, HTML, Icon, Trenner u.v.m., praktische Elemente-Suchfunktion
screen-ele-ueberblick-02neu
3

Horizontale Funktionsleiste (oben)

  • Oben links Elementor-Menü (mit Verlauf), Element-hinzufügen-Funktion (früher "Widgets"), Website-Einstellungen, Struktur (früher "Navigator") und Notizen
  • Oben mittig Seiten- bzw. Beitrags-Einstellungen sowie Responsiv-Einstellungen (Dektop / Tablet Smartphone)
  • Oben rechts Icon-Menü mit Elementor-Neuigkeiten, Finder, Hilfe, Vorschau-Funktion (früher "Seite ansehen")
  • Oben ganz rechts "Veröffentlichen"-Button  (früher "Aktualisieren"-Button) und weiteren Speicheroptionen
screen-ele-ueberblick-04neu
Vorschau-Bereich (rechts)
1

Kopfzeile

  • Globale Kopfzeile ("Header"), auf der kompletten Ortsvereins-Website mit allen Unterseiten eingebunden - egal auf welcher Seite ich sie bearbeite, ändert sie sich automatisch für alle Seiten auf einmal
  • Immer automatisch ganz oben positioniert
  • Enthält Logo & Navigations-Menü
  • Muss man in der Regel NICHT bearbeiten
  • Beim Aufruf des Editors standardgemäß nicht zur Bearbeitung aktiviert (Erst bei Klick auf Kopfzeile lädt Editor neu)
screen-ele-ueberblick-05neu
2

Abschnitt

  • Umfassender Container, umschließt Spalten mit deren Inhalt, pink umrahmt bei Mausover
  • Oben mittig jew. pinker "Griff" mit 3 Icons ("Abschnitt hinzufügen", "Abschnitt bearbeiten", "Abschnitt löschen")
  • Beim Griff oben mittig Rechtsklick-Menü mit Optionen wie Abschnitt duplizieren, kopieren & einfügen, löschen
screen-ele-ueberblick-06neu
3

Spalte(n)

  • Horizontale Layout-Aufteilung, umschließt alle inhaltlichen Elemente
  • Jew. oben links Elementor-Spalten-Icon zum anklicken (Editor ändert sich entsprechend)
  • Spalten-Icon mit Rechtsklick-Menü mit Optionen wie Spalten duplizieren, kopieren & einfügen, löschen
screen-ele-ueberblick-07neu
4

Innerer Abschnitt

  • Zusätzliches inneres Abschnitt-Element, kann wie Elemente in Spalte(n) des umschließenden Abschnitts eingefügt werden
  • umschließt wiederum seine eigene(n) innere(n) Spalte(n) mit deren Elementen
  • Oben mittig jew. Griff mit 2 Icons (Inneren Abschnitt bearbeiten, Inneren Abschnitt löschen)
  • Beim Griff oben mittig Rechtsklick-Menü mit Optionen wie Inneren Abschnitt duplizieren, kopieren & einfügen, löschen
screen-ele-ueberblick-08neu
5

Innere Spalte(n)

  • Horizontale Layout-Aufteilung des Inneren Abschnitts, umschließt alle Elemente im Inneren Abschnitt
  • Jew. oben links dunkelgraues Spalten-Symbol zum Anklicken (Editor ändert sich entsprechend, sodass Einstellungen für die Spalte vorgenommen werden können)
  • Auf dem Spalten-Symbol Rechtsklick-Menü mit Optionen wie Spalten duplizieren, kopieren & einfügen, löschen
screen-ele-ueberblick-09neu
6

Elemente (früher "Widgets")

  • jew. oben rechts Stift-Icon zum Anklicken (Editor links ändert sich entsprechend)
  • Elemente-Texte bitte nicht rechts im Vorschau-Bereich bearbeiten, sondern immer links im Editor bearbeiten!
  • Welche Elemente es gibt und wie man diese einbindet und anpasst, finden Sie unter "Elemente Überblick"
screen-ele-ueberblick-10neu
7

Neu-hinzufügen-Bereich (gestrichelt)

  • Fläche zum Einfügen neuer Abschnitte / innerer Abschnitte und gespeicherter Templates aus der Template-Bibliothek
  • Immer automatisch oberhalb der Fußzeile positioniert
screen-ele-ueberblick-11neu
8

Fußzeile

  • Globale Fußzeile ("Footer"), auf der kompletten Ortsvereins-Website mit allen Unterseiten eingebunden - egal auf welcher Seite ich sie bearbeite, ändert sie sich automatisch für alle Seiten auf einmal
  • Immer automatisch ganz unten positioniert
  • Enthält Kontaktdaten und Footer-Menü
  • Muss man in der Regel NICHT bearbeiten
  • Beim Aufruf des Editors standardgemäß nicht zur Bearbeitung aktiviert (Erst bei Klick auf Fußzeile lädt Editor neu)
screen-ele-ueberblick-12neu
Horizontale Funktionsleiste (oben)
1

Elementor-Menü (E-Icon oben links)

  • Theme-Builder: Hier finden wir die universell eingesetzten Website-Teile, wie z.B. Footer, Header
  • Verlauf: Funktionen zur Sicherung / Wiederherstellung vorangegangener Arbeitsschritte
    Anleitung zur Sicherung und Wiederherstellung von Inhalten
  • Benutzer-Einstellungen: Für Ortsvereins-Website unrelevant
  • Tastaturkürzel:
    Hilfreiche Tastenkombinationen für einen leichteren Arbeitsfluss
  • Zu WordPress wechseln: Hier geht es zurück in die WordPress-Admin-Ansicht
screen-ele-ueberblick-13neu
2

Elemente hinzufügen (Plus-Icon)

  • Favoriten: Wichtigste Elemente (früher "Widgets"), diese decken min. 90% des einzubindenden Inhalts ab. Weitere Elemente kann man sich selbst im Elemente-Bereich per Rechtsklick auf das gewünschte Widget zu seinen eigenen Favoriten hinzufügen
  • Grundlegend, Pro, Generell, Website,... sind weitere Elemente-Gruppen
  • Vorsicht: Einige der Elemente sind nicht automatisch datenschutzsicher!
screen-ele-ueberblick-14neu
3

Website-Einstellungen

  • Website-Einstellungen: Hier sind alle globalen Designvorgaben der Seite hinterlegt: Farben, Schriften, Formatierungen, Logo, Favicon, Layout-Breite, Schwellwerte für die Responsivität
screen-ele-ueberblick-15neu
4

Struktur (früher "Navigator")

  • Strukturelle Übersicht (im Gegensatz zum Vorschaubereich, wo die Übersicht visueller Natur ist) der ganzen Seite / des ganzen Beitrags mit Hierarchie-Ebenen
  • Aufruf über "Struktur"-Icon oben links in der horizontalen Funktionsleiste, 4. Icon von links
  • Mehr Infos zur Struktur-Ansicht ganz unten in diesem Beitrag
screen-ele-ueberblick-03neu
5

Mittige Seiten- oder Beitrags­einstellungen (Zahnrad-Symbol)

screen-ele-ueberblick-19neu
6

Mittiges Responsiv-Menü

  • Responsiv-Optionen: Hier kann die Seite in den 3 Schwellwert-Bildschirmbreiten "Desktop", "Tablet" und "Mobile" angsehen, überprüft und bearbeitet werden.
screen-ele-ueberblick-18neu
7

Icon-Menü oben rechts

  • Elementor-News (Megaphon-Icon): Hier gibt es immer wieder Informationen zu Neuerungen in Elementor
  • Finder (Lupe-Icon): Hier kann man per Stichwortsuche andere Seiten im Editor direkt laden, ohne den Umweg übers WordPress Dashboard nehmen zu müssen
  • Hilfe (Info-Icon): Link zum Elementor-Help-Center
  • Seite anzeigen (Auge-Icon): Hier kann man sich die Seite zum aktuellen Speicherstand im Frontend (User-Ansicht) anschauen
screen-ele-ueberblick-16neu
8

Veröffentlichen-Button (früher "Aktualisieren-Button"")

  • Dies ist der wichtigste Button im ganzen Editor, da hiermit alle Änderungen gespeichert werden
  • Button ändert sich von dunkelgrau auf PINK, sobald Änderungen an der offenen Seite vorgenommen wurden, so kann man immer sehen, wenn es was zum Speichern gibt (wird nach dem Speichern immer wieder dunkelgrau)
  • Mit dem nach unten gerichteten Pfeil rechts neben dem Aktualisieren-Button hat man noch die Möglichkeit, die gesamte Seite als Template zu sichern, wenn man hier einen Zwischenstand archivieren möchte, auf den man ggf. irgendwann nochmal zurückgreifen können mcöhte
screen-ele-ueberblick-17neu
Struktur - früher "Navigator" (flexibel positionierbar)
1

Allgemeine Infos

  • Alle Abschnitte, Spalten, Inneren Abschnitte, Inneren Spalten und Elemente sind auch hier anklickbar (Editor links ändert sich jew. entsprechend zur Bearbeitung)
  • Manchmal sind manche Griffe durch Überlagerungen der Abschnitte nicht klickbar, lange Seiten werden schnell in der Vorschau-Ansicht unübersichtlich oder Elemente lassen sich nicht genau dort ablegen, wo man es gerne möchte - in allen Fällen ist die Struktur-Ansicht hier sehr hilfreich, da auch hier Elemente verschoben, umstrukturiert etc. verden können!
  • Die Struktur-Ansicht ist flexibel positionierbar oder auch deaktivier- und reaktivierbar (Struktur-Icon oben links)
screen-ele-ueberblick-20neu