Anleitung
Ortsvereins-Website
Elementor
Überblick Elemente

Das Button-Element

Bevor Sie das Button-Element in Elementor bearbeiten können, müssen Sie dieses zuerst in die Seite oder den Beitrag eingefügt haben. Wie dies geht, zeigt unsere Anleitung „Elemente einfügen“ .

Inhalt bearbeiten
1

Button-Text eingeben / ändern

  • Benutzen Sie links im Editor-Bereich das Titel-Feld, um Ihre Überschrift einzugeben / zu ändern
  • Optional: Mit dem Zylinder-Symbol oben rechts in der Ecke des Titel-Felds sind auch dynamische Inhalte auswählbar, wie z.B. der Seiten-Titel. Diese Option brauchen Sie in den meisten Fällen jedoch nicht.
2

Link einfügen

  • Ins Link-Feld Linkadresse mit https://... eingeben
  • Link Optionen - Auf Zahnrad-Symbol rechts neben Link-Feld klicken: Es öffnen sich die Link-Optionen:
    • Bei externen Links, die von der Ortsverein-Website wegführen, bitte Häkchen setzen bei "Link in neuem Fenster öffnen"
    • Bei seiten-internen Links sind keine Link-Optionen notwendig.
  • Optional: Mit dem Zylinder-Symbol oben rechts in der Ecke des Link-Felds sind auch dynamische Inhalte auswählbar, wie z.B. der Seiten- oder Beitrags-Link. Diese Option brauchen Sie in den meisten Fällen jedoch nicht.
3

Ausrichtung

  • Ausrichtung wählen: Linksbündig, rechtsbündig, mittig oder "ausgerichtet" (über die komplette Seitenbreite)
  • Vorsicht bei Option "ausgerichtet" - dies sieht in Kombi mit einem Icon nicht schön aus, weil der Icon nicht am Text anheftbar ist und so unschöne optische Lücken entstehen
4

Icon auswählen (wenn gewünscht)

  • Standardmäßig sind im Button-Element noch keine Icons hinterlegt
  • Wenn ein Icon gewünscht ist, klicken Sie bei Icon auf das Symbol mit dem schwarzen Punkt ("Icon Bibliothek") - es öffnet sich die Icon Bibliothek:
    • Icon auswählen
    • Auf pinken Einfügen-Button klicken
  • Auch eigene Icons sind hochladbar als .svg Datei:
    • Einfach statt auf das Punkt-Symbol links daneben auf das Symbol mit der Festplatte mit Pfeil nach oben ("SVG hochladen") klicken
    • Es öffnet sich die Mediatheak, hier kann die SVG-Datei hochgeladen und ausgewählt werden.
  • Wählen Sie die Icon-Position "vorher" oder "nachher"
  • Wählen Sie den Icon-Abstand zum Buttontext
5

Andere Optionen

  • Alle anderen Optionen werden in der Regel nicht benötigt.
6

Speichern

  • Zum Speichern der Einstellungen im Editor oben rechts auf den pinken "Veröffentlichen" - Button klicken (färbt sich wieder dunkelgrau, dann ist alles gespeichert)
  • Icons im Button-Element werden automatisch in der Größe des Button-Textes dargestellt und können in der Größe NICHT separat angepasst werden!
Stil bearbeiten
1

Typographie

  • Standardgemäß, wenn man nichts weiter einstellt, nimmt das Button-Element automatisch die in den Website-Einstellungen global hinterlegten Text-Einstellungen für Buttons.
  • Um ein einheitliches Layout der Ortsvereins-Website zu gewährleisten, und eine übersichtliche Überschriften-Hierarchie innerhalb der Seite zu gewährleisten, ist anzuraten, im Wesentlichen diese Standard-Einstellungen beizubehalten und nur in Ausnahmefällen Buttons ein anderes Schriftbild zu geben
  • Wenn ein anderes Schriftbild explizit gewünscht ist, stehen auch die Typographie-Einstellungen zur Verfügung (Icon mit Stift) - alle Optionen hierfür finden Sie in unserer Anleitung "Typographie-Einstellungen"
2

Normal / Hover

  • Alle folgenden Einstellungen können jeweils für den normalen Button-Modus vorgenommen werden oder für den hover-Modus (bei Mausover)
  • Mit dem Normal / Hover Switcher können Sie zwischen den jew. Einstellungen im Editor hin- und her schalten.
  • Der Hover-Modus übernimmt automatisch alle Formatierungen des Normal-Modus, sofern nichts extra für Hover eingetragen wurde
3

Textfarbe und (Hintergrund-)Farbe

  • Standardgemäß, wenn man nichts weiter einstellt, nimmt das Button-Element automatisch die in den Website-Einstellungen global hinterlegten Standard-Farben für Buttons (normal & hover).
  • Um ein einheitliches Layout der Ortsvereins-Website zu gewährleisten, ist anzuraten, im Wesentlichen diese Standard-Einstellungen beizubehalten und nur in Ausnahmefällen Buttons eine andere Text- und Hintergrund-Farbe zu geben
  • Wenn andere Farben explizit gewünscht sind, gibt es jeweils folgende zwei Möglichkeiten (gilt für Textfarbe und Farbe beim klassischen Hintergrund-Typ):
    • Per Vorgabe (Weltkugel-Icon) kann man auf die in den Website-Einstellungen angelegten "Globalen Farben" zurückgreifen, um sicherzustellen, dass man immer den selben Farbton verwendet
    • Alternativ steht auch die Farbpalette zur Verfügung (Icon mit rot durchgestrichenem farblosem Quadrat, solange noch keine Farbe hinterlegt ist / farbiges Quadrat, wenn bereits eine Farbe hinterlegt ist)
4

Andere Optionen

  • Alle anderen Optionen werden in der Regel aus den Globalen Einstellungen übernommen und hier nicht benötigt.
5

Speichern

  • Zum Speichern der Einstellungen im Editor oben rechts auf den pinken "Veröffentlichen" - Button klicken (färbt sich wieder dunkelgrau, dann ist alles gespeichert)
Erweitert bearbeiten
Anleitung "Erweiterte Einstellungen"