Akkordeon-Element

Was ist ein Akkordeonelement?

Ein Akkordeon ist eine vertikal gestapelte Liste von Überschriften, die Besucher durch Anklicken erweitern oder reduzieren können. Auf diese Weise können Kunden steuern, welche Informationen sie sehen, und Ihre Seite bleibt übersichtlich und leicht zu navigieren.

Ein häufiger Anwendungsfall für Akkordeondesign ist die FAQs Seite, wo mehrere Fragen aufgelistet sind und die Zuschauer einfach auf eine Frage klicken können, um die gesuchte Antwort anzuzeigen:

So fügen Sie das Akkordeon-Element in GemPages hinzu

Um das Akkordeon-Element zu Ihrer Seite hinzuzufügen, befolgen Sie bitte die folgenden Schritte:

Schritt 1:: In dem GemPages Dashboard, wählen Sie Ihre Seite aus, um den Editor aufzurufen.

Sobald der Vorgang abgeschlossen ist, werden die Konfigurationen des Akkordeonelements in der linken Seitenleiste angezeigt:

Konfigurieren des Akkordeonelements

Das Akkordeon-Element in GemPages ist vollständig anpassbar. Die Einstellungen sind unterteilt in zwei Hauptregisterkarten: Einstellungen und Erweitert.

1. Die Registerkarte „Einstellungen“

Artikelverwaltung

• So fügen Sie ein Element hinzu: Klicken Sie einfach auf das Weitere hinzufügen . 
• So duplizieren Sie ein Element: Bewegen Sie den Mauszeiger über die gewünschte Folie und klicken Sie auf das Duplikatssymbol. 
• So entfernen Sie ein Element: Bewegen Sie den Mauszeiger über die entsprechende Folie und klicken Sie auf das Papierkorbsymbol.

Gegenstandsstil

• Hintergrund: Hintergrundfarbe für jedes Element (einschließlich des reduzierten und erweiterten Zustands des Elements) im Akkordeon.

• Rahmen: Passen Sie Farbe, Dicke und Kontur des Rahmens an.

• Ecke: Passen Sie den Eckenradius für abgerundete Kanten an.

• Schatten: Fügen Sie Schatteneffekte für Tiefe hinzu.

Artikelkopf

• Titelsymbol: Die Einstellungen des Symbols der Akkordeon-Kopfzeile.

• Titel: Der Textstil des Kopfzeilentitels.

• Symbol erweitern: Die Einstellungen für das erweiterte Symbol jedes Elements im Akkordeon.

• Höhe: Die Höhe der Akkordeon-Überschrift. Standardmäßig ist die Höhe auf „Auto“ eingestellt, d. h. die Höhe wird automatisch an den Inhalt der Überschrift angepasst. 

• Hintergrund: Ändern Sie die Hintergrundfarbe der Kopfzeile.

• Polsterung: Die Polsterung der Akkordeon-Überschrift erzeugt den inneren Abstand zwischen Rand und Inhalt.

• Rahmen: Kopfzeilenrahmen anpassen.

• Ausrichten: Ausrichtung des Header-Inhalts (einschließlich Header-Symbol und Titel).

Artikelinhalt

• Polsterung: Die Polsterung des Inhaltsbereichs für jedes Akkordeonelement

Artikelabstand

• Abstand: Der Abstand zwischen den einzelnen Akkordeonelementen. Standardabstand = 16px

Ergebnisse

• Hover-Element: Die Einstellungen für den Akkordeon-Kopfzeilenstil beim Darüberfahren mit der Maus.

• Kopfzeile erweitern: Die Einstellungen für den Akkordeon-Kopfzeilenstil im erweiterten Zustand. Durch Klicken auf die Einstellung „Erweitern“ wird das Popover geöffnet, das die Einstellungen für den Status „Erweitern“ enthält.

Größe

• Breite: Größe des tatsächlichen Inhalts innerhalb des Akkordeonelements.

Shape

Diese Formeinstellungen gelten für die Hülle des Akkordeons.

• Grenze
• CORNER
• Shadow

Anzeigebedingung

• Erweiterungsmodus: Wählen Sie die Anzahl der Artikel aus, die ein Kunde gleichzeitig öffnen kann.
• Im Einzelmodus können sie nur ein Element öffnen.
• Mit der Mehrfachoption können Sie mehrere Elemente gleichzeitig öffnen.
• Automatisch erweitern: Legen Sie fest, dass eines der Akkordeonelemente standardmäßig zunächst geöffnet ist.

Wenn diese Option auf „Ja“ gesetzt ist, wird die Einstellung zur Auswahl des standardmäßigen erweiterten Elements angezeigt. Wählen Sie das Element aus, das standardmäßig erweitert ist. Wenn standardmäßig mehrere Elemente geöffnet sind, trennen Sie diese durch ein Komma.

Ausrichten

• Die Ausrichtung wird deaktiviert, wenn die Breite des Elements 100 % beträgt.
• Wenn nicht, ist die Standardausrichtungsoption „Mittig ausrichten“.

2. Die Registerkarte „Erweitert“

Für erweiterte Anpassungen navigieren Sie bitte zu Registerkarte Erweitert und befolgen Sie die Anweisungen in Dieser Artikel.