How to set Wrap on Desktop and Simple on Mobile

To set Wrap on Desktop

and Simple layout on Mobile.

#1. First, edit Product > Choose Wrap layout

#2. Next, click on Gear icon on Store Page

#3. Click Advanced > Page Header Code Injection

#4. Next, use this code to right box

<script>
function changeLayoutOnMobile() {
  if (window.innerWidth <= 768) {
    const productElement = document.querySelector('[data-product-detail-layout="wrap"]');
    if (productElement) {
      productElement.setAttribute('data-product-detail-layout', 'simple');
    }
  }
}

document.addEventListener('DOMContentLoaded', changeLayoutOnMobile);
window.addEventListener('resize', changeLayoutOnMobile);
</script>