# Repeater AB Design – Alternating Column Layout?

**URL:** <https://forum.wixstudio.com/t/repeater-ab-design-alternating-column-layout/70202>\
**Category:** Ask the community\
**Tags:** wix-studio, question, wix-restaurants, design, cms\
**Created:** [April 8, 2025, 7:24pm UTC](https://forum.wixstudio.com/t/repeater-ab-design-alternating-column-layout/70202 "2025-04-08T19:24:07Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![yo7554](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/yo7554/32/16596_2.png) [@yo7554](https://forum.wixstudio.com/u/yo7554)\
**Post date:** [April 8, 2025, 7:24pm UTC](https://forum.wixstudio.com/t/repeater-ab-design-alternating-column-layout/70202/1 "2025-04-08T19:24:08Z")

</div>

I’m building out a restaurant client’s website in Wix Studio and we want to have a page with the local purveyors they work with, in the form of a dataset-connected repeater so they can add and remove easily.

It looks like only certain properties can be changed between A & B designs, but not the layout. The trouble with this is I really wanted a layout that alternates the columns so the page doesn’t look so lopsided. Current layout:

 ![Screenshot 2025-04-08 at 12.17.02 PM](https://us1.discourse-cdn.com/wix/original/3X/0/7/071d3f92acbf14e1f9a22b7180db8e6c74af080d.jpeg)

Desired layout:

 ![Screenshot 2025-04-08 at 12.16.48 PM](https://us1.discourse-cdn.com/wix/original/3X/b/1/b1f758d7a54234e1392aca080a60c0c92c9c847d.jpeg)

For mobile, I’d like to maintain a vertically stacked layout:

 ![Screenshot 2025-04-08 at 12.22.43 PM](https://us1.discourse-cdn.com/wix/original/3X/8/8/88244c810ce85edf7d82eee6f331ed9cb4eee614.jpeg)

---

<div class="post-metadata">

**Author:** ![DeanAyalon](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/deanayalon/32/94633_2.png) [@DeanAyalon](https://forum.wixstudio.com/u/DeanAyalon)\
**Post date:** [April 8, 2025, 10:00pm UTC](https://forum.wixstudio.com/t/repeater-ab-design-alternating-column-layout/70202/2 "2025-04-08T22:00:52Z")

</div>

Alternating a repeater’s layout is not natively supported  
You could, however, work around this:  
In the repeater’s occurrence, design both row versions, then collapse them based on index

Something like this:  
#repeater contains #oddBox and #evenBox, for the odd- and even-numbered boxes, repectively

```js
$w('#repeater').onItemReady(($item, itemData, index) => {
    if (index % 2) $item('#evenBox').collapse()
    else $item('#oddbox').collapse()
}

```

---

<div class="post-metadata">

**Author:** ![yo7554](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/yo7554/32/16596_2.png) [@yo7554](https://forum.wixstudio.com/u/yo7554)\
**Post date:** [April 9, 2025, 2:43am UTC](https://forum.wixstudio.com/t/repeater-ab-design-alternating-column-layout/70202/3 "2025-04-09T02:43:57Z")

</div>

Thank you, Dean! This didn’t seem to work. Are there values I should be switching out? I’m quite code illiterate, so I could totally be missing something obvious!

---

<div class="post-metadata">

**Author:** ![DeanAyalon](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/deanayalon/32/94633_2.png) [@DeanAyalon](https://forum.wixstudio.com/u/DeanAyalon)\
**Post date:** [April 9, 2025, 8:00am UTC](https://forum.wixstudio.com/t/repeater-ab-design-alternating-column-layout/70202/4 "2025-04-09T08:00:34Z")

</div>

Each of your elements has an id (aka tag)  
My code accesses a repeater with the tag `#repeater`, make sure yours is named that way, or change it in the code  
Same goes with the boxes

> **[Alternating Repeater | Wix SDK Demos](https://yaron-ayalon.wixstudio.com/demos-sdk/alt-repeater)**

Editor:

 ![alternating repeater editor](https://us1.discourse-cdn.com/wix/original/3X/6/5/65a007e47a95c458493c1f3cdf5639839d7a7696.jpeg)

---

<div class="post-metadata">

**Author:** ![yo7554](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/yo7554/32/16596_2.png) [@yo7554](https://forum.wixstudio.com/u/yo7554)\
**Post date:** [April 9, 2025, 5:08pm UTC](https://forum.wixstudio.com/t/repeater-ab-design-alternating-column-layout/70202/5 "2025-04-09T17:08:55Z")

</div>

I believe I had the tags correct, but maybe I’m building the repeater incorrectly?

 ![Screenshot 2025-04-09 at 10.04.24 AM](https://us1.discourse-cdn.com/wix/original/3X/3/f/3fff9e669b91c56e08adf110b8603dd84fe1b76e.jpeg)  
I assume each side would be in its own box, and that’s the box being referenced?

---

<div class="post-metadata">

**Author:** ![DeanAyalon](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/deanayalon/32/94633_2.png) [@DeanAyalon](https://forum.wixstudio.com/u/DeanAyalon)\
**Post date:** [April 10, 2025, 6:49am UTC](https://forum.wixstudio.com/t/repeater-ab-design-alternating-column-layout/70202/6 "2025-04-10T06:49:31Z")

</div>

No. look at the picture I sent  
Each repeater occurrence has those two boxes **underneath** each other, so that when one collapses, the other is the only one left, and the gaps between disappear

Each repeater element has both the dark and light gray boxes in my build, only they alternate based on row index