Editor: Enhance classic editor timestamp fields with native controls (continues #12275) by j111q · Pull Request #13050 · WordPress/wordpress-develop

j111q · 2026-08-14T09:01:26Z

Summary

Continues the work in #12275 (opened by @poligilad-auto, who is currently out) to enhance the classic editor Publish timestamp with server-rendered native date and time controls, keeping the existing granular aa/mm/jj/hh/mn fields as the source of truth and fallback.

This branch carries Poli's original commit unchanged and adds a follow-up commit addressing @tyxla's code review:

Removed a duplicated CSS rule. .misc-pub-curtime #timestamp:before { content: none } was declared twice; kept the later declaration so it still overrides .curtime #timestamp:before (equal specificity, so source order decides which wins).
Consistent invalid-state selectors. The form-invalid class is now added and removed on both native inputs via .timestamp-native-wrap input, rather than being added to only #publish-date-native by ID while being removed from both.
UTC instead of UTC+0. A zero timezone offset now renders as UTC in the site-time note; non-zero offsets are unchanged (UTC+5:30, etc.).
Aligned the timestamp row with its siblings. The Publish-box icon column used a fixed 27px, which pushed the timestamp label ~10px further right than the Status / Visibility / Revisions rows. Sizing the column with auto lets it match the sibling dashicon advance, so all rows line up. All new layout CSS remains scoped to .misc-pub-curtime, so the other meta boxes are unaffected.

Trac ticket: https://core.trac.wordpress.org/ticket/61652

Still open from the review

The two higher-level points @tyxla raised on #12275 are not resolved here and still need discussion:

Confirming this is the design direction the project wants for the classic editor timestamp. @jasmussen - could you take a look?
Confirming the markup changes don't break plugins that integrate with the existing controls. -- I'll dig into this

Testing

Opened the classic post editor and confirmed the Publish timestamp renders as native date and time inputs with the site-time note, and that the timestamp row aligns with the other Publish-box rows.
Confirmed changing the native inputs updates the legacy timestamp fields, and an invalid value keeps the editor open and marks both native inputs invalid.
php -l src/wp-admin/includes/template.php — no syntax errors.
Measured the Publish-box row alignment before and after the CSS change (sibling rows and the timestamp row now share the same 16.5px label indent).

The follow-up commit was drafted with AI assistance and reviewed by me.

Props poligilad, tyxla.

@tyxla

Follow-up to the review on PR WordPress#12275 by @tyxla: - Remove a duplicated `.misc-pub-curtime #timestamp:before` rule, keeping the later declaration so it still overrides `.curtime #timestamp:before` (equal specificity, so source order decides). - Align the native date/time invalid-state selectors: mark and clear `form-invalid` on both native inputs via `.timestamp-native-wrap input`, instead of flagging only `#publish-date-native` by ID. - Render a zero UTC offset as `UTC` rather than `UTC+0` in the site-time note. - Size the Publish-box timestamp icon column with `auto` instead of a fixed `27px`, so the row's label lines up with the sibling meta rows. Props poligilad, tyxla. See WordPress#12275.

github-actions · 2026-08-14T09:04:28Z

Test using WordPress Playground

The changes in this pull request can previewed and tested using a WordPress Playground instance.

WordPress Playground is an experimental project that creates a full WordPress instance entirely within the browser.

Some things to be aware of

All changes will be lost when closing a tab with a Playground instance.
All changes will be lost when refreshing the page.
A fresh instance is created each time the link below is clicked.
Every time this pull request is updated, a new ZIP file containing all changes is created. If changes are not reflected in the Playground instance,
it's possible that the most recent build failed, or has not completed. Check the list of workflow runs to be sure.

For more details about these limitations and more, check out the Limitations page in the WordPress Playground documentation.

Test this pull request with WordPress Playground.

github-actions · 2026-08-14T09:13:32Z

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

Core Committers: Use this line as a base for the props when committing in SVN:

Props poligilad, jillq, joen.

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

jasmussen · 2026-08-14T09:22:33Z

Nice, thanks so muc for contributing! From a quick glance it looks good to me, but honestly I'll also defer a bit to you and Poli on the design side. I understand this is motivated by good reasons, and thus I mostly want to support it with my own thumbs up.

The changeset looks reasonable to me, so I'm wondering: how can we help this ship? Let's see if some developers check in on this with input, otherwise if nothing happens, ping me again and we'll try and see if a @WordPress/wordpress-core ping can help.

…pat. Wrapping the timestamp display and the Edit link in a `.timestamp-display` span moved `a.edit-timestamp` out from being a sibling of `#timestampdiv`. A scan of the plugin directory found several plugins (e.g. PublishPress Statuses, Media Library Assistant, LH Archived Post Status) that rely on `$( '#timestampdiv' ).siblings( 'a.edit-timestamp' )`, which the wrapper would break. Keep `#timestamp` and `a.edit-timestamp` as direct children of `.misc-pub-curtime` and lay the row out with a three-column grid instead. The rendered result and the row alignment are unchanged. See WordPress#12275.

j111q · 2026-08-14T09:43:57Z

Thanks @jasmussen (and for the quick reply)! 🙏

@tyxla -- following up on your point about not breaking plugins that integrate with the existing controls. To investigate this, I was directed by Claude to run the change through WPDirectory (regex across all current plugins + themes on .org)

The results:

Pattern	Plugins	Themes
misc-pub-curtime\s*> (CSS child selectors into the old structure)	0	0
siblings(…a.edit-timestamp (the JS relationship)	~14 plugins	0
edit-timestamp-label\|timestamp-native-wrap\|timestamp-display (new class names)	1 (unrelated plugin's own class)	0

So the CSS changes look safe, and no themes are affected. The one real compatibility surface is the JS: wrapping the display + Edit link moved a.edit-timestamp out from being a sibling of #timestampdiv, so $('#timestampdiv').siblings('a.edit-timestamp') stops resolving.

Triaging the ~14 hits:

Classic Editor (9M installs) looks alarming but is a false alarm — it ships a vendored copy of core's post.js under scripts/, but nothing in the plugin enqueues it (the classic editor runs on core's own post.js). So the matched code doesn't execute. (TCD Classic Editor, 4k, vendors it the same way.)
The genuinely-at-risk set is a handful of status/scheduling plugins that enqueue their own script targeting core's #timestampdiv — e.g. Media Library Assistant (70k, on the attachment screen), PublishPress Statuses (1k), LH Archived Post Status (4k), plus a few with tens of installs. Real, but niche.
One match (Depublish Posts) is a false positive — it uses its own edit-timestamp-depublish class.

Mitigation which has been pushed: rather than accept even a small break, I kept #timestamp and a.edit-timestamp as direct children of .misc-pub-curtime (so the sibling relationship is preserved) and laid the label row out with a three-column grid instead of the .timestamp-display wrapper (from Poli's original PR).

The rendered result and alignment are unchanged; $('#timestampdiv').siblings('a.edit-timestamp') resolves again. That takes the compatibility question off the table at no visual cost.

Pls LMK if there's something else you think I could do to ensure backward compatibility here! 🙏

tyxla

Thank you for working on it @j111q!

The biggest piece of feedback I have is related to the fact that this is impacting more screens than it aims to. A more secondary issue is that it causes some visual issues when the form is collapsed.

See inline comments.

Also I'd encourage you to test with different languages, especially ones with longer labels (German, Finnish), also with RTL ones.

tyxla · 2026-08-17T09:10:44Z

 	height: auto !important;
 }

+.misc-pub-curtime {


Note that this classname is used in more places than where this PR assumes:

The attachment submit box ("Uploaded on:")

The comment edit screen ("Submitted on:")

And a quick test reveals this is broken for the default comment on a fresh install:

This may also mean there might be broader impact than we think (both core-wise and plugin-wise).

I think we need to reserve space for the Edit link here. With a longer translated timestamp, the max-content column takes most of the available width and pushes Edit outside the metabox.

tyxla · 2026-08-17T09:14:34Z


 		// Cancel submit when an invalid timestamp has been selected.
 		$('#post').on( 'submit', function( event ) {
 			if ( ! updateText() ) {


If a user clears a native date or time field and clicks the main Publish/Update button, the old legacy values are still valid, so the form submits the old timestamp. Haven't tested, but maybe we should call updateFieldsFromNativeTimestamp() here instead of updateText().

tyxla · 2026-08-17T09:15:48Z


+.misc-pub-curtime {
+	display: grid;
+	grid-template-columns: auto minmax( 0, max-content ) minmax( 0, 1fr );


This is where we need to reserve space for the Edit link. With a longer translated timestamp, the max-content column takes most of the available width and pushes Edit outside the metabox. Perhaps auto minmax( 0, 1fr ) auto?

tyxla · 2026-08-17T09:16:37Z

+	min-width: 0;
+}
+
+.misc-pub-curtime:before {


Should this new pseudo-element also use: #8c8f94? The clock icon moved here, but the existing color rule still targets #timestamp:before, which is now disabled. So the clock is darker than the other icons in the publish box.

tyxla · 2026-08-17T09:17:33Z

 }

+.misc-pub-curtime {
+	display: grid;


This will be one more thing to check for back-compat: this element is now a grid container. Any element that a plugin adds as a direct child becomes a grid item and moves to a new row, instead of flowing inline as before. This may be harder to catch with https://wpdirectory.net/ FWIW.

tyxla · 2026-08-17T09:22:46Z

+					return false;
+				}
+
+				$( '#aa' ).val( dateMatches[1] );


.val() does not fire a change event. So we might want to explicitly .trigger( 'change ).

tyxla · 2026-08-17T09:23:28Z

+			$timestampwrap.hide();
+			$nativeTimestampWrap.removeAttr( 'hidden' );
+			$nativeTimestampWrap.find( 'input' ).on( 'change', updateFieldsFromNativeTimestamp );
+			$timestampwrap.find( 'input, select' ).on( 'change', updateNativeTimestampFields );


Related to the above, the .val() does not trigger change so this handler probably never runs

tyxla · 2026-08-17T09:24:44Z

 	$cur_hh = current_time( 'H' );
 	$cur_mn = current_time( 'i' );

+	$timezone = wp_timezone_string();


We call this every time now, but it's not used on the QuickEdit or comment screen. Should we move it where it's used? The if ( $for_post && ! $multi ) check.

tyxla · 2026-08-17T09:25:15Z

+	if ( $for_post && ! $multi ) {
+		?>
+<div class="timestamp-native-wrap hide-if-no-js" hidden>
+	<label for="publish-date-native" class="screen-reader-text"><?php _e( 'Date' ); ?></label>


These two labels need a /* translators: Hidden accessibility text. */ comment above the strings, like the other screen reader strings in this function.

tyxla · 2026-08-17T09:25:27Z

+		printf(
+			/* translators: %s: The site's timezone. */
+			__( 'Site time: %s' ),
+			'<span>' . esc_html( $timezone ) . '</span>'


Is this span necessary?

poligilad-auto and others added 2 commits June 29, 2026 11:32

Enhance classic editor timestamp field

965b41d

j111q mentioned this pull request Aug 14, 2026

Enhance classic editor timestamp fields with native controls #12275

Open

j111q marked this pull request as ready for review August 14, 2026 09:13

tyxla reviewed Aug 17, 2026

View reviewed changes

Uh oh!

Conversation

j111q commented Aug 14, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Still open from the review

Testing

Uh oh!

github-actions Bot commented Aug 14, 2026

Test using WordPress Playground

Some things to be aware of

Uh oh!

github-actions Bot commented Aug 14, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

jasmussen commented Aug 14, 2026

Uh oh!

j111q commented Aug 14, 2026

Uh oh!

tyxla left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

j111q commented Aug 14, 2026 •

edited

Loading

github-actions Bot commented Aug 14, 2026 •

edited

Loading