# CMS Tabs with multi-referenced tab link

**URL:** <https://forum.finsweet.com/t/cms-tabs-with-multi-referenced-tab-link/1935>\
**Category:** Attributes\
**Created:** [September 19, 2023, 3:30pm UTC](https://forum.finsweet.com/t/cms-tabs-with-multi-referenced-tab-link/1935 "2023-09-19T15:30:40Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![filip.radkiewicz](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.finsweet.com/filip.radkiewicz/32/807_2.png) [@filip.radkiewicz](https://forum.finsweet.com/u/filip.radkiewicz)\
**Post date:** [September 19, 2023, 3:30pm UTC](https://forum.finsweet.com/t/cms-tabs-with-multi-referenced-tab-link/1935/1 "2023-09-19T15:30:40Z")

</div>

In the past I was able to create CMS Tabs with a single-reference element as a tab link.

Now, I’m trying to create a tab component with two separate collection lists: one for tab links (list of problems), and the second for tabs content (list of corresponding services that solve them).

Everything’s set up correctly when it comes to the tab component — “Problems” is the primary collection list and is being pulled to the tab component by CMS Tabs, where “Services” is a nested collection inside Problems.

The issue is that Webflow doesn’t allow to filter nested collection. It’s a critical feature for the client to do so.

I’ve tried to nest the Services inside Problems to filter the nested collection but it seems that it’s not possible with Attributes — Services’ collection items are not being displayed inside CMS Tabs.

Do you guys have any idea how to properly set up?

Preview: [https://preview.webflow.com/preview/probody-one?utm\_medium=preview\_link&utm\_source=designer&utm\_content=probody-one&preview=54f13677a183f1c2e084a4a0bc632460&pageId=642fe4509fb1f7047031f799&workflow=preview](https://preview.webflow.com/preview/probody-one?utm_medium=preview_link&utm_source=designer&utm_content=probody-one&preview=54f13677a183f1c2e084a4a0bc632460&pageId=642fe4509fb1f7047031f799&workflow=preview)

---

<div class="post-metadata">

**Author:** ![Support-Luis](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.finsweet.com/support-luis/32/53_2.png) [@Support-Luis](https://forum.finsweet.com/u/Support-Luis)\
**Post date:** [September 20, 2023, 9:29am UTC](https://forum.finsweet.com/t/cms-tabs-with-multi-referenced-tab-link/1935/2 "2023-09-20T09:29:22Z")

</div>

Hey @filip.radkiewicz one thing we can try is to prevent CMS Tabs from loading until CMS Nest has finished nesting the items.

For this you’ll need to change the CMS Tabs script to this

```auto
<!-- [Attributes by Finsweet] CMS Tabs -->
<script
  defer
  fs-attributes-preventload="true"
  src="https://cdn.jsdelivr.net/npm/@finsweet/attributes-cmstabs@1/cmstabs.js"
></script>

```

and then add this callback function that initializes CMS Tabs

```auto
<script>
  window.fsAttributes = window.fsAttributes || [];
  window.fsAttributes.push([
    'cmsnest',
    (listInstances) => {
      console.log('cmsnest Successfully loaded!');
      window.fsAttributes.cmstabs.init();
    },
  ]);
</script>

```

---

<div class="post-metadata">

**Author:** ![filip.radkiewicz](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.finsweet.com/filip.radkiewicz/32/807_2.png) [@filip.radkiewicz](https://forum.finsweet.com/u/filip.radkiewicz)\
**Post date:** [September 20, 2023, 9:58am UTC](https://forum.finsweet.com/t/cms-tabs-with-multi-referenced-tab-link/1935/3 "2023-09-20T09:58:08Z")

</div>

> [@Support-Luis](#):
>
> ```auto
> <!-- [Attributes by Finsweet] CMS Tabs -->
> <script
> defer
> fs-attributes-preventload="true"
> src="https://cdn.jsdelivr.net/npm/@finsweet/attributes-cmstabs@1/cmstabs.js"
> ></script>
> 
> ```

Hey @Support-Luis

I’ve restored CMS Nest and implemented your scripts, but without any luck.

Services still don’t show up next to Problems (you can check here: [https://probody-one.webflow.io/kosmetologia](https://probody-one.webflow.io/kosmetologia))

---

<div class="post-metadata">

**Author:** ![Support-Luis](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.finsweet.com/support-luis/32/53_2.png) [@Support-Luis](https://forum.finsweet.com/u/Support-Luis)\
**Post date:** [September 20, 2023, 10:24am UTC](https://forum.finsweet.com/t/cms-tabs-with-multi-referenced-tab-link/1935/4 "2023-09-20T10:24:03Z")

</div>

On my end I do see some elements being nested into the tabs, however it seems you have added a `hide` class and no elements are visible.

 ![Screen Shot 2023-09-20 at 12.20.40](https://europe1.discourse-cdn.com/flex013/uploads/finsweet1/original/2X/7/7ece00012d3b578372a8c78a506b0185d035363e.jpeg)

This might come from you hiding the collection list directly which breaks the attribute. Can you wrap your list in a div and hide this wrapper?

---

<div class="post-metadata">

**Author:** ![filip.radkiewicz](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.finsweet.com/filip.radkiewicz/32/807_2.png) [@filip.radkiewicz](https://forum.finsweet.com/u/filip.radkiewicz)\
**Post date:** [September 20, 2023, 10:41am UTC](https://forum.finsweet.com/t/cms-tabs-with-multi-referenced-tab-link/1935/5 "2023-09-20T10:41:46Z")

</div>

Yep, it works. I should took to heart the instruction from Attributes’ site to not hiding Collection List (but I thought that it was related to the List not Wrapper.

Thanks!

---

<div class="post-metadata">

**Author:** ![Support-Luis](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.finsweet.com/support-luis/32/53_2.png) [@Support-Luis](https://forum.finsweet.com/u/Support-Luis)\
**Post date:** [September 20, 2023, 10:42am UTC](https://forum.finsweet.com/t/cms-tabs-with-multi-referenced-tab-link/1935/6 "2023-09-20T10:42:33Z")

</div>

Great to hear this! You are welcome!