Vendors page products too small in mobile layout

We're shifting our Forum based support to a more dedicated support system!

We'll be closing our Forum support from 10th June, 2020 and move to Email Support assistance.

  • If you are a WCFM premium add-ons user, contact us- here
  • Want to know more before buying our add-ons? Send Pre sale queries- here
  • If you are a WCFM free user, please open a support ticket at WordPress.org
  • For WCFM App related queries, reach us- here
From now the forum will be read-only!

Multi Vendor Marketplace Plugin | WCFM Marketplace Forums Product Vendors Vendors page products too small in mobile layout

Viewing 3 reply threads
  • Author
    Posts
    • #116349
      samin.khanaki
      Participant

      Hello I already shared this problem with you. Unfortunately when I tried to send another reply to your request for url website made an error which says you must be loged in to send posts and there was no way to solve this problem. any way here is the post i sent you before:
      #111710
      I used wcfm for my website, everything is perfect except product tiles in vendors page in mobile version. When customers go directly to woocommerce product page in their mobiles it shows 2 product in each row so they can see products very well. but when they go inside of a vendors page to check its products it shows 5 products in each row, just same as desktop layout which make them very small in mobile layout. how can i change number of products per row in vendors page mobile layout?

      Here is a sample vendor page URL: https://www.monjooq.com/store/roxie-gallery/
      I also attached a photos from my shop page which is my ideal format of showing product tiles. and in the URL you can see product tiles format that is too small.

      Thanks in advance

      Attachments:
      You must be logged in to view attached files.
    • #116776
      Sayan Naskar
      Keymaster

      Hello,
      Use the following code in the custom css section of your theme.


      @media
      (max-width: 544px) {
      #wcfmmp-store .product_area .products-wrapper ul.products li.product:nth-child(2n) {
      margin-left: 0;
      clear: left;
      }
      #wcfmmp-store .product_area .products-wrapper ul li.product {
      width: calc(50% – 10px);
      display: inline-block;
      }
      #wcfmmp-store .product_area .products-wrapper ul.products li.product:nth-child(2n+1) {
      clear: right;
      }
      }

    • #116861
      samin.khanaki
      Participant

      unfortunately didnt work. nothing changed at all.

      Attachments:
      You must be logged in to view attached files.
    • #117303
      Sayan Naskar
      Keymaster

      The styles you have written are not loading up on your site. Can you write the style in the customizer custom CSS section? and also try to clear the cache?

Viewing 3 reply threads
  • You must be logged in to reply to this topic.