Skip to content

Fix publish-box button layout on classic editor (WP 7.0+)#504

Merged
enricobattocchi merged 1 commit into
trunkfrom
fix-classic-publishbox-wp7-flex
Jun 12, 2026
Merged

Fix publish-box button layout on classic editor (WP 7.0+)#504
enricobattocchi merged 1 commit into
trunkfrom
fix-classic-publishbox-wp7-flex

Conversation

@enricobattocchi

@enricobattocchi enricobattocchi commented May 26, 2026

Copy link
Copy Markdown
Member

Context

  • WordPress 7.0 turned #major-publishing-actions into a flex row (flex-wrap: nowrap), which squeezed our "Copy to a new draft" and "Rewrite & Republish" links onto the same row as "Move to Trash" and "Update", shrinking all four controls.

Summary

This PR can be summarized in the following changelog entry:

  • Fixes a bug where the Copy to a new draft and Rewrite & Republish links broke the layout of the Classic Editor Publish meta box on WordPress 7.0.

Relevant technical choices:

  • Scope both flex-wrap: wrap (on the container) and flex-basis: 100% (on each button) behind a :has(> #duplicate-action) / :has(> #rewrite-republish-action) guard, so the whole fix only applies when our buttons are direct children of #major-publishing-actions and each one claims its own row.
  • The rules are no-ops on WordPress 6.9 and earlier, where the container is not a flex parent, so no version check is needed and the previous layout is preserved there. Scoping both halves behind the same guard keeps them enabled and disabled in lockstep, so neither rule is left dangling if a future WordPress version changes the markup or drops the flex layout.

Test instructions

Test instructions for the acceptance test before the PR gets merged

This PR can be acceptance tested by following these steps:

  • Open a published post in the Classic Editor on WordPress 7.0 or later.
  • Confirm "Copy to a new draft" and "Rewrite & Republish" each appear on their own row, above the "Move to Trash" and "Update" controls.
  • If available, repeat on WordPress 6.9: the layout should be unchanged.

Relevant test scenarios

  • Changes should be tested with the browser console open
  • Changes should be tested on different posts/pages/taxonomies/custom post types/custom taxonomies
  • Changes should be tested on different editors (Default Block/Gutenberg/Classic/Elementor/other)
  • Changes should be tested on different browsers
  • Changes should be tested on multisite

This change only affects the Classic Editor Publish meta box; the Block Editor sidebar is untouched.

Test instructions for QA when the code is in the RC

  • QA should use the same steps as above.

Impact check

This PR affects the following parts of the plugin, which may require extra testing:

  • The Classic Editor Publish meta box only.
  • If WordPress 7.0.1 or 7.1 ships its own fix for the #major-publishing-actions flex layout, re-check this meta box: the rules are scoped behind :has() and go inert if the container stops being a flex parent, but a quick visual check confirms our CSS is not redundantly overriding a core fix.

UI changes

  • This PR changes the UI in the plugin. I have added the 'UI change' label to this PR.

Documentation

  • I have written documentation for this change. For example, comments in the Relevant technical choices, comments in the code, documentation on Confluence / shared Google Drive / Yoast developer portal, or other.

Quality assurance

  • I have tested this code to the best of my abilities
  • I have added unittests to verify the code works as intended

Innovation

  • No innovation project is applicable for this PR.
  • This PR falls under an innovation project. I have attached the innovation label and noted the work hours.

Fixes #

@enricobattocchi

Copy link
Copy Markdown
Member Author

They are going probably to fix it on the WP side, so let's wait before moving that forward.

@enricobattocchi enricobattocchi force-pushed the fix-classic-publishbox-wp7-flex branch from 795567c to 3c39a08 Compare June 11, 2026 22:46
WordPress 7.0 changed #major-publishing-actions to display: flex with
flex-wrap: nowrap, which placed "Copy to a new draft" and
"Rewrite & Republish" on the same row as Move to Trash and Update,
shrinking all four. Scope flex-wrap: wrap to that container only when
our buttons are present (via :has()) and give each duplicate button
flex-basis: 100% so it claims its own row. The properties are no-ops
on WP 6.9 where the parent is not a flex container, keeping the
previous layout intact there.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
@enricobattocchi enricobattocchi force-pushed the fix-classic-publishbox-wp7-flex branch from 3c39a08 to d3f551a Compare June 11, 2026 22:54
@enricobattocchi enricobattocchi merged commit 9402562 into trunk Jun 12, 2026
1 check passed
@enricobattocchi enricobattocchi deleted the fix-classic-publishbox-wp7-flex branch June 12, 2026 08:56
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants