Matrix field within a Matrix field

[angrybrad]

Created by: John Baxter ([email protected]) on 2015/03/11 09:07:25 +0000
Votes at time of UserVoice import: 118

---

Sometimes, you just need a matrix within a matrix. For example, if i have a content building field setup using a matrix that allows the user to add blocks of content, sometimes they may need a content block that needs repeating content itself.

[angrybrad]

Posted by Brandon Kelly ([email protected]) on 2015/03/06 03:54:45 +0000

---

@phil I think I'm in agreement with you on that.

@brett UI proposals are absolutely welcome!

[angrybrad]

Posted by Brett Burwell ([email protected]) on 2015/03/18 21:23:48 +0000

---

Brandon, knowing that the PHP code is mostly in place is exciting.

I can certainly appreciate the UI challenge this poses. Would you ever consider accepting UI proposals from folks in the community? I realize Craft isn't open-source (and we're all much better off for that), but I bet people would be more than happy to toss their ideas into the ring as a way of helping bring this specific feature to life.

[angrybrad]

Posted by Phil Zelnar ([email protected]) on 2015/03/18 20:09:09 +0000

---

I've had this come up a few times now. I have to say though, I haven't run into any cases (and am hard pressed to think of any) where more than one level of nesting would be needed.

Another option that might be worth considering would be to expand the columns types in Table fields. In all my cases, that would've been a fine solution, so I posted that idea over here: #811

[angrybrad]

Posted by Anonymous ([email protected]) on 2015/03/17 11:54:30 +0000

---

So much yes!

[angrybrad]

Posted by Daryl ([email protected]) on 2015/03/12 09:36:29 +0000

---

I don't fully understand Hierarchical Matrix fields, but the idea posted here is great. I'd never seen the need for it before, but an agency I'm working with at the moment is right in the middle of implementing this Matrix > Playa > Matrix setup in EE for letting users create content blocks. If we could do it even better in Craft, that would be awesome!

[angrybrad]

Posted by Sam ([email protected]) on 2015/03/10 22:17:30 +0000

---

This comes up all the time, love the idea of it, appreciate the UI could be challenging, but you guys love a challenge! Also like the sound of the alternative matrix hierarchy.

Even a simple matrix in matrix offering similar content types to the native table fieldtype but with the addition of linking to elements, would solve a load of my problems - Probably a plugin :)

[angrybrad]

Posted by Brandon Kelly ([email protected]) on 2015/03/06 03:54:45 +0000

---

Here’s an alternative idea that might do a better job solving the same sorts of content problems: #827

[angrybrad]

Posted by Brandon Kelly ([email protected]) on 2015/03/06 03:54:45 +0000

---

We would really love to add this, and most of the PHP code has already been set up for it, in fact. The only problem is, we haven’t been able to come up with a satisfactory UI for it. Things just get way too confusing when you start having blocks within blocks (or even blocks within blocks within blocks...). The other option is a modal window, but then you lose context, which isn't great either.

[cannon303]

Matrix in a matrix is required. I had a similar problem with ACF Flexible Fields which is Wordpress' third party plug in equivalent. The plugin creator did add one in the end. Things become quite messy without one. In a lot of cases especially simple websites you could quite easily get away without one but if you are embarking on a complex site or thinking out of the box with a particular creative project then not having one means quite simply CraftCMS is too limiting for your requirements which is a shame as I would like to think that CraftCMS gives you more freedom than Wordpress does.

[narration-sd]

Have you had a look at Neo, already created for Craft 2, which is the release to build with for the coming 6-9 months?

https://github.com/benjamminf/craft-neo

There's also Supertable, which may take care of your more actual needs.

You're far from the only person with an interest here; would expect matters to come out nicely -- according to use-cases, and when the beta becomes nearer to release.

You might try listening in on Craft Slack #craft3 for information when there are developments.

p.s. just noticed the stream above your added post. Would think that's pretty generous taking care of the situation also -- the Craft team is as good as it gets in creating real, usable things -- always with depth and thoughtfulness, proactive to real needs.

[sem4phor]

@takobell your (at least) last 2 solution links are dead. Any news from the devs regarding this issue?
It would be really nice that if you create a matrix (a), you should be able to add another matrix (b) as a field of Matrix (a) and so on... This would support DRY fieldingso much!

