Edit Posts From Within The Preview Screen With Post Customizer

There are all sorts of frontend editors being created for WordPress. We’ve already covered Barley, Inline Access, and PrettyPress. Each plugin takes a different approach to solving the problem.

Post Customizer, developed by 10up continues the trend of taking a different approach to solving the problem of live editing. Post Customizer works in a similar fashion to the theme customizer. When a user previews a page or a post, an interface is loaded that looks just like the theme customizer. From this interface, you can edit the post excerpt, post thumbnail, save changes to the post or close the interface without saving. Selecting text within the post displays a simple editor that makes it easy to style words, apply unordered lists etc.

Simple editor to edit posts

Idea Turned Into Reality

I got in touch with John James Jacoby, one of several developers for the plugin (along with Carl Danley, John Bloch, Taylor Lovett, and Drew Jaynes). I found out why the plugin was created, the decision to use the customizer interface and whether or not this is just a prototype or something they want people to use on a routine basis.

Tavern – Is this plugin a prototype of an idea to edit posts or does 10up plan on improving the plugin? Does 10up want people to use it?

JJJ – Both! It was an idea I’ve had in my head for a while, and we threw it together at our company meetup and then it sat mostly unloved for a few months. We spent a few hours getting it to a workable state, and open sourced it for improvements and feedback. We actually built the majority of it over the course of two evenings, just hacking together and rapidly prototyping.

Tavern – When it comes to the post customizer, does it not make sense to be able to have the category and tags be editable from within the customizer? At that point, you’re sort of substituting the post writing screen although you don’t see the customizing interface until after you hit preview.

JJJ – Sure. Pretty much any metabox is game for inclusion. We specifically wanted to provide an interface for editing post content after the original post was written. We’d like to work Revisions into the sidebar, so authors can scroll through updates live.

Nice Idea But Needs A Lot Of Elbow Grease

While the idea is great, the implementation and experience needs to be improved before users can feel comfortable with using this plugin. Here are some things I noticed.

Update Or Save – The theme customizer that the interface is based on does not feel natural when editing posts. When editing themes, I realize an update will save the changes I made to the theme. For posts however, I’m used to clicking a save button. While the update button does the same thing, it just doesn’t seem right.

Exiting The Interface – I’m used to closing interfaces with an X on the top right portion of the screen. Despite the post customizer using a familiar layout, I keep looking to the right of the screen for a way to close the editing panel. It’s as simple as clicking the close button but I’m always looking somewhere else to get out of the editing interface.

It’s also weird that upon closing the editing panel, I’m taken back to the WordPress editing screen that’s missing the right sidebar. It’s here that I have to click an X to completely close the editing interface. Clicking close and then the X feels redundant. I’d rather see the close button take the role of doing both tasks and returning me to the normal editing panel without any additional steps.

Editor Toolbar Sticks To The Top Of The Post – When the editing toolbar is enabled, it sticks to the top of the page. While I could use keyboard shortcuts, I’d rather see the editor appear above the text I’m highlighting so I don’t have to scroll or move my mouse so much. When the edited text is not highlighted, the toolbar should disappear.

Excerpts Reload The Entire Page – The first time you try to edit the excerpt in the sidebar, it reloads the entire page along with the interface. I found this to be a jarring experience and would like to see the excerpt loaded without having to reload the entire page.

Interesting Take On The Post Editing Idea

I never would have thought that the theme customizer interface could be used to edit posts. Post Customizer proves the idea has merit. It will be interesting to see how this plugin evolves over time. If you’re interested in contributing back to the plugin, you can fork it on Github.