# How to have combined lists to respect Webflow sorting?

**URL:** <https://forum.finsweet.com/t/how-to-have-combined-lists-to-respect-webflow-sorting/7401>\
**Category:** Attributes\
**Tags:** attributes-v2, list-combine\
**Created:** [July 1, 2026, 10:06am UTC](https://forum.finsweet.com/t/how-to-have-combined-lists-to-respect-webflow-sorting/7401 "2026-07-01T10:06:34Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![thesourdoughstudio](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.finsweet.com/thesourdoughstudio/32/2025_2.png) [@thesourdoughstudio](https://forum.finsweet.com/u/thesourdoughstudio)\
**Post date:** [July 1, 2026, 10:06am UTC](https://forum.finsweet.com/t/how-to-have-combined-lists-to-respect-webflow-sorting/7401/1 "2026-07-01T10:06:34Z")

</div>

Hello hello,

Does anyone know how to get combined list instances to be sorted into the main combined list by Webflow’s native sorting function ( **not** a visitor initiated sort action using list-sort).

Right now my 2 list instances sit at the bottom of the combined list and I would like them to be sorted by date within the combined list (but not allow visitors to change this sorting).

Here’s my read only link: [Webflow - Apoha 2026](https://preview.webflow.com/preview/apoha2026?utm_medium=preview_link&utm_source=designer&utm_content=apoha2026&preview=3c379c22c75a1399b4b82b1d5fd5bc97&pageId=6a3bc1902c4d26cbb8fd1818&locale=en&workflow=preview)

Many thanks to whoever can help!

---

<div class="post-metadata">

**Author:** ![Support-Finn](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.finsweet.com/support-finn/32/5169_2.png) [@Support-Finn](https://forum.finsweet.com/u/Support-Finn)\
**Post date:** [July 1, 2026, 11:02am UTC](https://forum.finsweet.com/t/how-to-have-combined-lists-to-respect-webflow-sorting/7401/2 "2026-07-01T11:02:37Z")

</div>

Hey @thesourdoughstudio!

This is a common point of confusion with the combine feature. **Webflow’s native CMS sorting only applies per-collection-list** , so once fs-list-combine merges your lists together, that per-collection sort order doesn’t carry through to the combined output — which is why your 2 combined instances end up at the bottom. They’re just appended after the target list renders.

The good news is there’s a verified two-part setup to get automatic date sorting on the combined list without any visitor-triggered interaction.

Part 1 — Add a hidden sort-trigger element

You need a sort-trigger element in your DOM, but you can hide it completely from visitors. Add a button inside your combined list section with these attributes:

- **fs-list-element** = `sort-trigger`
- **fs-list-field** = `[your-date-field-slug]`
- **fs-list-fieldtype** = `date`

Set it to `display: none` in Webflow’s style panel. Replace `[your-date-field-slug]` with the actual slug of your date field — you can find this in your CMS Collection settings.

Part 2 — Add the callback script

Drop this into your page’s Before `</body>` custom code section:

```auto
<script>
  window.FinsweetAttributes ||= [];
  window.FinsweetAttributes.push([
    'list',
    (listInstances) => {
      const [listInstance] = listInstances;
      listInstance.addHook('afterRender', (items) => {
        listInstance.sorting.value.fieldKey = '[your-date-field-slug]';
        listInstance.sorting.value.direction = 'desc';
      });
    },
  ]);
</script>

```

Same slug value as Part 1. Change `'desc'` to `'asc'` if you want oldest first.

One thing worth flagging — if you have multiple list instances on the page with different combine groups, you may need to target the correct instance rather than just taking the first one (`listInstances[0]`). Let us know if that’s the case and we can adjust.

Also, the HTML you shared looks like it’s from your home page rather than the page with the combined lists. If you run into any issues, could you share the staging URL for that specific page? That way we can check the attribute structure directly. 🙏

---

<div class="post-metadata">

**Author:** ![thesourdoughstudio](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.finsweet.com/thesourdoughstudio/32/2025_2.png) [@thesourdoughstudio](https://forum.finsweet.com/u/thesourdoughstudio)\
**Post date:** [July 6, 2026, 11:49am UTC](https://forum.finsweet.com/t/how-to-have-combined-lists-to-respect-webflow-sorting/7401/3 "2026-07-06T11:49:23Z")

</div>

Hey,

I’ve implemented this - but it doesn’t seem to be working - could someone please take a look at my read-only and see what i’m doing wrong.

Thanks!

---

<div class="post-metadata">

**Author:** ![jesse.muiruri](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.finsweet.com/jesse.muiruri/32/6611_2.png) [@jesse.muiruri](https://forum.finsweet.com/u/jesse.muiruri)\
**Post date:** [July 6, 2026, 1:26pm UTC](https://forum.finsweet.com/t/how-to-have-combined-lists-to-respect-webflow-sorting/7401/4 "2026-07-06T13:26:46Z")

</div>

Hey @thesourdoughstudio let me check it out

---

<div class="post-metadata">

**Author:** ![jesse.muiruri](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.finsweet.com/jesse.muiruri/32/6611_2.png) [@jesse.muiruri](https://forum.finsweet.com/u/jesse.muiruri)\
**Post date:** [July 6, 2026, 5:53pm UTC](https://forum.finsweet.com/t/how-to-have-combined-lists-to-respect-webflow-sorting/7401/5 "2026-07-06T17:53:03Z")

</div>

Hey @thesourdoughstudio

The target list `fs-list-combine="resources"` and the other two instance lists `fs-list-instance="resources"` are setup correct  
The sort trigger has the right attributes added `fs-list-element="sort-trigger"` & `fs-list-field="date"`

However no `Collection Item` on any of the lists exposes a `date` field to sort by  
The current date element on the items only has the class `caption` with no `fs-list-field`  
Finsweet’s List Sort can only sort by fields it can find, right now there’s nothing tagged `date` on any collection item

Another potential issue is that the dates typically have the format `7.6.2026` which will most likely fail to resolve to an actual date while parsing  
It needs to be an ISO format date such as `2026-07-06` i.e. `yyyy-mm-dd`  
I would recommend adding in a `hidden` element with the correct date format `yyyy-mm-dd` then give it the needed attributes

```auto
<div class="hide" fs-list-field="date" fs-list-fieldtype="date">2026-07-06</div>

```

Then update the previous script with this one

```auto
<script>
window.FinsweetAttributes ||= [];
  window.FinsweetAttributes.push([
    'list',
    (listInstances) => {
      const [listInstance] = listInstances;
      listInstance.addHook('afterRender', () => {
        listInstance.sorting.value = { fieldKey: 'date', direction: 'desc' };
      });
    },
  ]);
</script>

```

---

<div class="post-metadata">

**Author:** ![thesourdoughstudio](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.finsweet.com/thesourdoughstudio/32/2025_2.png) [@thesourdoughstudio](https://forum.finsweet.com/u/thesourdoughstudio)\
**Post date:** [July 7, 2026, 9:42am UTC](https://forum.finsweet.com/t/how-to-have-combined-lists-to-respect-webflow-sorting/7401/6 "2026-07-07T09:42:04Z")

</div>

Hi @jesse.muiruri

Thank you so much for looking into this - I really appreciate it!

I think I’ve gotten it working now 🙂

However I would still like my pinned articles to appear at the top - do I follow a similar method to the above to achieve this?

---

<div class="post-metadata">

**Author:** ![jesse.muiruri](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.finsweet.com/jesse.muiruri/32/6611_2.png) [@jesse.muiruri](https://forum.finsweet.com/u/jesse.muiruri)\
**Post date:** [July 7, 2026, 11:17am UTC](https://forum.finsweet.com/t/how-to-have-combined-lists-to-respect-webflow-sorting/7401/7 "2026-07-07T11:17:40Z")

</div>

Hey @thesourdoughstudio

I was of the idea that leaving out the `fs-list-field="date"` & `fs-list-fieldtype="date"` attributes from the hidden div of the pinned items would conveniently leave them out of the sorting & so automatically have them floating at the very top

I now realize that that might actually not be the case, there’s no guarantee that they would remain at the top & there’s also potential for inconsistent results

Replace the previous script with this

```auto
<script>
window.FinsweetAttributes ||= [];
  window.FinsweetAttributes.push([
    'list',
    (listInstances) => {
      const [listInstance] = listInstances;

      listInstance.addHook('afterRender', (items) => {
        const container = document.querySelector('[fs-list-combine="resources"][fs-list-element="list"]');
        if (!container) return items;

        const itemEls = Array.from(container.querySelectorAll(':scope > [role="listitem"]'))
          .filter((el) => el.querySelector('.resource-inner-wrapper'));

        itemEls.sort((a, b) => {
          const aPinned = a.querySelector('.icon.pin') ? 1 : 0;
          const bPinned = b.querySelector('.icon.pin') ? 1 : 0;
          if (aPinned !== bPinned) return bPinned - aPinned;

          const aDate = a.querySelector('[fs-list-field="date"]')?.textContent.trim() ?? '';
          const bDate = b.querySelector('[fs-list-field="date"]')?.textContent.trim() ?? '';
          return new Date(bDate) - new Date(aDate);
        });

        itemEls.forEach((el) => container.appendChild(el));

        return items;
      });
    },
  ]);
</script>

```

Let me know!

---

<div class="post-metadata">

**Author:** ![thesourdoughstudio](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.finsweet.com/thesourdoughstudio/32/2025_2.png) [@thesourdoughstudio](https://forum.finsweet.com/u/thesourdoughstudio)\
**Post date:** [July 7, 2026, 3:56pm UTC](https://forum.finsweet.com/t/how-to-have-combined-lists-to-respect-webflow-sorting/7401/8 "2026-07-07T15:56:54Z")

</div>

This worked perfectly!

Thank you so much @jesse.muiruri
