Same Page Preview

Create, edit and preview content on the same page.

Wouldn't it be nice to see a preview on the same page as the form you're editing?

Same Page Preview upgrades the functionality of the Preview button to give content workers a view of what they're editing and how it looks like.

Demo

Consider adding Same Page Preview to Core

The Plan

We have a 3-part plan for building this feature in stages:

✅ Stage 1: Have a preview on the same page as the edit page. (Done, basically)
✅ Stage 2: Update the preview when the user stops typing in a form field (current focus)
💭 3: Make form fields Reactive (Edits update the preview immediately)

Status

2.1 is out! Upgrade to Drupal 10.1 and use this module! Of our Stage 2 goals, we're done with most of the improvements we want to make including:

• Accessibility enhancements.
• Better use cases for mobile / desktop users
• Moving all the logic into the off-canvas dialog

We are currently working on more accessibility improvements.

Help us know if Stage 2 is really done or not. Try it out. See if it fits your use case. Let us know what more we can improve.

Next Steps

Increase adoption of this feature so we can get good feedback on what to improve next. There is likely a lot we can improve before we seek to get this working in a truly reactive way.

High level goals:

• Talk to distribution / recipe creators and see if can include this feature.
• Raise awareness of this module with the Drupal community
• Continue to improve accessibility
• Start process of getting this into Core
• Continue to imagine how we could do Phase 3

Backstory

During Florida DrupalCamp 2023, we got together to discuss a "Live Preview" feature. After talking through what features exist in Drupal today we discovered that there is a bit of low-hanging fruit in improving the Preview system. Let's just display Previews on the same page of the edit form.

On Mar 29, 2023, we released our first alpha of same_page_preview. This version is our first initial effort to represent what this idea is. We're in the process of fixing any bugs and feedback from that release while putting the majority of our focus on Phase 2.

Way we work

Team members are in the #preview channel in Drupal's Slack working through issues. We're a bunch of volunteers who are excited about this idea. We try to get together every other Wednesday at 4:00 PM Wednesday, Coordinated Universal Time (UTC) to report on a "sprint" worth's of work and strategize.

We mainly use the issues in this queue to report bugs, implement new features, and contain our understanding about plans and strategy. Please jump in and help us think through what this feature should be.