Fügen Sie Ihrer Seite eine Viewport-Komponente hinzu

  • Freigeben Version: Xanadu
  • Aktualisiert 1. August 2024
  • 1 Minute Lesedauer

    • Fügen Sie Ihrer Seite eine Viewport-Komponente hinzu, und erstellen Sie eine Unterseite, um separate Inhalte auf der Seite zu erstellen.

    Vorbereitungen

    Erforderliche Rolle: ui_builder_admin

    Prozedur

    1. Navigieren zu Alle > Now-Experience-Framework > UI Builder.
    2. Öffnen Sie eine Experience, um darin zu arbeiten, oder erstellen Sie eine Experience, indem Sie auswählen Erstellen > Experience.
      Weitere Informationen zum Erstellen von Experiences finden Sie unter Konfigurieren Sie, wie Benutzer in mit Ihren Anwendungen interagieren UI Builder.
    3. Öffnen Sie den Editor für die Seitenvariante, der Sie den Viewport hinzufügen möchten.
      Wenn Sie keine Seite für Ihre Experience erstellt haben, führen Sie die Schritte bis Erstellen Sie eine Seite in UI Builderaus.
    4. Wählen Sie in der Inhaltsstruktur die Option + Inhalt hinzufügen aus.
    5. Wählen Sie ein Einzelspalten- Layout aus.
    6. Wählen Sie als Nächstes das Symbol + in der Spalte aus, um die Toolbox zu öffnen.
    7. Geben Sie Viewport in das Suchfeld ein.
    8. Wählen Sie Viewport aus.
      Abbildung : 1. Viewport-Komponente
      Viewport-Komponente in der Toolbox ausgewählt.
    9. Wählen Sie die Viewport-Komponente in der Inhaltsstruktur aus.
    10. Wählen Sie im Konfigurationsbereich + Hinzufügen aus.
      Pfeil, der auf die Schaltfläche „+Hinzufügen“ auf der Registerkarte „Konfigurieren“ zeigt, um Seitensammlungen hinzuzufügen.
    11. Wählen Sie eine Seitensammlung aus der Liste aus, oder erstellen Sie eine Sammlung, indem Sie + Sammlung erstellenwählen.
      Weitere Informationen zum Erstellen einer eigenen Seitensammlung finden Sie unter Erstellen Sie eine Seitensammlung über mehrere UI-Seiten hinweg.

      Auswahlbildschirm für Seitensammlung mit Option zum Erstellen einer Sammlung.

    12. Wählen Sie Hinzufügen.
      Die Seitensammlung wird im Abschnitt „ Seitensammlungen “ des Konfigurationsbereichs angezeigt. Im Bereitstellungsbereich wird nur eine Seite der Seitensammlung angezeigt.
    13. Wählen Sie Speichern.
    14. Suchen Sie die Viewport-ID und die Route.

      Sie können die ID und Route im Bereich Konfiguration anzeigen (siehe folgende Abbildung).

      Pfeil, der auf die ID der Viewport-Komponente auf der Registerkarte „Konfigurieren“ zeigt.
    15. Fügen Sie Ihrer Seite eine Komponente hinzu, um den soeben hinzugefügten Viewport zu öffnen, z. B. eine Schaltflächenkomponente.
      Weitere Informationen finden Sie unter Komponenten hinzufügen und konfigurieren.
    16. Wählen Sie im Konfigurationsbereich die Registerkarte Ereignisse.
    17. Wählen Sie + Ereignishandler hinzufügen aus, um den Viewport anzuzeigen.
      Pfeil, der auf die Option „Ereignishandler hinzufügen“ auf der Registerkarte „Konfigurieren“ für die Schaltflächenkomponente zeigt.
    18. Wählen Sie unter Ereignishandler auf Seitenebene die Option UXF – Laden von Macroponent-Viewport angefordert aus.
      Ereignis-Handler zum Laden des UXF-Macroponent-Viewports „Angefordert“ ausgewählt.
    19. Ersetzen Sie im Element viewportElementIDden Nullwert durch die Viewport -ID, die Sie in einem vorherigen Schritt gefunden haben.
      In diesem Beispiel ist dies „viewport_1“.
    20. Wählen Sie Hinzufügen.
      Ereignis-Handler-Skript für UXF-Macroponent-Viewport-Laden mit Viewport-Element-ID.
    21. Wählen Sie Speichern.
    22. Zeigen Sie Ihre Seite an, und testen Sie sie, indem Sie die Schaltfläche Vorschau wählen, die die Seitenvariante öffnet..