Epic #96592
closed
[UX] Page tree drag and drop is horrible to use and needs improvement
Added by Tanel Põld over 2 years ago.
Updated 4 months ago.
Category:
Backend User Interface
Description
Drag and drop is the most natural way to create new pages and it's a great feature if it does what it supposed to.
It gives a good sense where does the page go in structure.
I have been using it since it was introduced 4 or 5 years ago?
Till today 4 times out of 5 the page lands in wrong place. And it happens daily as it's probably one of the most often used feature for me.
So how do we make it better?
Files
Related issues
1 (1 open — 0 closed)
In Neos CMS it's easy to get it right, and it's a very similar solution. Maybe it's something to look at.
I don't know if the following suggestion is achievable but it would be cool if backend users could drag'n drop elements from the content area into the page tree.
In TYPO3 v11 LTS and earlier, moving records to other pages requires a cut'n paste process. Drag'n drop capabilities across the content area and the page tree would simplify this. Simple records that don't need a colPos or other page-specific information should be straight forward. However, records such as content elements might be more complicated to drag'n drop into a page in the page tree.
Here's some ideas I have been having in mind and some I got from analysing great work from Laura work that Benni linked above.
Goals
- Improving the features already present instead of adding completely new ones
- Add desired page type drag and drop but have enough feedback where it lands after dropping
- Page can be landed/added as first in list of subpages
- Utilise page type selection icons for adding pages by clicking. It’s already present on top of the page tree.
- Add desired page type with two clicks
- Initiate ‘add multiple pages’ using drag and drop or the same two click path by using add multiple type icon (illustrated with green)
- Editing page properties should be driven by demand not offer
- No opening wizards right after adding a page
- No pop-up offer to copy or move while dragging page into a new place in the tree. Copying should be initiated by the user (holding down a key?) or using regular copy paste from context menu.
Explaining actions on the screen shot
(Screenshot 2022-01-20 at 10.24.25)
2. Selected/dragged page type to be added
- page type icon could be a selector or drag handle
- if selected could stay active until deselected
2.1 While dragging a page type icon to the tree add buttons act as drop zones
3. On copy or cut from context menu or dragging to move the page
- the + icon in add buttons would replace accordingly (copy, paste, move)
Surely enough overall design of the page tree needs improving to be spacious enough to make actions like this possible.
Here I have added a video with one of the issues of drag and drop in TYPO3 v11 right now.
In moving cursor up and down in less than 10px, 3 different things can happen. It's almost impossible to get it right.
And visual feedback is far from enough.
- Related to Feature #97257: Improve user experience when adding a new page via drag and drop in page tree added
- Target version changed from 12 LTS to Candidate for patchlevel
Version 13 has greatly improved the D&D interaction on the pageTree, also the feedback.
Can be considered sufficient?
- Status changed from New to Closed
- Target version deleted (
Candidate for patchlevel)
I am closing this issue as on TYPO3 13 the experience with drag and drop on pageTree has greatly improved and now the drop target areas feel comfortable to work with.
If you think that there is still space to improve, please open a new issue describing your ideas. Thank you.
Also available in: Atom
PDF