Hinweise und Vorteile einrichten

Mit diesem Block zeigst du deine Stärken: Die "Hinweise und Vorteile" sind zwei Layouts, die mit Überschriften, Bildern und aufgelisteten Punkten arbeiten. Das erste Layout betont einzelne Hinweise mit Symbolen, das zweite zeigt mehrere Vorteile in einem Gitter neben einem Foto.

Voraussetzungen

Du bearbeitest einen Block im Editor einer Website-Seite. Es gibt keine weiteren Voraussetzungen.

So gehst du vor

Grundlage: Kopfbereich ausfüllen

Beide Layouts beginnen mit den gleichen Angaben:

1. Fülle das Feld Kleine Überschrift aus, um einen kurzen Titel über der Hauptüberschrift zu setzen (Optional – lasse das Feld leer, wenn du keinen brauchst).
2. Trage in Überschrift den Titel des Blocks ein – dieser ist sichtbar auf der Seite.
3. Schreibe die Einleitung – ein kurzer Text, der die kommenden Punkte einleitet.

Layout 1: Einzelne Hinweise hervorheben

Dieses Layout stellt jeden Hinweis mit eigenem Symbol dar. So richtest du es ein:

4. Klappe den Bereich Aufzählungspunkte auf.

5. Klicke Punkt hinzufügen, um deinen ersten Hinweis zu erstellen.

6. In dem neuen Eintrag füllst du aus:

   • Text: Der Inhalt des Hinweises
   • Symbol: Klicke das Feld an und wähle ein Icon aus – dies erscheint neben dem Text

7. Füge weitere Punkte auf die gleiche Weise hinzu. Du kannst jeden Punkt nach oben oder unten verschieben oder löschen – nutze die Pfeile und das X neben dem Punkt.

8. Klappe Bild und Eck-Symbol auf:

   • Lade ein Bild hoch oder wähle eines aus deinen Dateien (das Format ist 4:3, zum Beispiel 1200 × 900 Pixel)
   • Wähle optional ein Eck-Symbol, das in der Ecke des Bildes angezeigt wird

9. Im Bereich Schaltfläche (optional):

   • Schreibe den Text der Schaltfläche – zum Beispiel "Mehr erfahren"
   • Setze das Ziel: Klicke das Feld an und wähle eine Seite deiner Website oder eine externe Internetadresse
   • Bestimme den Stil der Schaltfläche (Farbe, Füllung, Größe)

10. Klicke auf Weitere Optionen und wähle dort:

    • Bild links oder Bild rechts – wo das Bild auf der Seite stehen soll
    • Optionale Blockbezeichnung – ein Name, unter dem du den Block im Editor wiedererkennst

Layout 2: Vorteile im Gitter

Dieses Layout zeigt mehrere Vorteile in Spalten neben oder unter einem Bild. So richtest du es ein:

4. Klappe Vorteile auf.

5. Klicke Vorteil hinzufügen, um einen neuen Eintrag zu erstellen.

6. Für jeden Vorteil füllst du aus:

   • Titel: Eine kurze Überschrift für den Vorteil
   • Text: Eine kurze Beschreibung (optional)
   • Symbol: Klicke das Feld an und wähle ein Icon

7. Verschiebe Vorteile mit den Pfeilen auf die richtige Position. Du kannst jeden Vorteil duplizieren (Symbol mit zwei Blättern) oder löschen.

8. Klappe Foto und Abzeichen auf:

   • Lade ein Bild hoch – je nach Bildformat (Hochformat 4:5, Querformat 16:10 oder Quadratisch 1:1) wird das Bild passend zugeschnitten
   • Im Feld Text im runden Abzeichen schreibst du optional einen Text, der in einem runden Label über dem Bild steht (zum Beispiel "Neu" oder "Top")

9. Öffne Weitere Optionen für diese Einstellungen:

   • Bild links oder Bild rechts
   • Spalten im Gitter: Wie viele Vorteilskarten nebeneinander stehen sollen (1, 2 oder 3) – auf dem Handy stehen sie immer untereinander
   • Bildformat: Wähle das Format des Fotos (Hochformat, Querformat oder Quadratisch)
   • Drehung in Grad: Das Abzeichen über dem Bild um bis zu 20 Grad drehen (oder um bis zu 20 Grad nach links)
   • Blockbezeichnung (optional)

10. Speichere die Änderungen – der Block wird auf der Seite angezeigt.

Aufbau der Eingabebereiche

Kopf (beide Layouts):

• Kleine Überschrift: Text über der Hauptüberschrift, wird mit Markdown formatiert
• Überschrift: Haupttitel des Blocks
• Einleitung: Einführungstext unter der Überschrift

Aufzählungspunkte (Layout 1 – Hinweise):

• Sortierbare Liste: Jeder Punkt hat einen Text und ein Icon
• Pfeile zum Verschieben nach oben oder unten
• X-Schaltfläche zum Löschen

Vorteile (Layout 2 – Gitter):

• Sortierbare Liste: Jeder Eintrag hat Titel, Text und Icon
• Pfeile zum Verschieben
• Duplizieren-Schaltfläche (zwei Blätter)
• X-Schaltfläche zum Löschen

Bild und Eck-Symbol (beide Layouts):

• Bildeditor mit Zuschnitt
• Icon-Wähler für ein optionales Symbol

Schaltfläche (nur Layout 1):

• Text: Was auf der Schaltfläche steht
• Ziel: Link zu einer Seite oder externen Adresse
• Stil: Aussehen der Schaltfläche (Farbe, Rahmen, Größe)

Weitere Optionen (beide Layouts):

• Bild-Position (links oder rechts)
• Blockbezeichnung: Der Name erscheint nur im Editor, hilft dir aber, den Block wiederzufinden

Was danach passiert

Die Änderungen werden sofort auf deiner Website-Seite angezeigt. Du kannst jederzeit zurück in die Einstellungen gehen und alles bearbeiten – nichts wird gelöscht, bis du es selbst tust.

Um den Block ganz zu entfernen, nutze die Löschfunktion im Seiteneditor. Weitere Informationen zum Arbeiten mit Blöcken findest du unter Block auf einer Seite einrichten.

Tipps und Hinweise

• Symbole wählen: Die Icons stammen aus der Font Awesome Duotone-Sammlung. Du kannst nach Name suchen, zum Beispiel "star" für einen Stern oder "heart" für ein Herz.
• Markdown in Überschriften: In der Überschrift und Einleitung kannst du fett, kursiv oder Code formatieren – nutze diese Möglichkeiten sparsam.
• Bilder richtig zuschneiden: Der Editor zeigt dir die Schnittlinie. Verwende Fotos, die groß genug sind – kleine Bilder wirken pixelig.
• Layout 2 auf Handys: Wenn du 3 Spalten wählst, werden auf kleinen Bildschirmen automatisch weniger Spalten nebeneinander angezeigt – auf dem Handy steht jeder Vorteil allein. Das ist beabsichtigt und passt sich automatisch an.