(BTW. adding existend fields to block types in a matrix would be pretty awsome too IMO)

[brandonkelly]

@stablestorage Just fixed those two links.

Take a look at Neo, as @narration-sd suggested.

[RitterKnightCreative]

Forget matrix within a matrix for second, It would be ideal if Matrix simply just did one additional level, maybe even call the first level a container blocks or something.

From a UI standpoint, it does gets super weird the deeper you go. But just having one more level would be ideal for at least 99% of my use cases.

It's pretty common to be able to have a container block and then have sub blocks underneath it when creating a grid like layout.

An accordion field type is a another good example: there's no good way to setup an accordion with a single Matrix instance especially if you want to mix and match other blocks like images, content, etc.

Forge the pipe dream that is multiple inception, I would vote for one additional level if it simplifies development and we get it in Craft 3.

[narration-sd]

Hmm. It's a nice sounding idea at first, but doing it this way would seem to involve similar code to full recursive ability. And it wouldn't help the use case, which sounds valid as some sort of newspaper or other complex and often-updating document, being explored in #2009.

For the present, wouldn't using a Supertable as first layer allow what you'd propose?

[RitterKnightCreative]

@narration-sd Not sure I follow? I like Super Table and Neo. Some really good plugins there I hope P&T take into account.

One goal for client sites is to not rely too heavily on 3rd party plugins if possible. Matrix is a great feature but it becomes less compelling if you end up having to use Neo or Super Table as well. (One of the reasons we moved away from WP was the plugin churn.)

Just having one more "container" layer opens up a few more possibilities that simply aren't available with one layer matrix, accordion being one big one or anytime you want to make an FAQ section or gallery section.

The problem now is there's no clean way in Twig to say "Hey I'm done building out the content modules/blocks for this section." It's like a wrapper div. Just going one layer into inception would solve a lot of use cases IMO, similar (but not exactly) what Super Table does.

Your container at the top wouldn't be the same blocks as the container in middle, they would be different.

From this thread It seems as if P&T has code in place to handle the complexity, it's a matter of making sure the UI among other things doesn't break the deeper you go. At some point you run out of room showing the "levels." Threading comments is a good example. At some point, you just stop indenting them. But that wouldn't work in this case.

Simply allowing one layer beyond what we have now would be an excellent compromise IMO that would benefit a lot of people without having to go into the hell that is multi-layer inception. And let's be honest, we try to keep this simple for our own clients, I don't want them doing too much with layout...

IN WP Land, ACF's Flex Content field is also another example in the wild of how this could work. But I think there's some UI Polish the guys at P&T could do as usual!

[dominikkrulak]

Posted by Phil Zelnar ([email protected]) on 2015/03/18 20:09:09 +0000

I've had this come up a few times now. I have to say though, I haven't run into any cases (and am hard pressed to think of any) where more than one level of nesting would be needed.

Another option that might be worth considering would be to expand the columns types in Table fields. In all my cases, that would've been a fine solution, so I posted that idea over here: #811

@angrybrad Imagine nesting semantic elements like this:

<section>
    <h2></h2>
    <section><h3></h3></section>
    <section><h3></h3></section>
    <section><h3></h3></section>
</section>
<section>
    <h2></h2>
    <section><h3></h3></section>
    <section><h3></h3></section>
    <section><h3></h3></section>
</section>

A good example is at iPadOS page where sections are nested to more blocks related to What heading of section is about.

Matrix field within a Matrix field or one level of fields deeper that @RitterKnightCreative had mentioned would solve this kind of situation.

[jerome2710]

With the statement of @brandonkelly in mind:

Brandon Kelly - 07/10/2020
no ETA for v4 at the moment. Originally that was going to be this year's focus, but due to "unforeseen circumstances" we decided to hold off on that, as it doesn't seem like the right time to release a big breaking update. We are going to continue releasing 3.x updates with as many of the things we originally planned for v4 as we can w/out breaking anything.

What is the status regarding the nested matrix fields? We are using Neo until now, but they still need to adapt to Craft 3.5 and one less plugin is always a good thing.

[brandonkelly]

