Fügen Sie ein Akkordeon mit dem Rich-Inhalts-Editor hinzu

  • Freigeben Version: Zurich
  • Aktualisiert 31. Juli 2025
  • 6 Minuten Lesedauer

    • Fügen Sie der Canvas eine Akkordeonkomponente 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 mithilfe von Modulen oder Spalten.

    Prozedur

    1. Navigieren Sie zum Canvas, indem Sie auswählen Öffnen Sie den Editor Schaltfläche von Design Registerkarte von Neuer Inhalt Formular.
    2. 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.
    1. Navigieren Sie zu Einstellungen > Eigenschaften Abschnitt zum Konfigurieren der Akkordeonkomponente:
      Tabelle : 1. Einstellungen für Akkordeon-Eigenschaften
      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 mit 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, wird der derzeit erweiterte Bereich automatisch geschlossen, wenn ein Mitarbeiter einen Bereich erweitert.
      Schaltflächendesign
      Stil Wählen Sie den Stil der Akkordeon-Schaltfläche aus, oder schalten Sie sie um, 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 neben den Akkordeontiteln angezeigt werden.
      Farbe Verwenden Sie die Farbauswahl (kariertes Quadrat), um eine Farbe auszuwählen, oder geben Sie den Farbcode ein, der die Farbe darstellt, die angezeigt werden soll.

      Alle HTML-Farben werden unterstützt. Weitere Informationen finden Sie unter HTML-Farbnamen .
    2. Um dem Akkordeon weitere Bereiche hinzuzufügen, klicken Sie auf Element hinzufügen , Befindet sich in Einstellungen > Eigenschaftenan.
    Konfigurieren Sie den Akkordeon-Stil, z. B. Hintergrundfarbe oder Rahmen. Klicken Sie auf den äußeren Komponentencontainer (Akkordeons), um alle Bereiche gleichzeitig zu konfigurieren. Klicken Sie zum Konfigurieren einzelner Bereiche auf die entsprechenden Container.
    1. Navigieren Sie zu Einstellungen Bereich zum Konfigurieren der folgenden Stileinstellungen:
      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 Der Abstand zwischen Inhalt und Rahmen eines Elements ist. Geben Sie den Wert für den oberen, unteren, rechten oder linken Abstand an, indem Sie eine Zahl eingeben.
      Marge Der Rand ist der Abstand zwischen einer Zeile und einem anderen Element/der Canvas-Grenze. Geben Sie den Wert für den oberen, unteren, rechten oder linken Abstand an, indem Sie eine Zahl eingeben.
      Rahmen Bearbeiten Sie den Rahmen um die Außenseite 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 die Breite und Höhe können Sie die gewünschte Maßeinheit auswählen, indem Sie die einzelne nach-unten-Pfeiltaste links neben den nach-oben- und nach-unten-Pfeilen wählen.

      Stil: Das Format des Rahmens um die Schaltfläche. Wählen Sie die Dropdown-Liste aus, um den Typ des Rahmens auszuwählen, den Sie um die Schaltfläche herum haben möchten.

      Farbe: Die Farbe des Rahmens um Ihre Schaltfläche. Wählen Sie die Farbe Ihrer Schaltfläche mithilfe der Farbpalette und der Folienleisten ähnlich wie die Hintergrundfarbe aus.
      Rahmenradius Verwenden Sie die Pfeile nach oben und unten, um den Radius des Rahmens anzupassen. Genau wie die Breite und Höhe können Sie die gewünschte Maßeinheit auswählen, indem Sie die einzelne nach-unten-Pfeiltaste links neben den nach-oben- und nach-unten-Pfeilen wählen.
    Formatieren Sie den Akkordeon-Titeltext.
    1. Klicken Sie auf , um den Akkordeon-Titeltext zu formatieren Akkordeon-Titel Container und navigieren Sie zu Einstellungen > Styling Abschnitt.
      Tabelle : 3. Stileinstellungen für Akkordeon-Titel
      Einstellungsfeld Beschreibung
      Styling
      Textstil Ermöglicht Ihnen, das Aussehen Ihres Texts schnell zu ändern, indem Sie eine vorformatierte Auswahl auswählen. Sie können verschiedene Überschriften oder Absatzstile auswählen.

      Überschrift 1-6 entspricht h1 - h6 HTML-Tags.
      Textfarbe Verwenden Sie diese Dropdown-Liste, um die Farbe Ihres Texts zu ändern.
      Ihre Auswahlmöglichkeiten sind:
      • Primär: Die primäre Farbe, die durch Ihr Portaldesign definiert ist.
      • Stummgeschaltet: Die durch Ihr Portaldesign definierte Farbe.
      • Weiß: Ändert die Farbe Ihres Texts in weiß. Dies ist nützlich, wenn eine andere Hintergrundfarbe als weiß verwendet wird.

      Textfarbe weist vordefinierte CSS-Klassen für Textfarbe zu.
      Bildschirm Konfigurieren Sie die Darstellung mehrerer Komponenten innerhalb derselben Spalte, z. B. ein Bild und eine Textkomponente. Wählen Sie unter den folgenden Optionen aus:
      • Oben und unten (Standard): Bild wird über der anderen Komponente angezeigt.
      • Nebeneinander : Bild wird mit der anderen Komponente daneben angezeigt.
      Hinweis:
      Um die besten Ergebnisse zu erzielen, legen Sie für die Komponenten dieselbe Anzeige fest. Wenn Sie beispielsweise ein Bild und eine Textkomponente in einer Spalte haben und das Bild links und der Text rechts angezeigt werden sollen, ändern Sie die Anzeige Einstellungen für beide Komponenten bis Nebeneinander .
      Ausrichten Bestimmt die horizontale Ausrichtung Ihres Texts. Wählen Sie aus:
      • Linksbündig
      • Zentriert ausrichten
      • Rechtsbündig
      • Begründen (Text ist an beiden Rändern ausgerichtet)
      Erweiterte Stile
      Auffüllung Der Abstand zwischen Inhalt und Rahmen eines Elements ist. Geben Sie den Wert für den oberen, unteren, rechten oder linken Abstand an, indem Sie eine Zahl eingeben.
      Marge Der Rand ist der Abstand zwischen einer Zeile und einem anderen Element/der Canvas-Grenze. Geben Sie den Wert für den oberen, unteren, rechten oder linken Abstand an, indem Sie eine Zahl eingeben.
      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 Schriftart 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 Ihres Portaldesigns.

      Um eine Farbe auszuwählen, geben Sie den Hex-Code ein, oder klicken Sie auf die Farbauswahl (graues Quadrat rechts neben der Schriftfarbe), und wählen Sie eine Farbe aus der Farbpalette aus.
    2. Erstellen Sie den Akkordeoninhalt, indem Sie den Bereichen Bilder, Videos, Text oder Links hinzufügen.
    3. Wählen Sie Aus Speichern Oder Speichern und beenden .
      Auswählen Speichern Speichert Ihren Inhalt, und Sie bleiben im Rich-Content-Editor Canvas. Auswählen Speichern und beenden Speichert Ihren Datensatz und gibt Sie zum zurück Neuer Inhalt Formular.

    Nächste Maßnahme

    • (Optional) Übersetzen Sie Ihren Inhalt.

      Fordern Sie eine Sprachübersetzung für Ihren Inhalt an. Weitere Informationen finden Sie unter Mehrsprachige Unterstützung in der Inhaltsbibliothek.

      Hinweis:
      Übersetzen Sie Inhalte erst, nachdem Sie mit dem Ändern des Inhalts fertig sind. Um die besten Ergebnisse zu erzielen, empfehlen wir nicht, Komponenten hinzuzufügen oder zu entfernen oder die Formatierung nach der Übersetzung zu ändern.

      Um Rich-Inhalte zu erstellen, die in verschiedenen Sprachen unterschiedlich formatiert sind, duplizieren Sie den Inhalt, und ändern Sie die Formatierung nach Bedarf. Verwenden Sie dann Zielgruppen, um den Inhalt auf Anwender nach Sprache auszurichten. Siehe Zielgruppen

    • Zeigen Sie eine Vorschau Ihres Inhalts aus dem an Veröffentlichen Registerkarte.
      Hinweis:
      Die Inhaltsvorschau dient dazu, eine allgemeine Vorstellung davon zu vermitteln, wie Ihre Inhalte aussehen. Inhalte können nach der Veröffentlichung aufgrund von Variationen bei der Geräteauflösung, dem Designunterschied oder der Konfiguration des mobilen App-Stils anders aussehen.
    • Konfigurieren Sie einen Veröffentlichungsplan, um zu steuern, wo der Inhalt bereitgestellt wird, die Zielgruppe und den Zeitraum, in dem er verfügbar ist: Erstellen Sie einen Veröffentlichungsplan für Ihren Inhalt.