Change order of section for mobile (Dawn)

[manbru]

Hello,

On bigger screens the product description is under the image slider like this:

But on mobile I don't want the product desctiption directly under the images becuse it looks like this:

And then the buy button and that comes after which i want above the description.

Here's my store: https://r1vex.myshopify.com/ 

 

Thanks for helping!

[topnewyork]

Hi @manbru ,

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file
3. In theme.liquid, paste the below code before </head>

<style>
@media (max-width: 768px) {
    .product__description.rte.quick-add-hidden {
        position: relative !important;
        top: 360px !important;
    }

    product-info {
        position: relative !important;
        bottom: 395px !important;  
    }
}
</style>

If my reply is helpful, kindly click like and mark it as an accepted solution.

Thanks!

[BSSCommerce-B2B]

@manbru ,

Step 1. Go to Admin -> Online store -> Theme > Edit code

Step 2. Find the file theme.liquid.

Step 3. Add this code above </body>

<script>
document.addEventListener('DOMContentLoaded', function() {
  function moveDescription() {
    var description = document.querySelector('.product__description');
    var infoWrapper = document.querySelector('.product__info-wrapper product-info');

    if (window.innerWidth < 768) {
      if (description && infoWrapper) {
        infoWrapper.insertAdjacentElement('afterend', description);
      }
    }
  }
  moveDescription();
});
</script>

result:

[manbru]

This code did unfortunately not work?

[topnewyork]

Hi @manbru , kindly try my code please.

[manbru]

Thanks, but I just fixed it!