Support for nested/sub layouts

Probably too soon to ask but it would be great if Nodejs projects could support nested layouts sometimes called sub-layouts.

Makes more sense now that we have SPA for nodejs.

Could you give a few examples of nested layouts?

And maybe how would you like them to work also on combination with SPA and/or partial refreshes.


Imagine a marketing site. You would have a main layout with a header and a footer. Content would go inside the main layout. Now you have product features, pricing, about us and similar one-page layouts that would have this layout.

Now imagine that you have also a forum like discourse. It would have the main layout as you want to keep header and footer but you would need a different sub-layout for it.

Also a blog would have the main layout for header and footer. But also several sub-layouts for single post, list of posts, categories etc.

Another example. Say you have web-app with a dashboard. Two main layouts. One for login, register, remember screens that are not SPA.
A second layout that houses the app dashboard which has several sub-apps(think of a CRM). Each feature(leads, contacts, analytics, mail, collaboration, etc) has its own layout as an MPA. Within each feature every thing is an SPA that has its own layout. Some have a sub header, others a sidebar, etc. And each of them renders different content. You would also have a completely different layout for user/app settings that would need a completely different layout.

Right now I do this by having a content page that calls dynamically partials.

So I have 3 routes that share the same main layout and point to the same content page. Inside this content page that I use as a sub-layout I call partials dynamically from additional data fields I add to the json route.
This is OK but isn’t compatible with current SPA routing because it only handles one main layout and doesn’t integrate with content pages that act as sub-layouts.

1 Like

So to achieve this with the current layout system, just allowing new layouts to be based on other main layout should be enough?

1 Like

Yes. More or less.

From a content page you can choose a layout. But a layout currently will always be at the top level.

If this is implemented from a UI perspective I would expect to open a layout page and be able to select a parent layout or blank if it’s top-level.

1 Like

If unclear yet @george here is a short post about nested layouts in RoR. He explains it much better than I do :slight_smile:

1 Like

I don’t think the way it works in Rails will work with ejs templates. The ejs templates only allows child templates, we work around it in the route by not loading the content page, but loading the main page and then setting a variable content that contains the content page that should be loaded. I think you already do the same with partial pages, you pass the partial that you want to load at a specific route by setting the data on that route and load the partial dynamically.

I will investigate if the other way around would be possible, but I think the way you already do it with partials will be the way to do it within Wappler.

1 Like

I understand. Indeed it’s one of ejs limitations. EJS was built with simplicity in mind. And I can see why Rails approach would be quite complicated to implement using it.

I know you guys will proceed with the approach that makes more sense now and for the future. For me using routing data seemed straightforward but I realized the SPA router isn’t compatible yet with this approach. It also involves manually editing the routes.json

But if you guys streamline this approach via UI and make the SPA router compatible with content pages working as layouts that is peachy! :slight_smile:

Thanks for the explanation.