Alternate Repeater Layouts in Wix

In this lesson, you will learn how to use your Wix CMS data to control different layouts in your Wix Repeaters.

---

$w.onReady(function () { $w('#dataset1').onReady(() => { $w('#repeater1').onItemReady(($item, itemData) => { let even = itemData.order; if (even % 2 == 0) { $item('#v2').show(); $item('#v2').expand(); $item('#v1').hide(); $item('#v1').collapse(); } else { $item('#v1').show(); $item('#v1').expand(); $item('#v2').hide(); $item('#v2').collapse(); } }) }) });

---

In order for this to work on your website, make sure you name your page elements to match the code OR rename the elements in the code to match the names you've given elements on your page. You may need to change for "database1", "repeater1", "order" (field key from database), "v1", and "v2". Once you change the name of the elements (or code), this method will work on your website!

Have fun!