# How to set Simple on Desktop and Half on Mobile

**URL:** <https://community.elfsight.com/t/how-to-set-simple-on-desktop-and-half-on-mobile/140731>\
**Category:** Platform Tips\
**Tags:** squarespace\
**Created:** [October 20, 2025, 9:55am UTC](https://community.elfsight.com/t/how-to-set-simple-on-desktop-and-half-on-mobile/140731 "2025-10-20T09:55:35Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![tuanphan](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/tuanphan/32/3165_2.png) [@tuanphan](https://community.elfsight.com/u/tuanphan)\
**Post date:** [October 20, 2025, 9:55am UTC](https://community.elfsight.com/t/how-to-set-simple-on-desktop-and-half-on-mobile/140731/1 "2025-10-20T09:55:36Z")

</div>

To set Simple on Desktop

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/9/5/9542dfa21d6a5de5a7b3ef4d6464714d642a770a.png)

and Half layout on Mobile.

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/2/7/27c83859e7717b7d5f36bbfe145069217e494c0c.png)

**#1.** First, edit **Product** \> Choose **Simple layout**

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/4/7/47c06f26186725a0b219ece7923ee94cf60d649b.png)

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

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/b/7/b796638d605355eceb63fc649c7aaa1caaf8083e.png)

**#3.** Click **Advanced** \> Page **Header Code Injection**

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/9/6/967ef1a125d4461f6d340036970de37b315863e6.png)

**#4.** Next, use this code to right box

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

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

```

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/0/e/0ea06d16bc1c6f61f8ef1c2944403d1fb91e27a9.jpeg)