@jerome2710 it’s tricky because we can’t migrate Matrix sub-fields into normal global fields via a typical migration. That will likely lead to a lot of people getting errors about their content table having too many columns. So it needs to come hand-in-hand with some refactoring of how content is stored as well. So most likely it all needs to happen together in Craft 4, although there may be a way we could introduce it earlier as an alternative form of content storage that bypasses the current stuff.

[jerome2710]

@brandonkelly thank you for the update. I can imagine this has quite some impact on the how the content is stored. We will stick to Neo for now as this suits our needs at the moment and follow this issue as it evolves. If you could keep us up to date here regarding changes in either Craft 3 or 4, that would be great!

[hongc-cc]

If all matrix sub fields are going to be global fields,
it sounds like we should stick to Neo since the architecture is similar?

[brandonkelly]

Totally up to you.

[proimage]

If P&T successfully recreates all the core functionality of Neo, I imagine the Neo dev would stop updating the plugin. IIRC he did just that for an earlier Craft version (2.x, I think?) for a similar reason, but caved to popular demand and made Neo 3.x compatible when that Craft version was released.

[brandonkelly]

Neo was originally written by @benjamminf and then transferred to his former agency, @spicywebau, when he took a new job elsewhere. Spicy is aware of our plans, but happy to continue supporting & maintaining (& profiting from) Neo for the time being. Up to them but I doubt they will port to Craft 4, and wouldn’t blame them if they didn’t. Again, there will be a migration path for Super Table & Neo fields in Craft 4, so you won’t be stuck if you go with them today.

[proimage]

I just came across what is IMO a killer feature of Neo that I had no idea about until I was today years old.

I think it's probably well-known that in Neo, you can have blocks nested in other blocks. What might be less well-known is that you can drag blocks into and out of other blocks (if those other blocks are configured to allow the dragged blocks to be added as child blocks, of course). You can also drag sub-blocks from one parent block to another parent block.

Just wanted to bring it to your attention so that it doesn't get accidentally left behind in Craft 4's Matrix. 😉

[jl-digital]

Any update on when this will be incorporated in Craft 4?

[thupsi]

In the roadmap it's slated for an 4.x release. That would put it somewhere within the next months, up to a year from now. But you should note that the roadmap hasn't been updated recently, so I'm not sure if it reflects the actual timelines. Perhaps someone from the team can chime in!

[MDXDave]

It seems that this feature has been postponed to v5.x 😢

[myleshyson]

So to preface this, our team is fine with any direction as long as there's a good migration path. Ya'll are great, and we've had the best time so far developing in the Craft ecosystem, so I know whatever the direction it's going to be OK.

I'm wondering how much authors care/should care about the underlying data model of a particular UI element? As devs we tend to like uniformity in how things work under the hood. However in this case I'm not sure how important it is to keep parity between a UI component and what it's tied to in the database. Personally I think it's ok for a UI component to just solve a design issue, and to let the php side worry about how data from that component gets handled. Again I'm just not sure how much authors creating content care about what's happening in php or the database when their editing a field. I know our authors don't.

Also the Garnish library has a slideout component that's not tied to element saving, from which the element slideout builds off of. It seems like it would make sense that the base slideout component could be used for anything, not just element saves.

That being said, I know there's a business side to all this, and I'm not experienced enough to give a strong opinion for the smoothest way forward. If I'm understanding correctly it seems like the decision is between updating an existing field in a major way and forcing everybody to relearn how to use it, or creating a new field and letting people gradually convert over to it.

Either way we're just happy there's going to be a pathway for nested "matrix" fields so we can stop relying on a third-party plugin!

[proimage]

I agree with @mmikkel. Additionally, we (and our clients) have managed more or less fine with Neo having the inline nested recursion you're wary of; why not make the simple, Neo-esque inline mode an option? Kinda like how with Notion, you can choose to open things in a floating box, or in a sidebar, or in a full-page view.

[myleshyson]

Ha oops posted before seeing your comment @mmikkel.

Only thing I will add about the buttons idea is that it can be an accessibility issue to rely on colors for context. I know there's a huge push in Craft to make the admin as accessible as possible (which I think is amazing). A gray vs red button for people with certain types of color blindness wouldn't be clear at all. Not to say there isn't an accessible workaround but just wanted to point that out.

[thupsi]

