Akkordeon mit Rich-Content-Editor hinzufügen

Freigeben Version: Yokohama

Aktualisiert 30. Januar 2025

6 Minuten Lesedauer

Fügen Sie dem Canvas eine Akkordeon-Komponente hinzu, um Inhalte zu entwerfen, die erweitert oder reduziert werden können.

Vorbereitungen

Erforderliche Rolle: sn_cd.content_manager

Füllen Sie die Formularfelder „Neuer Inhalt“ aus. Siehe Erstellen Sie Rich Content

Erstellen Sie das Seitenlayout mit Modulen oder Spalten.

Module sind vordefinierte Inhaltslayouts, die aus Header, Absatztext und Bildern bestehen. Siehe Fügen Sie mit dem Rich-Content-Editor vordefinierte Inhaltslayouts hinzu
Spalten sind Container, mit denen Sie ein anwenderdefiniertes Layout definieren können. Siehe Fügen Sie mit dem Rich-Content-Editor Spalten hinzu

Prozedur

Navigieren Sie zum Canvas, indem Sie auf der Registerkarte Design des Formulars „ Neuer Inhalt“ die Schaltfläche Editor öffnen wählen.
Ziehen Sie die Akkordeonkomponente per Drag-and-Drop in die Canvas.

Konfigurieren Sie das Verhalten der Akkordeonkomponente und das Umschalter-/Schaltflächendesign, und fügen Sie weitere Bereiche hinzu.

Navigieren Sie zu Einstellungen > Eigenschaften Abschnitt zum Konfigurieren der Akkordeonkomponente:

Tabelle : 1. Einstellungen für Akkordeoneigenschaften
Einstellungsfeld	Beschreibung
Verhalten des Bereichs
Erweitern Sie den ersten Bereich beim Laden	Wenn Sie diese Option auswählen, wird das Akkordeon mit dem Inhalt im ersten Bereich geladen. Wenn Sie diese Option deaktivieren, wird das Akkordeon bei geschlossenen Bereichen geladen.
Zulassen, dass mehrere Bereiche geöffnet sind	Wenn Sie diese Option auswählen, können Mitarbeiter mehrere Bereiche gleichzeitig erweitern. Wenn Sie diese Option deaktivieren und ein Mitarbeiter einen Bereich erweitert, wird der aktuell erweiterte Bereich automatisch geschlossen.
Schaltflächendesign
Stil	Wählen Sie den Stil der Akkordeonschaltfläche oder des Umschalters aus, auf die Mitarbeiter klicken, um Bereiche zu erweitern und zu schließen.
Größe	Verwenden Sie die Pfeiltasten nach oben und unten, um die Größe der Schaltflächen anzupassen.
Platzierung	Geben Sie an, ob die Schaltflächen links oder rechts von den Akkordeontiteln angezeigt werden.
Farbe	Verwenden Sie die Farbauswahl (kariertes Quadrat), um eine Farbe auszuwählen, oder geben Sie den Farbcode für die Farbe ein, die angezeigt werden soll. Alle HTML-Farben werden unterstützt. Weitere Informationen finden Sie unter HTML-Farbnamen.

Um dem Akkordeon weitere Bereiche hinzuzufügen, klicken Sie auf Element hinzufügen, das sich in befindet Einstellungen > Eigenschaften.

Konfigurieren Sie den Akkordeonstil, z. B. Hintergrundfarbe oder Rahmen. Klicken Sie auf den äußeren Komponentencontainer (Akkordeons), um alle Bereiche gleichzeitig zu konfigurieren. Um einzelne Bereiche zu konfigurieren, klicken Sie auf die entsprechenden Container.

Navigieren Sie zum Bereich Einstellungen, um die folgenden Stileinstellungen zu konfigurieren:

