Der Galerie-Block ermöglicht es Ihnen, mühelos schöne Bildergalerien auf Ihren Website-Seiten hinzuzufügen und zu gestalten, um die visuelle Attraktivität Ihrer Inhalte zu verbessern.
Laden Sie einfach Ihre Bilder hoch, wählen Sie die Anzahl der anzuzeigenden Spalten und konfigurieren Sie Link- und Größenoptionen – alles ohne Code. Es ist der schnellste Weg, eine saubere, gitterbasierte Bildergalerie zu jeder SeedProd-Seite hinzuzufügen.
Hinzufügen des Galerie-Blocks zu Ihren Seiten
Befolgen Sie diese Schritte, um einen Galerie-Block zu Ihrer SeedProd-Seite hinzuzufügen:
Schritt 1: Block hinzufügen
Ziehen Sie unter Design > Blöcke den Galerie-Block per Drag & Drop in den gewünschten Bereich Ihrer Seite.
Ziehen Sie den Galerie-Block aus dem Blöcke-Panel und legen Sie ihn in Ihr Seitenlayout.
Schritt 2: Inhaltseinstellungen konfigurieren
Klicken Sie nach dem Hinzufügen auf den Galerie-Block, um seine Einstellungen zu öffnen. Laden Sie im Tab Inhalt Ihre Bilder hoch und konfigurieren Sie die Anzeige der Galerie.
Galeriebilder:
- Bilder: Laden Sie die Fotos hoch, die Sie in Ihrer Galerie anzeigen möchten. Sie können mehrere Bilder gleichzeitig aus Ihrer WordPress-Mediathek auswählen.
Einstellungen:
- Spalte: Legen Sie die Anzahl der Spalten fest, die zum Anordnen Ihrer Galeriebilder im Raster verwendet werden, von 1 bis 10.
- Abstand: Passen Sie den Abstand zwischen den Galeriebildern an, um zu steuern, wie eng oder locker die Bilder nebeneinander liegen.
- Link: Wählen Sie aus, was passiert, wenn ein Besucher ein Galeriebild anklickt – Keine (keine Aktion), Mediendatei (öffnet das Bild in voller Größe) oder Anhang (verknüpft mit der WordPress-Anhangsseite des Bildes).
- Bildgröße: Wählen Sie die WordPress-Bildgröße zum Laden aus – Miniaturansicht, Mittel oder Groß. Die Wahl einer kleineren Größe kann die Ladeleistung der Seite verbessern.
- Sortieren nach: Wählen Sie aus, wie Bilder sortiert werden – Standard (die Reihenfolge, in der Sie sie hochgeladen haben) oder Zufällig (wird bei jedem Seitenaufruf neu gemischt).
- Lightbox: Wenn Link auf Mediendatei gesetzt ist, aktivieren Sie diese Option, um angeklickte Bilder in einem Vollbild-Lightbox-Overlay zu öffnen, anstatt die Seite zu verlassen.
Der Inhalts-Tab ermöglicht es Ihnen, Bilder hochzuladen und Spalten, Abstände, Link-Verhalten, Bildgröße und Anzeige-Reihenfolge zu konfigurieren.
Schritt 3: Design anpassen
Im Tab Erweitert können Sie das visuelle Erscheinungsbild Ihres Galerie-Blocks anpassen.
Stile:
- Schatten: Wenden Sie einen Schlagschatten auf Ihre Galeriebilder an. Wählen Sie aus Keine, Haarlinisch, Klein, Mittel, Groß, X Groß, 2X Groß oder Bottom Drop Shadow, um Ihren Fotos Tiefe und Dimension zu verleihen.
- Textfarbe: Legen Sie die Farbe für Text fest, der innerhalb der Galerie angezeigt wird, z. B. für Bildunterschriften-Overlays.
- Bildrand: Fügen Sie einen Rand um jedes Galeriebild hinzu. Konfigurieren Sie den Randstil (Durchgezogen, Gepunktet oder Gestrichelt), die Randbreite, die Randfarbe, den Radius (zum Abrunden der Bildecken) und den Leerraum-Abstand, um den Platz zwischen dem Bild und seinem Rand zu steuern.
Abstand:
- Rand: Steuern Sie den äußeren Abstand um Ihren Galerie-Block (oben, rechts, unten, links). Dies bestimmt, wie viel Platz zwischen der Galerie und den umgebenden Elementen auf der Seite angezeigt wird.
- Innenabstand: Passen Sie den inneren Abstand innerhalb Ihres Galerie-Blocks an (oben, rechts, unten, links). Dies schafft Freiraum zwischen der Galerie und den Blockrändern.
Attribute:
- CSS-ID: Zeigt die automatisch generierte eindeutige Kennung für Ihren Galerie-Block an. Diese ID wird automatisch von SeedProd für benutzerdefinierte Stile oder JavaScript-Ziele erstellt.
- Benutzerdefinierte Klasse: Fügen Sie benutzerdefinierte CSS-Klassen hinzu, um spezifische Stile aus Ihrem Theme oder benutzerdefinierten CSS anzuwenden.
- Benutzerdefinierte Attribute: Fügen Sie dem Wrapper-Element der Galerie HTML-Attribute hinzu. Geben Sie jedes Attribut in eine neue Zeile im Format ein: attribut-name|wert (z. B. data-gallery|portfolio).
Gerätesichtbarkeit:
- Auf Desktop ausblenden: Blenden Sie den Galerie-Block auf Desktop-Bildschirmen aus.
- Auf Tablet ausblenden: Blenden Sie den Galerie-Block auf Tablet-Geräten aus.
- Auf Mobilgeräten ausblenden: Blenden Sie den Galerie-Block auf Mobilgeräten aus.
Animationseffekte:
- Eingabeanimation: Wählen Sie aus verschiedenen Animationseffekten, die abgespielt werden, wenn der Galerie-Block in den Ansichtsbereich gescrollt wird. Optionen sind Bounce, Fade In, Zoom In, Rotate In und viele mehr, die ein poliertes Gefühl hinzufügen, während Besucher nach unten auf der Seite scrollen.
Der Tab "Erweitert" bietet Schattenvorgaben, Textfarbe, Bildrandgestaltung, Abstandssteuerungen und Optionen für die Geräte-Sichtbarkeit.
Schritt 4: Speichern Sie Ihre Änderungen
Sobald Sie die Konfiguration des Galerie-Blocks abgeschlossen und sein Aussehen angepasst haben, stellen Sie sicher, dass Sie Ihre Arbeit speichern.
Sie haben erfolgreich einen Galerie-Block zu Ihrer Seite hinzugefügt! Der Galerie-Block macht es einfach, Fotos, Portfolios oder beliebige visuelle Inhalte in einem sauberen Rasterlayout zu präsentieren. Experimentieren Sie mit verschiedenen Spaltenanzahlen, Abständen, Schattenstilen und Randoptionen, um eine Galerie zu erstellen, die perfekt zu Ihrem Seitendesign passt.