CSS Loader im Jitterbit App Builder

App Builder wird mit einem CSS Loader-Widget geliefert, das zum Überschreiben von CSS-Stilen auf Site-Ebene verwendet werden kann, anstatt sie manuell über ein Design oder auf individueller Anwendungsebene festzulegen. Um den CSS Loader zu verwenden, laden Sie eine Kopie des CSS Loader herunter, bearbeiten Sie styles.css nach Bedarf und fügen Sie es einem neu erstellten CSS-Widget hinzu.

Hinweis

Beim Bearbeiten von styles.css möchten Sie die vorhandenen CSS-Beispielzeilen entfernen oder bearbeiten, da diese sonst beim Aktivieren des CSS Loader angezeigt werden.

So konfigurieren Sie

Schritt 1: Passen Sie das CSS an

Navigieren Sie zu IDE > Look and Feel
Wählen Sie die App Builder Sammlung aus dem Bereich „Sammlungen“. Falls nicht verfügbar, klicken Sie auf Alle anzeigen.
Klicken Sie auf die Tab Widgets
Suchen Sie das Widget CSS Loader und klicken Sie auf das Symbol Datensatz öffnen
Klicken Sie auf die Datei Widget Path Content, um den Widget-ZIP-Inhalt herunterzuladen
Öffnen Sie die ZIP-Datei in einem Code-Editor-Programm und nehmen Sie alle erforderlichen Anpassungsänderungen an styles.css vor.

styles.css-Datei, wie angezeigt von App Builder's Editor. Achten Sie darauf, diese Beispiele zu entfernen oder zu bearbeiten, sonst werden sie bei der Aktivierung angezeigt.
Wählen Sie eine neue Sammlung aus, um den geänderten CSS Loader-Inhalt hinzuzufügen. Beachten Sie, dass dies nicht die App Builder oder App Builder IDE-Sammlungen.
Klicken Sie auf Widget hochladen
Bestätigen Sie die Sammlung, in der das Widget gespeichert wird
Klicken Sie auf die Schaltfläche Durchsuchen und suchen Sie den geänderten .ZIP-Inhalt des CSS-Widgets
Klicken Sie auf Speichern
Weisen Sie dem CSS-Widget einen Namen zu. Beispiel: CSS-Widget
Überprüfen Sie den Zweck und legen Sie ihn nach Bedarf als Feld oder Site fest

Schritt 2: Konfigurieren Sie auf Site-Ebene (oder folgen Sie Schritt 3)

Navigieren Sie zu IDE > Zusätzliche Einstellungen > Site-Widgets
Klicken Sie auf + Widget-Registrierung
Wählen Sie das CSS-Widget als Widget aus
Klicken Sie auf das Häkchen, um zu speichern
Bestätigen Sie, dass die Spalte Aktiv aktiviert/eingeschaltet ist

Schritt 3: Konfigurieren auf App-Ebene

Navigieren Sie zu IDE > Look and Feel
Wählen Sie die Sammlung aus, in der Sie das kopierte CSS Loader-Widget gespeichert haben, und klicken Sie auf die Tab Widgets
Suchen Sie das CSS-Widget und klicken Sie auf das Symbol Datensatz öffnen
Setzen Sie den Wert Zweck auf Site
Klicken Sie auf die Schaltfläche Speichern
Navigieren Sie zu IDE > Zusätzliche Einstellungen > Site-Widgets
Klicken Sie auf + Widget-Registrierung
Wählen Sie CSS Widget aus dem Widget-Dropdown-Menü
Klicken Sie auf das Häkchen-Symbol, um das CSS-Widget zu aktivieren
Navigieren Sie zurück zu Ihrer Anwendung, aktualisieren Sie Ihren Webbrowser und bestätigen Sie die Aktualisierungen