Standardmäßig zeigt Divi die einfache Galerie auf mobilen Endgeräten in einer einspaltigen Ansicht an – funktional, aber nicht immer ideal für ein modernes, visuell ansprechendes Design.
Besonders bei bildlastigen Layouts oder quadratischen Thumbnails kann eine zweispaltige Darstellung deutlich strukturierter und attraktiver wirken.
In diesem Beitrag zeige ich dir, wie du mit einem einfachen Codeschnipsel deine Divi Galerie auch auf Smartphones im Zweispalten-Layout darstellen kannst – ganz ohne Plugin.
Und so geht’s:
- Füge deiner Galerie zunächst in den Einstellungen unter Erweitert > CSS-ID & Klassen die CSS-Klasse .dt-galerie-mobil-zweispaltig hinzu.
- Füge anschließend folgendes CSS-Codeschnipsel im Divi Custom CSS-Bereich oder im Stylesheet deines Child-Themes hinzu:
/* Divi Galerie auf mobilen Endgeräten zweispaltig machen */
@media (max-width: 479px) {
.dt-galerie-mobil-zweispaltig .et_pb_gallery_item {
margin: 0 5% 11.5% 0;
width: 45%;
}
}Und das war’s auch schon!
Du hast die Galerie auf mobilen Endgeräten nun erfolgreich zweispaltig gemacht!
Wenn dir dieses Snippet weitergeholfen hat oder du eigene Erfahrungen teilen möchtest, hinterlass gern einen kurzen Kommentar unten.
Dein Feedback hilft nicht nur mir, sondern auch anderen Leser:innen weiter!
