Accordion menu with hierarchies in 3 levels

Hello everyone, happy holidays!

Please help me, I have such an accordion menu with services. There is a hierarchy of 3 levels (main service, subcategories and a detailed list of sub-services).

I don’t fully understand how to build it with such a structure - should I manually design each menu and each table, or should I somehow use database/options sets or something like that?

And I need all the rows and columns in these tables to fit nicely into a common rectangular shape

I would be very grateful if you could tell me the steps in detail, because it’s hard to understand the logic of working with data in a bubble and when it’s better and easier to use which option

On the left - design for the site, on the right - content for this block

1 Like


A bit too much to explain in order to make this to work. One alternative is to explore Bubble ready-templates and see how things work.

Also this video may help:

Thank you very much! I will try to do it this way

1 Like

Design from Figma:

I still have a problem with this accordion menu

I have a 3-level hierarchy, I did the following: I created data type “Service” and “SubServise”. For each subservice (for example Paid Social, Search Engine Marketing (SEM), Amazon, Local Advertising, etc.), I attached a Service id and gave a multi-list of items (for example, Facebook, Instagram, Messenger, etc. for Paid Social)

But I faced the following problem: For each menu item, I will open a detailed table of services, and everywhere this list will look different due to different content (somewhere more, somewhere less, etc.). How is it possible to implement either a flexible structure for the table or to create tables manually for each menu chord?

Now I have all the data pulled up correctly, but the problem is that the table is not displayed correctly:

What I have on Bubble: