Artikelseite: Galeriebilder unter dem Artikelbild

Thema wurde von barbara, 25. Januar 2021 erstellt.

  1. Anonymous

    Anonymous Mitglied

    Registriert seit:
    15. November 2018
    Beiträge:
    9
    Danke erhalten:
    3
    Danke vergeben:
    24
    Ich habe die beiden Codes aus deinen oberen Beiträgen genutzt. Dort war für den genannten Code ja "height: 680px " angegeben.

    Ich habe dann nun quasi folgendes im CSS eintragen gehabt und es auch mit anderen Werten versucht. Nun auch die 850. Das Problem bleibt bestehen.

    Code:
    .product-info .product-info-stage {
        padding: 15px;
    }
    @media (min-width: 992px){
    .product-info .product-info-stage {
        height: 680px;
    }}
    
    @media (min-width: 992px){
    .product-info-thumbnails-mobile,
    .swiper-slide-inside .align-vertical, .product-info-layer-thumbnails #product_thumbnail_swiper_mobile .swiper-slide-inside .align-vertical,
    .product-info-thumbnails-mobile #product_thumbnail_swiper_mobile{
    height: 100% !important;
    }}
    Und dann noch eine Frage. Wie kommst du an die generelle Bildhöhe 405px? Ich habe im Styledit 650px bzw. 300px eingestellt. In den Bildoptionen 900.

    Sorry aber ich kann gerade erst laufen ;)
     
  2. barbara

    barbara G-WARD 2014-2020

    Registriert seit:
    14. August 2011
    Beiträge:
    35.352
    Danke erhalten:
    11.198
    Danke vergeben:
    1.601
    Das steht in der Konsole von Chrome:

    upload_2021-9-19_22-38-6.png


    Du hast den Code neu eingegeben, oder?
    zumindest sehe ich den jetzt 2x in der Konsole, einmal mit 680px und einmal mit 850px.
    Ändere den ersten Code, Speichern, den Style Editor Speichern und dann schauen.
    Wenn das nciht übernommen wird, dann muss man den Holzhammer zur Hilfe nehmen:

    Code:
    @media (min-width: 992px){
    .product-info .product-info-stage {
        height: 850px !important;
    }}
     
  3. barbara

    barbara G-WARD 2014-2020

    Registriert seit:
    14. August 2011
    Beiträge:
    35.352
    Danke erhalten:
    11.198
    Danke vergeben:
    1.601
    Noch etwas: Deine Bilder sind sehr unterschiedlich groß, mal Quer und mal hochkant.
    Dadurch passen die Galeriebilder nicht überall. Bei den Bildern im Querformat passte es, bei Hochformat ist es zu hoch.

    Besser und aufgeräumter sieht es aus, wenn die Bilder immer gleich groß sind.
    Also z.B. immer 1000 x 1000px im Original.
     
  4. Anonymous

    Anonymous Mitglied

    Registriert seit:
    15. November 2018
    Beiträge:
    9
    Danke erhalten:
    3
    Danke vergeben:
    24
    Es hat nun erst unter Hinzunahme von "!important" funktioniert. Vielen lieben Dank!

    Woher die 405px kommt, kann ich mir aber nach wie vor leider nicht erklären. :(

    Und danke für den Hinweis mit den Bildern. Da arbeiten wir momentan bereits dran.:)
     
  5. hartwigbusse

    hartwigbusse Erfahrener Benutzer

    Registriert seit:
    10. Dezember 2014
    Beiträge:
    1.161
    Danke erhalten:
    254
    Danke vergeben:
    420
    Hallo und guten Tag,
    hat alles geklappt und schaut richtig gut aus.
    Aber mal noch eine Frage dazu. Bei vier Bildern schaut das richtig gut aus. Aber z.B. bei zweien oder drei dann wird es an den linken Rand gebracht. Nun meine Frage. Ist es möglich die Bilder mittig zu setzen? Ohne das es einen negativen Einfluss auf Mobile hat.
    Danke..
     

    Anhänge:

  6. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    14. Juni 2018
    Beiträge:
    1.551
    Danke erhalten:
    228
    Danke vergeben:
    1.001
    #26 Anonymous, 11. November 2021
    Zuletzt bearbeitet: 11. November 2021
    Ah endlich den Thread gefunden, hier hatte ich das damals her :)

    Habe neulich ein Problem auf Mobile entdeckt.

    Das Problem: Wenn der Platz auf dem Desktop ausreicht, um alle Artikelthumbnails darzustellen, werden die kleinen Slider-Pfeile nicht angezeigt -> auch nicht in der Mobile Variante. Dort würden sie aber benötigt werden da nur 2 Bilder angezeigt werden.


    Auf dem Desktop passen z.B. locker 4 Bilder, auf Mobile dagegen nur 2 max 3.
    Ich habe das wie hier im Thread beschrieben so eingebaut mit slidesPerView\": 4 bei Desktop und slidesPerView\": 2 bei Mobile.

    Klappt auch alles hervorragend bis auf das die Swiper Pfeile bei Mobile fehlen.

    Die Swiper Pfeile werden bei Artikel mit 3 & 4 Bildern nicht angezeigt. Auf dem Desktop ja korrekt weil eh alle Bilder zu sehen sind aber bei Mobile sind halt nur 2 Bilder zu sehen und die Swiper Pfeile fehlen.

    Jemand eine Idee wie ich die Swiper Pfeile auf Mobile immer einblenden könnte?
    (Siehe Bild, diese Pfeile meine ich. Werden bei Mobile nur angezeigt wenn sie auch in der Desktop Version angezeigt werden - also bei mehr als 4 Bildern.)
     

    Anhänge: