Ondersteuning » Thema en CSS/opmaak » 2 producten per kolom in categorieën op mobile devices

2 producten per kolom in categorieën op mobile devices

  • Opgelost annatimmers

    (@annatimmers)


    1 jaar, 5 maanden geleden

    Hallo,

    Op mobile devices laat mijn webshop maar 1 product naast elkaar zien, terwijl ik graag zou willen dat er 2 producten naast elkaar staan. Ik heb al veel CSS codes geprobeerd. Deze werken echter niet, omdat mijn producten in een categorie staan en niet op een “pagina”. Weet iemand een oplossing voor dit probleem?

    Alvast bedankt!

    Groetjes,
    Anna

    De pagina waar ik hulp bij nodig heb: [log in om de link te zien]

5 reacties aan het bekijken - 1 tot 5 (van in totaal 5)
  • Guido

    (@guido07111975)

    1 jaar, 5 maanden geleden

    Hoi Anna,

    Het is alleen 1 product per rij in een vrij klein scherm (480 pixels breed of minder). De CSS-code (layout) hiervan is niet heel eenvoudig aan te passen.

    Guido

    Thread starter annatimmers

    (@annatimmers)

    1 jaar, 5 maanden geleden

    Hallo Guido,

    Bedankt voor uw reactie! Is er een manier waarop ik ervoor kan zorgen dat het scherm op mobile devices groter word dan 480 pixels?

    Groetjes,

    Anna

    Guido

    (@guido07111975)

    1 jaar, 5 maanden geleden

    Hoi,

    Dat is onderdeel van de WooCommerce Blocks plugin die je gebruikt.

    Voeg dit eens toe op pagina Extra CSS van de Customizer in je dashboard:

    @media screen and (max-width:480px) {
	.wc-block-grid.has-2-columns .wc-block-grid__products {display:flex;}
	.wc-block-grid.has-2-columns .wc-block-grid__product {flex: 1 0 50%; margin-left:0; margin-right:0; max-width:50%;}
}

    Als het goed is worden er nu 2 producten in een rij getoond in klein scherm.

    Guido

    Thread starter annatimmers

    (@annatimmers)

    1 jaar, 5 maanden geleden

    Hai,

    Heel erg bedankt! Er staan nu inderdaad 2 producten per kolom.

    Groetjes,

    Anna

    Guido

    (@guido07111975)

    1 jaar, 5 maanden geleden

    Graag gedaan 🙂

    Guido

5 reacties aan het bekijken - 1 tot 5 (van in totaal 5)
  • Het onderwerp ‘2 producten per kolom in categorieën op mobile devices’ is gesloten voor nieuwe reacties.

Onderwerptags

Weergaven