Streaming live at 10am (PST)

Collections in Tabs

I am new to Webflow and am just playing at the moment to see if it meets my needs.

Ideally I would like to create a Menu using tabs, and have the Text in the Tab Link as well as the Tab Content linked to a Collection I have created in the CMS.

I can see that you can add collection information to the Tab Content easily, but can you add text to the Tab Link from the collection as I cannot see how to do this. If I try to drag the Collection List into the Tab Link I get an error “Collection List Wrapper Cannot be Placed in a Tab Link”

I read somewhere that you can ‘Force’ this by pressing ALT and dragging the Collection List but this does not seem to make any difference.

Any help would be appreciated.

Thanks

Julian

I’m a bit confused on what you are trying to achieve. Since tab links are separate elements, they cannot be populated by a list unless you manually add a dynamic list into each one, limit it to 1 and set it to consecutively populate the next item. Really would be a pain. If you can explain more about what you’re trying to do, maybe we can come up with some better solutions.

OK, from what you have replied it seems you cannot use a collection to automatically populate the Tabs Menu Links.

I can easily enough populate the Tabs Menu links manually, but was just trying to see if I could speed the process up seeing that I am using collections to populate the tabs content it would make sense to use a collection to populate the Tabs Menus links/headers.

I have lately used collection content to show in tabs. For example, a product (ecommerce) that has Pricing, Description, Instructions, Video examples.
I created 4 tabs for it. In each tab slide I added a rich text content populated from the collections, and for the tab link I set a condition to show only if content is set. Meaning that if there’s no video examples for a specific product, the slide and tab link will not show.

Yeah, I’ve used tabs like that too, populating the tab content with a filtered dynamic list. But I haven’t found a way of populating the tab link with dynamic content unless the tabs are on a relevant dynamic template page where you can populate anything with dynamic content.

This is exactly what I am trying to do - I have a list of tab links that I set up manually, and the slides are populated by a CMS collection. How do you get the set the tab with a condition to only show tab link and slide if there is content in the slide? I just haven’t been able to figure this out.

Select the tab link that you want it to be hidden when no content is added, go to the settings panel, you’ll have an option to add Condition Visibility.
Create one, and from the dropdown options choose the content that supposed to be placed in that slide, and in the the second dropdown options choose “Is Set”.
Done.

(this will hide the tab link and the slide associated).

I don’t see an option for conditional visibility in the settings (for the tab link). Should the tab links be from a collection list also? Currently, my tab links are static, but the tab slides are dynamic content set with a filter. Here is my project link: https://preview.webflow.com/preview/a-1-implements?utm_medium=preview_link&utm_source=designer&utm_content=a-1-implements&preview=c34933ed21e21fbaa8e7d321fa800a4e&pageId=5e29dc41e7c4eb2151ad6919&mode=preview (on the Where To Buy page)

The option of Condition Visibility is available only in a Collection page.
Every time you create a collection, a new Collection page is created.
(You can copy all the elements from the static page to the collection page).

That explains why I couldn’t find it. Thank you!

1 Like