Tabelle : 2. Stileinstellungen
Einstellungsfeld	Beschreibung
Styling
Hintergrundfarbe	Verwenden Sie die Farbauswahl (kariertes Quadrat), um eine Farbe auszuwählen, oder geben Sie den Farbcode ein, der die Hintergrundfarbe darstellt, die angezeigt werden soll. Alle HTML-Farben werden unterstützt. Weitere Informationen finden Sie unter HTML-Farbnamen.
Erweiterte Stile
Breite	Geben Sie den Wert an, indem Sie eine Zahl eingeben oder die rechte Seite der Zelle ziehen. Wählen Sie die Maßeinheit aus: px: Pixel %: Prozentsatz
Auffüllung	Die Auffüllung ist der Abstand zwischen Inhalt und Rahmen eines Elements. Geben Sie den Wert für den Abstand oben, unten, rechts oder links durch Eingabe einer Zahl an.
Marge	Der Rand ist der Bereich zwischen einer Zeile und einem anderen Element/der Canvas-Grenze. Geben Sie den Wert für den Abstand oben, unten, rechts oder links durch Eingabe einer Zahl an.
Rahmen	Bearbeiten Sie den Rahmen um die Außenwand der Schaltfläche. Hinweis: Der Rahmen ist der Umriss um die Schaltfläche. Breite: Verwenden Sie die Pfeiltasten nach oben und unten, um die Breite des Rahmens anzupassen. Genau wie bei der Breite und Höhe können Sie die gewünschte Maßeinheit auswählen, indem Sie die einzelne Abwärtspfeiltaste links neben dem Aufwärts- und Abwärtspfeil wählen. Stil: Das Format des Rahmens um die Schaltfläche. Wählen Sie die Dropdown-Liste aus, um die Art des gewünschten Rahmens um die Schaltfläche auszuwählen. Farbe: Die Farbe des Rahmens um Ihre Schaltfläche. Wählen Sie die Farbe Ihrer Schaltfläche mithilfe der Farbpalette und der Schieberegler ähnlich wie Sie Ihre Hintergrundfarbe auswählen.
Rahmenradius	Verwenden Sie die Pfeiltasten nach oben und unten, um den Radius des Rahmens anzupassen. Genau wie bei der Breite und Höhe können Sie die gewünschte Maßeinheit auswählen, indem Sie die einzelne Abwärtspfeiltaste links neben dem Aufwärts- und Abwärtspfeil wählen.

Formatieren Sie den Akkordeontiteltext.

Um den Text des Akkordeontitels zu formatieren, klicken Sie auf den Akkordeontitel- Container, und navigieren Sie zu Einstellungen > Styling Abschnitt.

