![(please configure the [header_logo] section in trac.ini)](/chrome/site/your_project_logo.png){kind=logo}
#65463 closed enhancement (duplicate)
Add box reordering toggle to Screen Options
| Reported by: | poligilad | Owned by: | |
|---|---|---|---|
| Priority: | normal | Milestone: | |
| Component: | Administration | Version: | |
| Severity: | normal | Keywords: | has-patch has-unit-tests |
| Cc: | Focuses: | ui, accessibility, css |
Description
The dashboard box drag handles are always visible, which adds a lot of noise to the UI. Most users don't reorder their boxes regularly, so having the controls permanently on screen doesn't feel worth it.
Proposal:
Add a "Box reordering" checkbox to Screen Options. When unchecked, both the drag handles and drag and drop functionality are disabled entirely. When checked, reordering is enabled and the handles appear. The Screen Options copy has been updated to reflect this new option.
Along with this I'm also proposing some small visual refinements:
- Drag handles appear on hover/focus only when reordering is enabled
- Added padding so the arrows aren't so close to the edge of the card
- Minor alignment improvements to the drag and drop boxes overall
Open questions for discussion:
Should this be on or off by default?
If enabled, should the handles only appear on hover/focus rather than always? This could be a good middle ground.
Screenshots from a local implementation are attached.
Attachments (1)
Change History (6)
This ticket was mentioned in PR #12180 on WordPress/wordpress-develop by @poligilad.
4 weeks ago
#1
- Keywords has-patch has-unit-tests added
#2
@
3 weeks ago
- Keywords close added
- Version 7.0
A similar change was attempted on #50699 but reverted. PR 12180 could refer to that ticket, and then this ticket can be closed.
The controls need to remain enabled by default, and always visible when enabled, for discoverability. People should not need to open the screen options to access controls, especially the buttons and drag-and-drop functionality that are already available.
#3
@
3 weeks ago
- Resolution → wontfix
- Status new → closed
Thanks for the context @sabernhardt, and for pointing me back to #50699. I missed the history there.
Reading through the older discussion, I can see why the previous approach was reverted, especially the discoverability concerns around only allowing reordering while Screen Options was open.
The current PR does keep reordering enabled by default, but I agree the hover-only controls may run into the same discoverability concern. I’ll update the PR to reference #50699 and adjust the scope so the controls remain visible when reordering is enabled.
The part I’d like to keep is the later direction from #50699: adding a Screen Options control that can enable/disable metabox moving globally, while defaulting to enabled for discoverability. That seems aligned with the accessibility-team feedback.
Closing this ticket so the discussion can continue on #50699 and PR #12180 can be updated to reference that ticket instead.
#4
@
3 weeks ago
- Keywords close removed
- Milestone Awaiting Review
- Resolution wontfix → duplicate
Duplicate of #50699.
Thanks for updating the PR!
@poligilad commented on PR #12180:
2 weeks ago
#5
@tyxla Thanks so much for the review!
I’ve updated the PR based on the feedback:
- Removed the custom filters from the first pass.
- Changed the setting from per-user/per-screen to one global per-user preference:
meta_box_reordering. - Simplified the helper so it no longer receives or checks the current screen.
- Standardized naming across PHP, JS, CSS, AJAX, and tests around
meta_box_reordering/meta-box-reordering. - Cleaned up the positive/negative state handling so the JS uses a positive enabled state, with the disabled body class only used for the UI/CSS state.
- Removed the unrelated dashboard/control visual changes from this PR.
I also opened a separate PR for the dashboard meta box visual refinements here:
https://github.com/WordPress/wordpress-develop/pull/12339
One additional copy/layout change: the new checkbox now appears under “Additional settings” as “Enable box reordering,” instead of adding a separate “Reordering” section. This keeps the Screen Options UI more compact and also works better on screens like the Classic Editor and WooCommerce product editor, where other additional settings may already appear.
Latest local checks:
php -l src/wp-admin/includes/class-wp-screen.phpphp -l tests/phpunit/tests/admin/includesScreen.phpphp vendor/bin/phpcs --standard=phpcs.xml.dist src/wp-admin/includes/class-wp-screen.php tests/phpunit/tests/admin/includesScreen.phpphp vendor/bin/phpunit --filter Tests_Admin_IncludesScreen tests/phpunit/tests/admin/includesScreen.phpgit diff --check
## Summary
## Testing