Post Formats UI Update, 3/14

As noted in The Road to 3.6 Beta 1, we’ve got quite a bit going on for post formats. Many of the tickets are in need of testing (including unit tests) and then a commit. As always, there are a few different fronts: UI/administration, data, and parsing. Here’s where we are with each, and what needs to get done. There’s a large variety of tasks here, and we are seeking contributors to help 🙂

UI / Administration

Main ticket: #19570

@melchoyce refreshed the layout wireframes and we ran them by @jenmylo for a gut check. The wireframes linked are for reference to see progression – quite a bit will be different, notably that the collapsing content editor will not actually do that and we probably won’t be able to get so adventurous with the status format. We are going to do the following and should aim for a commit addressing a good portion of this in the next several days:

  • Remove the separate meta and field display for the image and gallery formats. Though it’s nice to guide a user through via UI, the image format did not really pose any issues in the user testing, and the whole uncoupled multiple gallery shift in 3.5 makes a separate field less sensible. With good parsing, just the content area should be enough for both. Image also still has the featured image metabox, which is confusing. One thing that we should try doing is having the “Add Media” button open the modal in the “Create Gallery” panel by default if in the gallery format. Knowing about galleries at all was an issue in user testing, not related to the post format.
  • @lessbloat proposed a dropdown selector, in these mockups placed by the title: Anything is better than tabs for this interaction, and I’m sorry that I used them even temporarily as they clearly became a distraction, so we are going to keep the dropdown idea, but try putting it where the screen icon is, per suggestion from Jen.
  • @melchoyce is making some changes to the icons she’s been working on: The standard post icon will be the pin, the gallery icon will become the image icon (since images are not necessarily photos), and the gallery icon should be something like the image icon with a stack behind it.
  • @lessbloat is going to experiment with what can be done to make TinyMCE less intrusive in some formats where it’s not as much of a focal point, such as quote, audio, and video. Have warned him about what it means to re-initialize TinyMCE, but teeny mode seems that it would be ideal, and perhaps hide the Add Media button / move it into the TinyMCE toolbar instead, especially for the audio/video formats, so it doesn’t confuse the user as to what they should be using for which.
  • Title should be somehow de-emphasized for some formats: aside, status, and image come to mind. A toggle to edit comes to mind, maybe like the way permalink slugs are edited. Titles need to be filled in based on content for those formats, a la P2. Might be nice to try to do something smart with image, like detecting an alt or title attribute for the fill-in, but at the very least, something better than (no title) or Auto Draft. This is less important for a second commit, but needs a body.
  • Audio and video should have inline previews, whether it’s of oEmbed response, rendered HTML (sanitized per user cap, of course), or a media library item. We should hook up the media modal if possible, especially with the insert from URL panel. Related: #15490 (see farther below for more details on the ticket). Needs a body or bodies.
  • Screen option: no longer sure we actually need this with the less obtrusive dropdown for format selection, but if we keep it, it should just hide the switcher.
  • No-JS: probably means a select dropdown (which should be the non-visible input that is changing with JS on) with a submit button next to it that saves a draft with that format, which will thereby change the screen once it loads again. Not sure what that means for a published post, though. Ideas about execution in that regard are very welcome. Needs a body or bodies.
  • Accessibility: need to check on ordering when tabbing through fields and make sure things like labels are done correctly. Also should make sure the switcher is accessible. Needs a body or bodies.

Other tickets and tasks:

  • #23198 – TinyMCE class. @azaozz said he will take a look and get it polished and committed. Looking for it to be there on init as well as dynamically changing with the format. Hooray for editor styles 🙂
  • #16047 – list table display/filtering. Once we have icons, we should drop those into place next to the post title, with each icon linking to filter the list table down to that format, and lose the column that was added. “Standard” (the pin) should not show.
  • #23539 – previewing. Format should be dealt with the way category is (taxonomy); formats with meta fields are trickier to deal with given that post meta is not stored separately for revisions. Not sure where this stands.

Bonus: @ryelle is working on a dashboard widget for one-click entry into writing a post in a given format, which should help with discoverability. Have suggested that work on this be done as a plugin for a couple reasons – so patches don’t go stale and so that if it doesn’t quite make it to core for one reason or another (whether that’s functionality or decision that it’s not for core), it’s available as something usable for those who want it and/or for user testing and data collection.


  • #23347 — Theme fallback output. We need to remove gallery and image fallbacks along with removing them as separate meta. This needs some more work regarding more/excerpts and probably pagination as well – see for more details. Seems that placement before/after needs to be different per different formats – link should default to after as it is now, but audio, video, and quote should probably be before the_content. Needs a body.
  • #23282 – HTML5 audio / video and #23673 — video / audio metadata. These need to drop in together, and we should do it soon and let it soak. We can test patches all day, but nothing beats getting it into trunk for a wider audience and set of environments. There are concerns about needing jQuery on the front, but in the last dev chat we decided to at least drop it in and let it soak. Needs lead dev eye and blessing for commit ASAP, please.
  • #23726 — Show Audio and Video previews on Edit Attachment screen. Pretty much comes with the above.
  • Provided that the link and quote formats continue to use a separate field for URL, they should probably be added to the pingback URLs. See #18506.
  • Meta doesn’t delete, because it’s not passed in $_POST if empty. Likely not a particularly complicated fix.


Tracking ticket: #23725

So many thanks to @wonderboymusic for leading the charge here. These need a commit very soon so that Twenty Thirteen can move on with practical usage. The biggest use cases are going to be image and gallery formats, as well as new theme, old data. Parsing functions will be available for use by devs, and in core should be used as fallbacks in the get_post_format_meta() function.

  • #22960 — Extract images from content, attached to post, gallery, or arbitrary string. Has unit tests and patch. Needs testing and a lead dev eye and blessing.
  • #23570 — Extract a URL from an arbitrary string, HTML, or the current $post. Has unit tests and patch. Needs testing and a lead dev eye and blessing.
  • #23572 — Parse Audio / Video data out of arbitrary content or a post. Has patch, needs unit tests. Needs #23282 to go in first.
  • #23625 — Parse chat as structured data. Has patch and unit tests, but needs to be scaled back and just allow for added formats (regex patterns) via plugins. Suggest that it just be split by lines, ignoring empties, with anything before the first colon becoming the label for that line (screen name, speaker, whatever you want to call it).


  • Will need screen help text, possibly/probably its own panel. If we keep the screen option for post formats, would be smart to hide the panel if toggled off.
  • Codex will need attention. I know of Seems that user documentation needs to be separated from theme dev documentation.

Otherwise related

  • #15490 – oEmbed preview for insert from URL in media modal. We found in user testing that users go back to this panel for all sorts of things, including YouTube URLs and the like. There’s a working patch from @jtsternberg that could use a little finessing. The Ajax action is probably going to be helpful with audio/video inline previews on the edit post screen.

#3-6, #post-formats