Tabelle : 3. Formatierungseinstellungen für Akkordeontitel
Einstellungsfeld	Beschreibung
Styling
Textstil	Ermöglicht Ihnen, das Erscheinungsbild Ihres Texts schnell zu ändern, indem Sie eine vorformatierte Option auswählen. Sie können verschiedene Überschriften- oder Absatzstile auswählen. Überschriften 1 bis 6 entsprechen den HTML-Tags h1 bis h6.
Textfarbe	Verwenden Sie diese Dropdownliste, um die Farbe Ihres Texts zu ändern. Ihre Auswahlmöglichkeiten sind: Primär: Die durch Ihr Portaldesign definierte Primärfarbe. Stumm: Die von Ihrem Portaldesign definierte Farbe. Weiß: Ändert die Farbe Ihres Texts in weiß. Dies ist nützlich, wenn Sie eine andere Hintergrundfarbe als weiß verwenden. Textfarbe weist vordefinierte CSS-Klassen für Textfarbe zu.
Bildschirm	Konfigurieren Sie die Darstellung mehrerer Komponenten innerhalb derselben Spalte, z. B. einer Bild- und einer Textkomponente. Wählen Sie unter den folgenden Optionen aus: Oben und unten (Standard): Das Bild wird über der anderen Komponente angezeigt. Nebeneinander: Das Bild wird mit der anderen Komponente daneben angezeigt. Hinweis: Um beste Ergebnisse zu erzielen, legen Sie dieselbe Anzeige für die Komponenten fest. Wenn Sie beispielsweise ein Bild und Textkomponenten in einer Spalte haben und möchten, dass das Bild links und der Text rechts angezeigt wird, ändern Sie die Anzeigeeinstellungen für beide Komponenten in Nebeneinander.
Ausrichten	Bestimmt die horizontale Ausrichtung Ihres Texts. Wählen Sie aus: Linker Blocksatz Zentrieren Sie die Ausrichtung Rechts begründen Begründen (Text ist an beiden Rändern ausgerichtet)
Erweiterte Stile
Auffüllung	Die Auffüllung ist der Abstand zwischen Inhalt und Rahmen eines Elements. Geben Sie den Wert für den Abstand oben, unten, rechts oder links durch Eingabe einer Zahl an.
Marge	Der Rand ist der Bereich zwischen einer Zeile und einem anderen Element/der Canvas-Grenze. Geben Sie den Wert für den Abstand oben, unten, rechts oder links durch Eingabe einer Zahl an.
Name der Schriftart	Definiert die Schriftart, die zum Rendern von Zeichen verwendet wird. Klicken Sie auf den Dropdown-Pfeil, um eine andere Schriftart auszuwählen.
Schriftgröße	Legt die Größe der Schrift fest.
Schriftbreite	Bestimmt, wie fett oder hell Ihr Text angezeigt wird. Klicken Sie auf den Dropdown-Pfeil, um eine andere Gewichtung auszuwählen.
Zeilenhöhe	Legt den vertikalen Abstand zwischen zwei Textzeilen fest.
Schriftfarbe	Überschreibt die Schriftfarbe aus Ihrem Portaldesign. Um eine Farbe auszuwählen, geben Sie den Hexadezimalcode ein, oder klicken Sie auf die Farbauswahl (graues Quadrat rechts neben der Schriftfarbe), und wählen Sie eine Farbe aus der Farbpalette aus.

Erstellen Sie den Akkordeoninhalt, indem Sie den Bereichen Bilder, Videos, Text oder Links hinzufügen.
Wählen Sie Speichern oder Speichern und beenden aus.
Wenn Sie Speichern wählen, wird Ihr Inhalt gespeichert, und Sie bleiben in der Canvas des Rich-Content-Editors. Wenn Sie Speichern und beenden wählen, wird Ihr Datensatz gespeichert, und Sie kehren zum Formular „Neuer Inhalt“ zurück.

Nächste Maßnahme

(Optional) Übersetzen Sie Ihre Inhalte.
Fordern Sie eine Sprachübersetzung für Ihre Inhalte an. Weitere Informationen finden Sie unter Mehrsprachige Unterstützung in der Inhaltsbibliothek.
Hinweis:
Übersetzen Sie Inhalte nur, nachdem Sie sie geändert haben. Um optimale Ergebnisse zu erzielen, empfehlen wir nicht, nach der Übersetzung Komponenten hinzuzufügen oder zu entfernen oder die Formatierung zu ändern.
Um Rich Content zu erstellen, der in verschiedenen Sprachen unterschiedlich formatiert ist, duplizieren Sie den Inhalt, und ändern Sie die Formatierung nach Bedarf. Verwenden Sie dann Zielgruppen, um den Inhalt anhand der Sprache an Benutzer auszurichten. Siehe Zielgruppen
Zeigen Sie eine Vorschau Ihrer Inhalte auf der Registerkarte Veröffentlichen an.
Hinweis:
Die Inhaltsvorschau soll eine allgemeine Vorstellung davon vermitteln, wie Ihr Inhalt aussieht. Inhalte können nach der Veröffentlichung aufgrund von Variationen in der Geräteauflösung, unterschiedlichen Designs oder der Konfiguration des Stils mobiler Apps anders aussehen.
Konfigurieren Sie einen Veröffentlichungsplan, um zu steuern, wohin der Inhalt geliefert wird, die Zielgruppe und den Zeitraum, in dem er verfügbar ist: Erstellen Sie einen Veröffentlichungsplan für Ihre Inhalte.