ATTENTION, PLEASE READ: New topic creation is disabled, as we have moved to a new support system. Your existing topics will remain, but for all new requests you will need to use the new system. Click here to go to the new support request form.

• Back to forum

  Posted in: Atelier
• December 8, 2015 at 3:36 am #233806
  a040005

  Member

  Post count: 48

  Hello,

  How to make layout grid as the default view of product list on mobile?
  Default list view displays a product with width 100%.
  I’d like to change default view of product list to layout grid for mobile phone.

  I attach images below.

  Attachments:

  You must be logged in to view attached files.
  December 8, 2015 at 9:30 am #233863
  Kyle – SUPPORT

  Moderator

  Post count: 35880

  Hi

  This feature is highly requested so we have added to the list to add in a future update. For now add this to your custom css:

  @media only screen and (max-width: 479px) { 
    .woocommerce .products.product-grid .product:not(.product-layout-list) {
      float: left;
      width: 50%!important;
    }
  }

  – Kyle

  December 9, 2015 at 1:35 pm #234215
  a040005

  Member

  Post count: 48

  Thank you!

  December 9, 2015 at 1:44 pm #234221
  Kyle – SUPPORT

  Moderator

  Post count: 35880

  No problem

  April 10, 2016 at 4:11 pm #260530
  alexanderchristiansen

  Member

  Post count: 179

  Is this feature still not added to the theme or do we need to use the custom css?

  April 11, 2016 at 7:43 am #260561
  Kyle – SUPPORT

  Moderator

  Post count: 35880

  Hi

  For now use the custom css, I will remind the developer to add this option

  – Kyle

  November 27, 2016 at 10:49 pm #303843
  Julien_Frisch

  Member

  Post count: 18

  Hello Kyle,

  Same question as Alexander: is the feature still not added yet?

  Thanks,

  Julien

  November 28, 2016 at 7:11 pm #304045
  Rui Guerreiro – SUPPORT

  Keymaster

  Post count: 25779

  I’m not sure, will forward to our head developer so he can reply.

  -Rui

  November 29, 2016 at 6:28 pm #304264
  Swift Ideas – Ed

  Keymaster

  Post count: 15264

  Hi @Julien_Frisch

  Currently we only have the default display type option for all screen sizes. We still have a mobile override option on our list.

  Thanks,

  – Ed

  March 23, 2017 at 7:06 pm #318343
  jonathanthomas

  Member

  Post count: 17

  I’ve tried to use the CSS provided but it forces all screen sizes to use the grid view. Perhaps something has changed this this solution was posted? This is still a very much needed feature or at least temporary CSS patch / fix. Could you verify that this still works and if not provide an updated version?

  Thanks guys! You do an awesome job.

  March 23, 2017 at 7:17 pm #318344
  Rui Guerreiro – SUPPORT

  Keymaster

  Post count: 25779

  @jonathanthomas

  Can you describe exactly your issue and post a link to the page where you are seeing the issue?
  Thanks

  -Rui

  March 23, 2017 at 7:22 pm #318345
  jonathanthomas

  Member

  Post count: 17

  I’m sorry. This was a mistake on my part. A heads up to anyone else out there — do not have two windows open when you change settings in theme options. It can lead to conflicts. In my case the window I had open for Custom CSS also had the display mode set to grid. In another I was changing the display mode to standard. This was creating some very strange behavior that was hard to sort out!

  The Theme Options page is just one big page so even if you are working on settings in one section the other sections settings still have an affect when you click Save Changes.

  March 23, 2017 at 7:30 pm #318347
  Rui Guerreiro – SUPPORT

  Keymaster

  Post count: 25779

  No problem. Glad it’s sorted.

  -Rui

• Back to forum

  Posted in: Atelier