When you want to fix a typo, or restructure your paragraphs, or quickly add another tag to your blog post, you have had had to go to the node/%/edit page. Once one the page you have to navigate through a potentially enormous form to find the particular thing you want to edit. The order and visual appearance of the fields in the edit form may not resemble the same information in the view mode of the item. Such a separation of editing and viewing requires time and thought to negotiate.
With the commit of #1824500: In-place editing for Fields, Drupal 8 will now support in-place content editing. With the Edit module enabled, on pages that contain editable fields, the edit tab becomes available in the toolbar.
Clicking the "Edit" tab places the page into edit mode.
While in edit mode, editable items are pulled into the foreground while the rest of the page fades to the background. Clicking into a field launches a field editing dialog. The dialog pulls from Drupal’s Field API and maintains access and text formatter conditions.
Changes are saved asynchronously when the save button on the field edit dialog is clicked.
Effort has been given to visual as well as the aural UI. Edit DOM components are marked up with ARIA roles, states and properties to inform a screen reader user of the application’s state. Major state changes are announced by an ARIA Live region with messages like:
In place edit mode is active. Page navigation is limited to editable items. Press escape to exit.
The initial commit of in-place editing begins work on a game-changing feature for Drupal 8 (among so many others!). Follow-up issues and improvements will be tracked on #1858210: [meta] Content editing experience follow-ups — in-place editing and WYSIWYG.
|Enable edit mode.||27.24 KB|
|Click on a field.||27.39 KB|
|You're now editing the field!||44.47 KB|