Mit dem Block „Erweiterte Galerie“ können Sie ganz einfach einzelne oder mehrere Bildergalerien in Ihre SeedProd-Seiten einbinden. Dieser Block gibt Ihnen die vollständige Kontrolle über die Darstellung Ihrer Bilder, mit Optionen für Spalten, Abstände, Überlagerungen und interaktive Effekte.
Ganz gleich, ob Sie ein Portfolio präsentieren, Produktfotos zeigen, eine Fotogalerie erstellen oder Teammitglieder vorstellen möchten – der Block „Erweiterte Galerie“ bietet Ihnen die Flexibilität und die Gestaltungsmöglichkeiten, die Sie benötigen, um visuell beeindruckende Bildersammlungen zu erstellen, die Ihre Besucher begeistern werden.
Hinzufügen des erweiterten Galerieblocks zu Ihren Seiten
Befolgen Sie diese Schritte, um einen erweiterten Galerie-Block zu Ihrer SeedProd-Seite hinzuzufügen:
Schritt 1: Block hinzufügen
Ziehen Sie unter „Design“ > „Blöcke“ den Block „Erweiterte Galerie“ per Drag & Drop in den gewünschten Abschnitt Ihrer Seite.
Der Block „Erweiterte Galerie“ befindet sich unter „Design > Erweitert“ und kann in jeden beliebigen Abschnitt Ihrer Seite gezogen werden.
Schritt 2: Inhaltseinstellungen konfigurieren
Sobald Sie ihn hinzugefügt haben, klicken Sie auf den Block „Erweiterte Galerie“, um dessen Einstellungen zu öffnen. Auf der Registerkarte „Inhalt“ können Sie Bilder hinzufügen und die Anzeige Ihrer Galerie konfigurieren.
Bildergalerie:
- Typ: Wählen Sie zwischen dem Anzeigemodus „Einzelbild“ (ein Bild) oder „Mehrfach“ (Bildergalerie).
- Bild / Neues Bild auswählen: Bei „Einzelbild“ klicken Sie hier, um ein Bild aus Ihrer Medienbibliothek auszuwählen.
- Bilder zur Galerie hinzufügen: Bei mehreren Bildern klicken Sie auf mehrere Bilder gleichzeitig, um Ihre Galerie zu erstellen. Sie können so viele Bilder auswählen, wie Sie benötigen.
Wählen Sie „Einzelbild“, um ein einzelnes Bild anzuzeigen, oder „Mehrere“, um eine Galerie mit mehreren Bildern zu erstellen.
Klicken Sie auf „Galeriebilder hinzufügen“, um mehrere Bilder aus Ihrer Medienbibliothek auszuwählen.
Einstellungen:
- Spalte: Legen Sie die Anzahl der Spalten in Ihrem Galerie-Raster fest. Mehr Spalten sorgen für ein dichteres Layout, während weniger Spalten jedem Bild mehr Bedeutung verleihen.
- Abstand: Steuere den Abstand zwischen den Bildern in deiner Galerie. Passe diesen Wert an, um engere oder großzügigere Layouts zu erstellen.
- Link: Wählen Sie aus, wohin Bilder beim Anklicken verlinken sollen. Zu den Optionen gehören „Keine“ (kein Link), „Mediendatei“ (öffnet das Bild in voller Größe) oder „Benutzerdefinierte URL“ (verlinkt zu einer bestimmten Seite).
- Seitenverhältnis: Wählen Sie die Proportionen für Ihre Bilder aus. Zur Auswahl stehen 1:1 (quadratisch), 3:2, 4:3, 9:16 (Hochformat), 16:9 (Querformat) und 21:9 (Ultra-Breitbild). Dadurch wird sichergestellt, dass alle Bilder einheitlich angezeigt werden.
- Bildgröße: Wählen Sie aus, welche Größe Ihrer Bilder angezeigt werden soll: Miniaturansicht, Mittel oder Groß. Größere Bilder zeigen mehr Details, laden jedoch langsamer.
Überlagerung:
- Hintergrundüberlagerung: Aktivieren oder deaktivieren Sie eine Farbüberlagerung, die über Ihren Bildern angezeigt wird. Dadurch werden Text und Informationen besser hervorgehoben.
- Titel: Wählen Sie aus, was als Titelüberlagerung auf Bildern angezeigt werden soll. Zu den Optionen gehören „Keine“, „Titel“, „Bildunterschrift“, „Alternativtext“ oder „Beschreibung“ aus Ihren Bildmetadaten.
- Beschreibung: Wählen Sie aus, was als Beschreibungs-Overlay angezeigt werden soll. Zu den Optionen gehören „Keine“, „Titel“, „Bildunterschrift“, „Alternativtext“ oder „Beschreibung“.
- Textfarbe: Legen Sie die Farbe für den Überlagerungstext fest, um einen guten Kontrast und eine gute Lesbarkeit zu gewährleisten.
- Hintergrundfarbe: Wählen Sie die Farbe des Hintergrunds, der hinter dem Text angezeigt wird.
- Kopfzeilentypografie: Passen Sie die Schriftarteneigenschaften für Überlagerungstitel an, einschließlich Schriftfamilie, Größe, Stärke und Stil.
Im Abschnitt „Einstellungen“ können Sie Spalten, Abstände, Links, Seitenverhältnis, Bildgröße und Überlagerungsoptionen anpassen.
Schritt 3: Design anpassen
Auf der Registerkarte „Erweitert“ können Sie das Erscheinungsbild Ihres erweiterten Galerieblocks anpassen:
Stile:
- Bildschatten: Fügen Sie Ihren Bildern Schatteneffekte hinzu, um ihnen Tiefe zu verleihen. Wählen Sie zwischen „Keine“, „Haarfein“, „Klein“, „Mittel“, „Groß“, „X Groß“, „2X Groß“ oder „Unterer Schlagschatten“.
- Bildrahmen: Aktivieren Sie Rahmen um Ihre Galeriebilder
- Border Radius: Steuert die Rundung der Bildecken. Höhere Werte erzeugen rundere Ecken, während der Wert Null scharfe Ecken erzeugt.
- Rahmenstil: Wählen Sie das Aussehen des Rahmens: Durchgehend (durchgehende Linie), Gepunktet (kleine Punkte) oder Gestrichelt (kurze Striche)
- Rahmenfarbe: Wählen Sie die Farbe für Ihre Bildrahmen aus.
- Rahmenbreite: Legen Sie die Rahmenstärke für jede Seite (oben, rechts, unten, links) individuell fest. So können Sie einzigartige Rahmeneffekte erstellen.
Abstand:
- Rand: Steuert den äußeren Abstand um Ihren Galerieblock herum (oben, rechts, unten, links). Damit legen Sie fest, wie viel Platz zwischen der Galerie und den umgebenden Elementen angezeigt wird.
- Abstand: Passen Sie den inneren Abstand innerhalb Ihres Galerieblocks an (oben, rechts, unten, links). Dadurch entsteht ein Luftraum zwischen dem Galerieinhalt und seinen Rändern.
Attribute:
- CSS-ID: Zeigt die automatisch generierte eindeutige Kennung für Ihren Galerieblock an. Diese ID wird automatisch von SeedProd für benutzerdefiniertes Styling oder JavaScript-Targeting erstellt.
- Benutzerdefinierte Klasse: Fügen Sie benutzerdefinierte CSS-Klassen hinzu, um bestimmte Stile aus Ihrem Theme oder benutzerdefiniertem CSS anzuwenden.
- Benutzerdefinierte Attribute: Fügen Sie beliebige HTML-Attribute zum Galerie-Wrapper-Element hinzu. Geben Sie jedes Attribut in einer neuen Zeile im folgenden Format ein: Attributname|Wert (z. B. data-gallery|portfolio)
Geräte-Sichtbarkeit:
- Auf dem Desktop ausblenden: Den Galerieblock auf Desktop-Bildschirmen ausblenden
- Auf Tablet ausblenden: Den Galerieblock auf Tablet-Geräten ausblenden
- Auf Mobilgeräten ausblenden: Den Galerieblock auf Mobilgeräten ausblenden
Animationseffekte:
- Eingangsanimation: Wählen Sie aus verschiedenen Animationseffekten, die abgespielt werden, wenn die Galerie in den Blickpunkt gerät. Zu den Optionen gehören „Hüpfen“, „Einblenden“, „Vergrößern“, „Drehen“ und viele mehr. Dies sorgt für visuelle Abwechslung und lenkt die Aufmerksamkeit auf Ihre Galerie.
Die Registerkarte „Erweitert“ enthält Optionen für Bildschatten, Rahmen, Abstände, Attribute, Gerätesichtbarkeit und Animationseffekte.
Schritt 4: Speichern Sie Ihre Änderungen
Wenn Sie die Konfiguration des Blocks „Erweiterte Galerie“ abgeschlossen und dessen Erscheinungsbild angepasst haben, speichern Sie Ihre Arbeit.
Sie haben erfolgreich einen Advanced Gallery-Block zu Ihrer Seite hinzugefügt! Mit diesem leistungsstarken Block können Sie einzelne oder mehrere Bildergalerien präsentieren und dabei das Layout, das Design und die interaktiven Effekte vollständig steuern. Experimentieren Sie mit verschiedenen Spaltenlayouts, Seitenverhältnissen und Overlay-Stilen, um eine Galerie zu erstellen, die perfekt zu Ihrer Marke passt und Ihr Publikum anspricht.