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

  • Freigeben Version: Yokohama
  • Aktualisiert 30. Januar 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 von 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. Klicken Sie auf, um dem Akkordeon weitere Bereiche hinzuzufügen 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 der Abstand. 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 auswä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 möchten.

      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 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 auswählen.
    Formatieren Sie den Akkordeon-Titeltext.
    1. Klicken Sie auf, um den Akkordeon-Titeltext zu formatieren Akkordeontitel Container und navigieren Sie zu Einstellungen > Styling Abschnitt.
      Tabelle : 3. Stileinstellungen für Akkordeontitel
      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 HTML-Tags h1 bis h6.

      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 aus 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 die gleiche Anzeige für die Komponenten fest. Wenn Sie beispielsweise ein Bild und eine Textkomponente in einer Spalte haben und das Bild auf der linken Seite und der Text auf der rechten Seite angezeigt werden sollen, ändern Sie die Anzeigen 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 der Abstand. 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 aus Ihrem Portaldesign.

      Um eine Farbe auszuwählen, geben Sie den Hex-Code ein, oder klicken Sie auf die Farbauswahl (graues Quadrat rechts von 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 .
      Auswahl Speichern Speichert Ihren Inhalt, und Sie bleiben auf der Rich-Content-Editor Canvas. Auswahl Speichern und beenden Speichert Ihren Datensatz und gibt Sie zu 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 beste 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 von an Veröffentlichen Registerkarte.
      Hinweis:
      Die Inhaltsvorschau soll eine allgemeine Vorstellung davon geben, 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.