Hah, @mmikkel is right about the field settings slideout. And, I also agree that saving matrix fields independently (without being explicit about it) is bound to cause confusion to authors. Expanding on the discussion, it would be great if we had the ability to set the a UI mode per block (inline or slideout based), and make inline blocks much lighter in terms of chrome, especially if they contain just one field. I'm envisioning a combination of tiptap like UI for simple long form articles, and full blown nested slideouts for complex content modelling.

[brandonkelly]

Yeah I’m aware we break the mold a bit in the field layout designer, which is why I specifically said “Author-facing slideouts”. But maybe you’re right @mmikkel, and the gray “Apply” label is distinct enough to hint that you’re going to get a different behavior. Combined with… the parent Matrix field would get a blue status indicator showing it’s holding unsaved changes. (And yeah we’d have to run it by @gcamacho079 for an accessibility review before fully committing, but my hunch is that the “Apply” label on its own is still enough of an indicator.)

[Michael-Paragonn]

I had an idea the other day about how the UI for nested Matrix blocks could work without being confusing, and that is to adapt the pattern seen in many desktop applications of having a tree-like table of contents (ToC) along the left side, and only showing the contents (fields) of the currently-selected branch of the tree.

Here's a screenshot from WinSCP's Preferences page:

And here's a mockup I made out of a Neo-based page builder, some DevTool panel shenanigans, and a sprinkling of Photoshop to wrap things up:

Implementing this sort of interface for nested Matrix blocks would have multiple benefits. Not only would it reduce the on-screen clutter of "page builder" style Matrix fields and their multiple blocks, but it would provide an easy-to-understand, top-down overview of the structure of all those blocks.

I imagine there could also be a number of UI elements (drag handles, "Add child block" buttons, etc) associated with the ToC for top-level block management.

Although I implemented it above within a block, I imagine that it would actually just be a toggleable side panel for parent and potential-parent blocks, one which is closed by default. The "main" ToC view would just be at the top-level of the Matrix field itself.

EDIT: In fact, I just realized that Craft and Matrix basically have this exact UI pattern already implemented, when creating the Matrix field in the first place! You have a list of block types along the left, and clicking one shows the fields for that block type.

[vaughn-taylor]

I have just been maintaining Craft installations for the past year or so — I haven’t built a new site with Craft 4 as of yet. But I’m in the process of starting a few new sites with Craft 4, and I must say that I’m somewhat shocked that nested matrix fields are still not a thing!? I posted about this while C4 was still in beta, and I was assured that I could do away with Neo because the same functionality would be rolled into C4. Beyond just the nested fields, I have also relied heavily on reusable fields instead of creating a new field for mundane things like a drop-down that maps to a css background class. Or a plain text field that can act as header text, or a label. These are just fanciful examples but maybe there’s a better way to approach how I’ve been doing things? Maybe I should reconsider reusing fields this way in NEO? Anyway, I’d love to know where the matrix situation lies and if we’re ever going to see that which was promised in Craft 4.

[thupsi]

https://craftcms.com/roadmap

Craft 5 is going to have nested Matrix fields, field instances, Inception fields, relational fields in tables, and a whole lot more. Work is already underway for many of the above, so I'm pretty optimistic and excited!

[vaughn-taylor]

More than anything it’s a point of frustration right now. I dread starting development on something that I know I’ll have to drastically change in a couple months if I want to be up to standards. I prefer to always use first party plugins, but I’ve had to fall back on NEO for years, and I know at some point I will eventually have to gut it from the dozen or so websites I manage.

[pixelmachine]

P&T have alway maintained there will be a migration path of some sort from Neo – so hopefully not too big a job to remove it. I think that's still the case.

But yes it has been a frustrating wait!

[vaughn-taylor]

Yes, this is what Brandon told me awhile ago and I really want to believe it’s true. But you know how things go with web dev — nothing is ever really easy. I mean, the last site I developed (about a year ago) they were pushing Nitro which I could never use successfully because I also maintain WP sites. Luckily I moved to DDEV at that time and I was surprised to learn that DDEV is now the dev env for Craft.

[alexanderbuergin]

I hope that the transfer of NEO fields to a Nested Matric Block will be easy, then we will get over 100k blocks across more than 60 sites with NEO.

[alexanderbuergin]

I hope that the new Nested Matrix fields offer the option to choose a similar display to the SuperTable?

[brandonkelly]

We made it possible to create nested Matrix fields in Craft 5 🎉