You are using Internet Explorer 11 or earlier, this browser is no longer supported by this website. We suggest to use a modern browser.

UCP Pattern Library
UCP Pattern Library
UCP Pattern LibraryUCP Pattern LibraryUCP Pattern Library
  • English
  • Pattern Library
  • flexible
    • English
  • Startseite
  • Pattern nach Typus
  • Navigation
  • Accordion (07_01)

Accordion (07_01)

Das "Accordion" Modul eignet sich optimal, um auf Landingpages/Verteilerseiten und Artikeldetailseiten im Contentbereich eine große Anzahl an Inhalten übersichtlich untereinander darzustellen.

Durch Klick auf die einzelnen Container-Titel werden diese ausgeklappt und die zuvor hinterlegten Inhalte werden sichtbar. Im Detail besteht das "Accordion" Modul aus einer Headline, den - möglichst eindeutig benannten - Container-Titeln und den variablen, innerhalb des Containers eingebundenen Modulen.

Beispiel Seitenansicht

Das Modul ist orange markiert

Accordion - Modulansicht

Accordion im Contentbereich

So funktioniert das Modul

Das Modul besteht aus folgenden Komponenten:
1. ÜberschriftÜberschrift für das Accordion-Modul
2. Accordion-Elemente- beliebig viele

Darstellungsoptionen:
- Bei Aufruf der Seite das erste Accordion-Element geöffnet anzeigen: ja/nein
- Immer nur ein Accordion-Element geöffnet anzeigen: ja/nein
TitelTitel wird auf jedem Element angezeigt
ModuleFolgende Module können in einem Accordion eingefügt werden (auch mehrere pro Accordion):

Teaser: Download Teaser, Event Teaser, Figure Teaser, Press Teaser, Quotation Teaser, Text Teaser, Text Teaser List, Image Teaser, Image Teaser Slider, Contact Teaser, Text + Image Teaser
Kombimodule: Image + Quotation, Text + Downloads, Text + Image, Text + Link list, Text + Quotation, Text + Video
Medien: Image, Image Gallery, Images Download, PDF Gallery, Video, Video List,
Weitere: Organizational Chart, Standard Text, Table, Link List

So funktioniert das Modul

Das Modul besteht aus folgenden Komponenten:
1. ÜberschriftÜberschrift für das Accordion-Modul
2. Accordion-Elemente- beliebig viele

Darstellungsoptionen:
- Bei Aufruf der Seite das erste Accordion-Element geöffnet anzeigen: ja/nein
- Immer nur ein Accordion-Element geöffnet anzeigen: ja/nein
TitelTitel wird auf jedem Element angezeigt
ModuleFolgende Module können in einem Accordion eingefügt werden (auch mehrere pro Accordion):

Teaser: Download Teaser, Event Teaser, Figure Teaser, Press Teaser, Quotation Teaser, Text Teaser, Text Teaser List, Image Teaser, Image Teaser Slider, Contact Teaser, Text + Image Teaser
Kombimodule: Image + Quotation, Text + Downloads, Text + Image, Text + Link list, Text + Quotation, Text + Video
Medien: Image, Image Gallery, Images Download, PDF Gallery, Video, Video List,
Weitere: Organizational Chart, Standard Text, Table, Link List

Das Modul kann in den folgenden Seitenbereichen und Templates verwendet werden:

Startpage
stage
content
Content Page
stage
main content
right
bottom
Flexible Layout
full-width
default
default with sidebar right
sidebar
sidebar
default with sidebar left
Der blaue Bereich gibt an, dass das Modul in dieser Content Area anwendbar ist.

Vermaßte Screenshots

Accordion: Vermaßung Desktop
Desktop
Accordion: Vermaßung Tablet
Tablet
Accordion: Vermaßung Mobile
Mobile
Abstände Guide

Erläuterung: Abstandswerte, die in den vermaßten Screenshots verwendet werden

Das Modul kann in folgenden Themes eingesetzt werden:

  • Internet
  • Intranet
  • Suite
Der blaue Bereich gibt an, dass das Modul in diesem Theme anwendbar ist.

So sieht das Modul aus

Accordion (07_01)

Beispielseite

arrow-down UCP Pattern Library

  • brandfactory
  • media pool - das Digital Asset Management System für thyssenkrupp
  • CMS Login

Folgen Sie uns

  • Global Corporate Website
© thyssenkrupp AG 2023
  • Sitemap
  • Impressum
  • Rechtliche Hinweise
  • Teilen tk-share
    FacebookTwitter Email LinkedIn