Der Dynamic Repeater ist ein sammlungsbasiertes Design- widget , mit dem Sie schnell und einfach wiederkehrende, strukturierte Layouts erstellen können, bei denen das Design für jedes Element gleich ist, der Inhalt jedoch unterschiedlich ist; zum Beispiel Listen von Produkten, Veranstaltungen oder Dienstleistungen.
Die im Repeater angezeigten Inhalte werden aus einer internen Sammlung verwaltet. Um sich mit internen Sammlungen und deren Funktionsweise vertraut zu machen, siehe Dynamischer Inhalt: Interne Sammlungen.
Hinweis
Solange sich der Dynamic Repeater noch in der Testphase befindet, können nur interne Sammlungen und Bildersammlungen verbunden werden. Zukünftig werden wir Tarife anbieten, um Google Sheets, Airtable und externe Datenbanken zu unterstützen.
Der Wrapper (auch „Frame“ genannt) des Repeater widget ist der Container für die Sammlungselemente. Im Bild unten sind drei Sammlungsgegenstände abgebildet.
Jedes Sammlungselement zeigt Inhalte aus einer Zeile in der verbundenen internen Sammlung an. Dies wird ermöglicht, indem widget mit Spalten in der internen Sammlung verknüpft wird.
Auf einer Website zur Hunde-Adoption gibt es beispielsweise eine interne Liste mit Hunden, die zur Adoption freigegeben sind. Unten sehen Sie ein Bild der Kollektion.
Um die Hunde im dynamischen Repeater anzuzeigen, werden die Spalten und widget wie folgt verbunden:
-
Die Spalte „Bild“ ist mit einem Bild-Widget verbunden.
-
Die Spalte „Hundename“ ist mit einem widget für kleine Überschriften verbunden.
-
Die Spalte „Hundebeschreibung“ ist mit einem Text-Widget verbunden.
Wenn Sie den dynamischen Repeater zur Arbeitsfläche hinzufügen, wird eine interne Beispielsammlung erstellt und mit dem dynamischen Repeater verknüpft. Sie können diese Beispielsammlung modifizieren oder eine neue Sammlung erstellen, um sie mit dem dynamischen Repeater zu verknüpfen.
So fügen Sie ein dynamisches Repeater- widget hinzu:
-
Suchen Sie im Abschnitt „Layout-Elemente“ des widget Panels nach „Dynamischer Repeater“ und ziehen Sie ihn auf die Arbeitsfläche. Beachten Sie, dass beim Hinzufügen des Repeaters zur Zeichenfläche eine interne Beispielsammlung mit 4 Sammlungselementen (Zeilen in der Sammlung) erstellt wird, die im dynamischen Repeater angezeigt werden. Dies soll Ihnen helfen, sich das Design vorzustellen, bevor Sie Ihre eigenen Inhalte hinzufügen.
-
Bei Bedarf können Sie widget zum dynamischen Repeater hinzufügen oder daraus entfernen, um Ihren Bedürfnissen gerecht zu werden. Es spielt keine Rolle, welches Sammlungselement Sie ändern, die Änderungen werden automatisch in allen anderen Sammlungselementen aktualisiert. Beachten Sie, dass das neue widget manuell mit einer bestimmten Sammlungsspalte verbunden werden muss. Dies wird in einem späteren Schritt abgeschlossen.
Sie können das Design des Wrappers des dynamischen Repeaters oder die Sammlungselemente innerhalb des dynamischen Repeaters ändern. Beachten Sie, dass Designänderungen an einem Kollektionsgegenstand auch für alle anderen gelten. Dadurch sparen Sie Zeit, da Sie Designänderungen nicht manuell auf jedes einzelne Kollektionselement anwenden und Fehler riskieren müssen.
Um das Design des Wrappers zu ändern, klicken Sie auf das Dynamic Repeater widget , um das schwebende Menü zu öffnen, und klicken Sie dann auf Design bearbeiten. Im Wrapper -Bereich des Designpanels können Sie Folgendes konfigurieren:
-
Verpackungsdesign. Sie können die Hintergrundfarbe, Ausrichtung, Größe, Animation, Position (fixiert oder angeheftet) und den Abstand zwischen den Sammlungselementen innerhalb des dynamischen Repeaters definieren.
Um mehr über die Abschnitte des Designpanels und die Konfiguration der einzelnen Designoptionen zu erfahren, lesen Sie Design mit Flexbox-Technologie.
Mehr darüber, was „fixiert“ oder „angeheftet“ in Bezug auf widget Position bedeutet, erfahren Sie unter widget Position: Fixiert und Angeheftet.
Um festzulegen, wie Sammlungselemente im dynamischen Repeater angezeigt werden, klicken Sie auf das widget „Dynamischer Repeater“, um das schwebende Menü zu öffnen, und klicken Sie dann auf „Design bearbeiten“. Im Layout- Bereich des Designpanels können Sie Folgendes konfigurieren:
-
Artikel pro Zeile. Wählen Sie aus, wie viele Sammlungselemente pro Zeile angezeigt werden sollen. Maximal 10 Elemente pro Zeile.
-
Die Artikel passen. Wählen Sie entweder „Feste Breite“ oder „Anpassen“.
Um die Seitennummerierung oder eine Option zum Laden weiterer Inhalte zu aktivieren, öffnen Sie den Navigationsbereich des Designpanels und schalten Sie den Schalter „Navigation aktivieren“ ein. Sobald die Navigation aktiviert ist, konfigurieren Sie Folgendes:
-
Seitennummerierung oder Mehr laden. Die Paginierung unterteilt die Sammlungselemente in Seiten, zwischen denen die Website-Besucher navigieren können. Mit „Mehr laden“ wird zunächst eine festgelegte Anzahl von Sammlungselementen angezeigt. Mit jedem Klick wird dann eine zusätzliche Anzahl von Sammlungselementen geladen.
-
Elemente pro Seite. Legen Sie fest, wie viele Sammlungselemente pro Seite angezeigt werden sollen oder bevor weitere Ergebnisse geladen werden.
Um Designänderungen am widget innerhalb eines Sammlungselements vorzunehmen, klicken Sie auf das jeweilige Sammlungselement, um das schwebende Menü zu öffnen, und klicken Sie dann auf „Design bearbeiten“. Alle Designänderungen werden auf jedes Element im Repeater angewendet. Im Layout- Bereich des Designpanels können Sie Folgendes konfigurieren:
-
Inhaltsausrichtung. Definiere die horizontale und vertikale Ausrichtung des Inhalts innerhalb des Sammlungselements.
-
Stapelanleitung. Wählen Sie aus, ob die widget im Repeater horizontal oder vertikal gestapelt werden sollen.
-
Zeilenumbruch und Zeilenausrichtung. Falls gewünscht, können Sie das widget so einstellen, dass jedes Sammlungselement in eine weitere Zeile umgebrochen wird. Wenn Sie den Zeilenumbruch auswählen, müssen Sie auch die Zeilenausrichtung definieren.
Wichtig zu beachten ist, dass die Breite oder Höhe der Sammlungselemente im dynamischen Repeater nicht geändert werden kann. Das Sammlungselement wird so skaliert, dass es 100 % des Containers ausfüllt. Das bedeutet, dass Höhe und Breite des Sammlungselements durch Höhe und Breite des Containers des dynamischen Repeaters gesteuert werden. Höhe und Breite des dynamischen Repeaters können im Bereich „Größe “ des Designpanels definiert werden.
Wenn Sie den dynamischen Repeater zur Leinwand hinzufügen, wird eine interne Beispielsammlung erstellt und mit dem dynamischen Repeater und dem darin enthaltenen Standard widget verknüpft. Sie können diese Beispielsammlung modifizieren oder eine neue interne Sammlung erstellen, um eine Verbindung zum dynamischen Repeater herzustellen. Wenn Sie dem dynamischen Repeater ein neues widget hinzufügen, muss dieses mit einer Sammlungsspalte verbunden werden.
Hinweis
Derzeit kann der dynamische Repeater nur mit einer internen Sammlung oder einer Bildersammlung verbunden werden. Zukünftig werden wir Tarife anbieten, die alle Sammlungsarten unterstützen.
So verbinden Sie einen dynamischen Repeater mit einer Sammlung:
-
Klicken Sie auf das widget „Dynamischer Repeater“, um das schwebende Menü zu öffnen.
-
Klicken Sie auf das Symbol mit den drei Punkten im schwebenden Menü und wählen Sie dann „Sammlung ersetzen“.
-
Im Modal können Sie über das Dropdown-Menü die gewünschte Sammlung auswählen.
-
Klicken Sie auf Ersetzen.
-
Als Nächstes müssen Sie widget mit den Sammlungsspalten verbinden. Klicken Sie auf ein widget im dynamischen Repeater, um das schwebende Menü zu öffnen, klicken Sie dann auf das Symbol mit den drei Punkten und wählen Sie „Mit Daten verbinden“.
-
Im Modal können Sie über das Dropdown-Menü die Spalte in der Sammlung auswählen, die mit dem widget verbunden werden soll. Beachten Sie, dass nur kompatible Spalten angezeigt werden. Beispielsweise können Bild-Widgets nur mit einer Spalte in der Sammlung verbunden werden, bei der Bild als Feldtyp festgelegt ist. Klicken Sie auf Verbinden. Wiederholen Sie dies für jedes widget im dynamischen Repeater.
Um ein Sammlungselement zum dynamischen Repeater hinzuzufügen, müssen Sie eine neue Zeile in der Sammlung hinzufügen. Die Zeilen müssen Inhalt haben, bevor sie im dynamischen Repeater angezeigt werden.
Um ein Sammlungselement zu entfernen, löschen Sie die entsprechenden Zeilen in der Sammlung.
Um ein widget hinzuzufügen, öffnen Sie das widget Panel und ziehen Sie das gewünschte widget per Drag & Drop in den dynamischen Repeater. Das widget wird automatisch allen anderen Sammlungselementen hinzugefügt.
Wenn Sie bereit sind, das widget mit der Sammlung zu verbinden, klicken Sie auf das widget , um das schwebende Menü zu öffnen. Klicken Sie auf das Symbol mit den drei Punkten und wählen Sie „Mit Daten verbinden“. Wählen Sie im Popup die Spalte aus, mit der Sie das widget verbinden möchten. Beachten Sie, dass nur kompatible Spalten angezeigt werden. Das bedeutet, dass Bild-Widgets nur mit Spalten in der Sammlung verbunden werden können, bei denen Bild als Feldtyp festgelegt ist. Klicken Sie auf Verbinden.
Um die widget -Verbindung zu ändern, klicken Sie auf das widget , um das schwebende Menü zu öffnen. Klicken Sie auf das Symbol mit den drei Punkten und wählen Sie „Verbindung ändern“. Verwenden Sie das Dropdown-Menü im Popup, um eine andere Sammlungsspalte auszuwählen. Klicken Sie auf Verbinden.
Um den Inhalt eines Elements im dynamischen Repeater zu bearbeiten, klicken Sie auf das widget und nehmen Sie die gewünschten Änderungen vor. Da der dynamische Repeater die Bearbeitung direkt im Code unterstützt, werden Ihre Änderungen auch in der verbundenen Sammlung aktualisiert.
Sie können den Inhalt eines Sammlungselements auch direkt in der Sammlung bearbeiten.
Um die Abstände zwischen den Sammlungselementen zu vergrößern oder zu verkleinern, klicken Sie auf den dynamischen Repeater, um das schwebende Menü zu öffnen, und klicken Sie dann auf „Design bearbeiten“. Verwenden Sie im Abschnitt „Abstände “ des Design-Panels die Einstellungen „Abstände zwischen Elementen“ , um den Abstand zwischen Sammlungselementen zu definieren.