Question 305348 in Wordpress Question posted in
The official Wordpress documentation can be found here.

WordPress – Optimizing Mobile Layout in AVADA: Maintaining 4 Columns on Desktop and Displaying 2 Columns on Mobile Devices

In WordPress, using the AVADA theme, a site configured with four columns defaults to a single-column layout on mobile devices. Conversely, configuring the site with six columns results in a two-column layout on mobile. The objective is to maintain a four-column configuration while achieving a two-column display on mobile devices.

the product display must be 4 columns desktop and 2 columns mobile. orders are managed by woocommerce

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    you can modify the code based on the selector used on my site https://sinergiafd.com/sinergia/index.php/accessori-per-calzature-2/ I added the code to see two columns in mobile mode but it only works if I'm logged in to the site

    I can not understand

    I paste the code I used, please help me

    @media screen and (max-width: 570px) {
    
    
.product-title.fusion-responsive-typography-calculated {
     font-size: min(11px, var(--h3_typography-font-size)) !important;
}

    enter code here

         .woocommerce.columns-4 ul.products {
         display: flex;
         flex-wrap: wrap;
     }
     .woocommerce.columns-4 ul.products li.product {
         flex: 0 0 50%;
         box-sizing: border-box;
         margin: 0;
         padding: 5px;
         height: car;
         overflow: hidden;
     }
     .woocommerce.columns-4 ul.products li.product img {
         width: 100%;
         height: car;
     }
}

  2. 0

    You can do that by using CSS media query,

     @media only screen and (min-width: 768px) {
 .your-column-cls {
  width: 25%; 
  }
  }

  /* Two columns on smaller screens (mobile) */
  @media only screen and (max-width: 767px) {
  .your-column-cls {
   width: 48%
   }
  }

    Please replace this class with your exact class which your using for the column "your-column-cls".

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search