Bilder in der Voschau

Thema wurde von SD, 5. Januar 2021 erstellt.

  1. SD

    SD Erfahrener Benutzer

    Hallo zusammen,
    drehe mich momentan im Kreis! Wo kann ich die Farbe der Vorschaubilder ändern? Siehe Bild anbei.


    Danke im Voraus!
     

    Anhänge:

  2. Anonymous

    Anonymous Erfahrener Benutzer

    Habs mal mit css durch Chromebrowser/Untersuchen gefunden
    Bildschirmfoto 2021-01-05 um 14.32.06.png Bildschirmfoto 2021-01-05 um 14.31.58.png ..
    Hier zwei Screenshots..
    Habe eine neue Zeile angefügt:
    backgroundcolor: blue;
    Wo die Zeile im main.min.css nun genau ist, weiß ich nicht..
    musst du mal suchen
     
  3. barbara

    barbara G-WARD 2014-2020

    Da macht man das nicht, sondern im eigenen css im Style Editor.
    dazu nimmt man das ganze
    .product-info-thumbnails.....
    (zumindest das in Fettschrift)
    und die zu ändernde Zeile
    müsste dann etwa so aussehen:
    .product-info-thumbnais .swiper-slide .swiper-slide-inside .vertical .align-middle{
    background-color: #Farbcode;
    }
     
  4. Anonymous

    Anonymous Erfahrener Benutzer

    Ja, das ist die charmantere Lösung!
    Danke Barbara!
     
  5. SD

    SD Erfahrener Benutzer

    Danke ich teste es mal und gebe Bescheid obs funktioniert hat! Danke;)
     
  6. SD

    SD Erfahrener Benutzer

    .product-info-thumbnails .swiper-slide .swiper-slide-inside .vertical .align-middle{
    background-color: #DBD6D6;
    }

    Das funktioniert leider nicht:(
     
    Zuletzt bearbeitet: 5. Januar 2021
  7. SD

    SD Erfahrener Benutzer

    So hat es funktioniert, aber nur auf der Artikelseite

    .product-info-thumbnails .swiper-slide .swiper-slide-inside.vertical .align-middle, .product-info-thumbnails-mobile .swiper-slide .swiper-slide-inside.vertical .align-middle, .product-info-layer-thumbnails .swiper-slide .swiper-slide-inside.vertical .align-middle {

    display: table-cell;

    vertical-align: middle;

    padding-bottom: 2px;

    background-color: #DBD6D6;

    }



    Auf der Startseite leider nicht, da mach ich noch irgendetwas falsch!
     
  8. barbara

    barbara G-WARD 2014-2020

    Versuche es mal mit:
    Code:
    .product-container .gallery > li {
        background-color: #DBD6D6 !important;
    }
    Vielleicht geht es.
    Aber nur ganz vielleicht, weil die Farbe offenbar fest in der Datei steht und das meistens alles überschreibt.
     
  9. SD

    SD Erfahrener Benutzer


    Hat geklappt, Du bist die Beste:) Danke;)
     
  10. SD

    SD Erfahrener Benutzer

    Ich nochmal! Das ganze funktioniert gut auf dem Desktop, aber auf Mobilen Geräten wird der weiße Hintergrund immer noch angezeigt. Wie kann ich das lösen?
     
  11. barbara

    barbara G-WARD 2014-2020

    Das ist dann wieder im Artikel.
    Versuche es mit:
    Code:
    .product-info-thumbnails-mobile .swiper-slide{
    background-color: #DeinFarbcode;
    }
    oder Du nimmst den ganzen Codebereich aus dem Foto von Roland Collin und nciht nur mein Beispiel oben. Das sollte auch gehen.