The new Gutenberg editor has an open ticket for allowing users to sort blocks via drag and drop. Blocks can currently be sorted with up and down arrows located to the left of the content but the beta only allows for single-column stacking.
One of the goals for Gutenberg is to provide “a page building experience that makes it easy to create rich post layouts.” As far as layout building goes, the first planned versions of the new editor are very primitive as compared to Wix and Weebly’s drag and drop website builders where nearly every element on the page can be easily moved to a different position.
Contributors have been discussing the intricacies of adding this feature to Gutenberg since February. James Nylen summarized some of the challenges that make drag and drop more complicated to implement:
Dragging and dropping a block is not really a one-step operation. It is more like 3:
- Press and hold mouse button or screen
- Move to desired location
- Release
Step 2 is incredibly difficult to get right, and requires a lot of complicated behaviors like duplicating an item (or at least its general shape and size), scroll handling, and determining the intended new location, especially at the beginning and end of the content. We have all used bad drag-and-drop experiences, and I would argue they are worse than not having it at all.
That said, for two-dimensional movement with columns, I agree that arrows alone are probably not a good solution. Though mobile support for that is going to be very tricky no matter how it works.
Several commenters on the ticket agree that repeatedly clicking arrows to move blocks is cumbersome and will become untenable in the future when multi-column support is added. This would require up, down, right, and left arrows to rearrange content. Users have come to expect a drag-and-drop interface, because nearly every page builder application offers it.
“We are thinking of drag and drop as a progressive enhancement for desktops,” Joen Asmussen said. “One that would be great to have, but we should build it after we have explicit button actions in place for doing the same, including splitting into columns in the future. This decision is based on a desire to ensure accessibility as well as mobile devices can play the same game.”
Asmussen marked the ticket priority as low in May and removed it from the beta milestone. At this point, users are not likely to see drag and drop in the first release that ships with WordPress core.
Multi-Column Layouts Planned for Gutenberg V2
The discussion surrounding adding drag-and-drop to the editor naturally leads into adding multi-column support. Limiting users to a single column is a one-dimensional approach to designing pages, but contributors don’t plan to leave Gutenberg without multi-column support for long.
Geoarge Olaru, a designer at PixelGrade, shared a prototype for adding a simple two or three-grid column layout to Gutenberg.
“Extending WordPress further from the default Blog Posts automatically implies the need of multi-column layouts for presentation pages,” Olaru said. “I would prefer to tackle this feature upfront, rather than letting every developer do it on his own (see the multitude of page builders plugins).”
“For the V1 editor, I’m afraid columns like this is out of scope,” Asmussen said in reply to a Olaru’s ticket with mockups and a prototype for multi-column support. “That’s not a ‘no’ — rather, we need some technical foundations to be solid first, before we commit to the really interesting stuff. But it might be a V1.1, or at the very least something for the customization folks later on in the year. Even before that, it would be good to keep this UI in mind, so that perhaps a plugin can add this even earlier.”
Other commenters on the ticket feel more urgency about getting multi-column support into the first version of the editor. One of the concerns is that plugin developers will rush to add columns immediately based on demands from users, who will then have to migrate once core adds support.
“Multi column layouts are a must-have,” Anthony Hortin commented on the ticket. “At the moment, Gutenberg isn’t solving any issue. You still end up with one long column of content. The whole reason page builders are so popular, and why hundreds of thousands of people are using them, is because they provide the ability to easily make multi-column layouts. Without this functionality, you’re not providing any reason to use Gutenberg over a page builder plugin.”
One of the main challenges of adding multi-column support is figuring out what type of grid system to use and making sure that it scales from mobile to desktop. Weston Ruter joined the discussion to say that the foundational work for nested block support is being done now in version 1, but the UI for displaying them hasn’t been implemented yet.
“I appreciate the excitement and urgency to wanting columns,” Asmussen said. “We feel the same urgency. It’s not about not wanting columns, it’s purely about managing resources at this point.”
The good news is if you’ve been testing Gutenberg and wondering where some of these features are on the roadmap, they will be coming in later versions. While there may be disagreements about how much of a priority drag-and-drop and multi-column support should have for version 1, contributors agree that laying a solid technical foundation for these features is crucial for future extensibility.
So essentially, they are building not an editor, but builder, right?