WooCommerce Darstellungsprobleme Produktbilder (überlappende Bilder)

  • Hallo,

    habe folgendes Problem mit Woocommerce:
    Ich füge die Produktbilder in der Produktbearbeitung unter Produktgalerie ein und Sie werden überlappend angezeigt. (siehe Bild)
    Sprich, ich möchte nicht, dass das Bild die Bildleiste unter dem Produktbild überschneidet. Das Problem habe ich mit fast allen Produktbilder und ich habe schon verschiedene Bildgrößen ausprobiert. Die Bilder aus meinem Beispiel haben die Abmessung 500 x 500 Pixel.

    Meine Einstellungen in den Woocommerce Produkt Darstellungs Einstellungen habe ich euch auch als Screenshot beigefügt.

    Wenn mir jemand weiter helfen kann, wäre das echt super!
    Danke im Voraus.

    • 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

  • Da "beißen" sich die Bildgrößen mit CSS Regeln. Ohne nähere Informationen oder wenigstens einen Link zur Seite kann man aber so gut wie nichts sagen.

    WordPress ist "frei" wie in Freiheit es zu nutzen, aber nicht im Sinne von Freibier. Wer also glaubt man bekommt rund um WordPress alles kostenlos, der irrt. Hilfe ist ein Geschenk für das man sich bedankt, dafür gibt es den 'Gefällt mir' Button. Wer das nicht kann und sich selbst nicht zu helfen weiss, muss sich bezahlte Unterstützung suchen.

  • Was ich im Quelltext sehe deutet darauf hin, dass ein Plugin (flexslider) mit den CSS Regeln des Themes kollidiert (so wie bereits vermutet). Deaktiviere das fragliche Plugin und prüfe erneut um sicher zu gehen, dass das der Grund ist. Im Anschluss kannst Du dann entscheiden ob Du die CSS Regeln anpassen willst oder das Plugin ersetzt.

    WordPress ist "frei" wie in Freiheit es zu nutzen, aber nicht im Sinne von Freibier. Wer also glaubt man bekommt rund um WordPress alles kostenlos, der irrt. Hilfe ist ein Geschenk für das man sich bedankt, dafür gibt es den 'Gefällt mir' Button. Wer das nicht kann und sich selbst nicht zu helfen weiss, muss sich bezahlte Unterstützung suchen.

  • Persönlich würde ich meinen, das Problem liegt an dem div.product .images .thumbnails {position:absolute;} in der style.css ab Zeile 2322 - denn genau diese Anweisung "schiebt" diesen unteren Bereich über das Bild. Wenn man diese Anweisung (wie von Flexslider vorgesehen) in relative ändert rutschen die Thumbnails brav unter das Produktbild.

    Was allerdings unangenehm auffällt ist, dass bei dem Beispielprodukt das Bild schon kleiner ist als vorgesehen und somit gezoomt wird... das sieht unschön pixelig aus. Da Du das Überlappungsproblem ohnehin nicht mit Bildgrößen korrigieren kannst würde ich Dir empfehlen, die Bildgröße wieder etwas zu erhöhen - da auf width:100% skaliert wird Minimum 500 px Breite.

    Man kann die Realität ignorieren - aber nicht die Folgen der ignorierten Realität.

  • Hey, vielen Dank für eure Hilfe.

    Leider hat sich nichts verändert. Ich habe das Plugin deinstalliert und die div.product .images .thumbnails {position:absolute;} in der style.css auf relative geändert. Trotzdem wandern die Thumbnails nicht unter das Produktbild. Könntet ihr euch das ganze vielleicht noch einmal anschauen, vielleicht habe ich ja etwas falsch gemacht.


  • Leider hat sich nichts verändert.


    Hast Du mal nen "richtigen" Reload mit Strg + F5 gemacht? Bei mir jedenfalls sitzen die Thumbnails jetzt brav darunter.

    Man kann die Realität ignorieren - aber nicht die Folgen der ignorierten Realität.

Jetzt mitmachen!

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