Woocommerce Produktgallerie Fotos kleiner

    • Gerade eben
    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren

    Also bei 20 Pixeln Größe brauchst du die Bilder eigentlich gar nicht drin haben, da man das sowieso nicht erkennen kann. Wenn du immer ungefähr diese Anzahl Bilder hast, könntest du es mal mit diesem CSS versuchen:

    Code
    .woocommerce div.product div.images .flex-control-thumbs {
  display: flex;
}
.woocommerce div.product div.images .flex-control-thumbs li {
  max-width: 80px;
}

    Das sollte schon ganz passable Ergebnisse liefern.

    Bablefisch! Kannst Du mir nochmal helfen? Ich habe jetzt sämtliche Bilder für die Produktgallerie eingefügt. Jetzt ist es so, dass sie zwar alle unter dem Produktfoto erscheinen, sind jedoch ein bisschen zu klein. Füge ich nur die hälfte der Bilder ein, erscheinen die Bilder größer. Ich hätte gerne mehrere Reihen untereinander - 3 wenn möglich. ist das möglich? Danke schon mal!

    Wo kann man sich das ansehen? Gib mal einen Link direkt zur Produktgalerie.

    Das Geheimnis des Könnens liegt im Wollen!
    [size=12]Bitte keine Hilfegesuche per PN (auch keine "privaten" Links). Das ist ein öffentliches Forum.[/SIZE]

    http://dev.krabbelixx.de/produkt/krabbelschuh-2/
    Ich habe bereits einen css code von oben hinzugefügt. Klappt auch ganz prima. Nur ist es jetzt halt echt zu klein und das erscheint so, wenn alle Farbauswahlen eingefügt werden. Füge ich nur sechs Bilder zur Produktgalerie hinzu, haben sie eine gute Größe. Gibt's auch noch eine Möglichkeit eine "mouse-over" mit Farbname hinzuzufügen?
    Vielen Dank schon mal!

    Hab die Rückfrage erst jetzt gesehen. Du kannst mal statt dem oberen CSS folgendes probieren:

    Code
    .woocommerce div.product div.images .flex-control-thumbs {
  display: flex;
  flex-wrap: wrap;
}
.woocommerce div.product div.images .flex-control-thumbs li {
 width: 60px;
}

    Die Größe von 60 Pixeln kannst du natürlich anpassen. Damit sind immer alle Bilder in der gleichen Größe, brechen aber um, wenn sie nicht mehr auf eine Zeile passen.

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!

Benutzerkonto erstellen Anmelden