Draft and Save Customizer Changes for Later with New Customize Snapshots Plugin

photo credit: Chantel Lucas
photo credit: Chantel Lucas

As the WordPress customizer becomes more widely adopted by theme and plugin developers, users often have a host of live preview options to play with when personalizing their sites. Different combinations can produce wildly different designs. What if you could save a preview of customizations before going live with it? This is the idea behind the new Customize Snapshots plugin from Weston Ruter, Derek Herman, and the team at XWP.

Customize Snapshots lets you draft and preview customizer states that can be shared via a private URL that the plugin generates. Users who are not authenticated can preview snapshots on the frontend without loading the customizer. Authenticated users will be able to load the snapshot inside the customizer to make further edits or publish the draft.

customize-snapshot

You may not be able to see it in the demo above, but snapshots can be saved with a scope of full or dirty, according to the plugin details page:

  • Full: will playback all the settings during preview [changeset]
  • Dirty: will only playback the ones that were marked dirty when the snapshot was taken [snapshot]

“Snapshots was written as a feature plugin to implement a key feature that the Customizer Transactions proposal will make possible,” Weston Ruter said. Ruter is the Technology Director at XWP and a co-maintainer of WordPress’ core customizer component. He said the plugin was also developed specifically for a client’s project requirements.

“Customize Snapshots stores the Customizer state in a custom post type,” he said. “You can access the frontend of the site with the UUID for the snapshot added as a URL parameter to load the site with that Customizer state applied. So this makes it possible to preview Customizer changes on other devices entirely.”

Coming Soon: Schedule Customizier Changes to Go Live at a Future Date

WordPress core lacks the ability to schedule out changes to content that has already been published. The only option for editing published posts is to push changes live. This is also the same for the customizer, but the XWP team is aiming to add scheduling to Customize Snapshots.

“The idea here, though not implemented yet in the feature plugin, is that you could also schedule a snapshot (aka transaction) to go live at a certain time,” Ruter said. “So you could bundle up a bunch of changes in the Customizer and ‘Save & Publish’ at a scheduled time, like Sunday at midnight.”

With transactions added to the customizer, users could build up a large ‘changeset’ as a draft, including things like building new pages, adding a collection of widgets, and updating menu items. The entire set of changes can then be scheduled to go live at the same time.

“On the other side of that coin, it allows for there to be revision history for changes made in the Customizer,” Ruter said. “And this will work seamlessly with the Customize Posts feature plugin – the goal being to let the author do as much as possible during a Customizer session, for all changes to be previewed together, submitted for review and iteration, and staged for publishing at some point in time.”

Ruter said he sees Customize Snapshots as another take on the common desire to build out content on a staging environment, preview changes, and then promote those changes to production.

“This is a hard problem to solve, and lots of plugins are available with solutions, like WP-CFM, Ramp, and others,” he said. “But in the Customizer it’s something you can get for free because of its model, and you don’t need multiple environments. You just need to indicate which snapshot/transaction state you want to preview.”

If you previously had a difficult time grasping the technical details of Ruter’s customizer transactions proposal, the Customize Snapshots plugin is a perfect example of the kind of functionality that transactions would enable. The feature plugin is an adaptation of his proposed changes that implement the more fundamental “transactions” construct.

Customize Snapshots adds to XWP’s collection of plugins that extend the customizer in innovative ways and intersect with the framework’s long-term roadmap. Occasionally, this will also tie into client work, as with the case of Customize Snapshots.

“We try to propose Customizer solutions for client projects as a way to fund Customizer advances, but we also believe in the Customizer and would be working on it regardless,” Ruter said.

Customize Snapshots makes the customizer a more collaborative environment within WordPress. If you need to make a large number of changes and share a preview with others, this plugin will help you do that. The ability to see snapshots in the admin and schedule changes will make it even more useful in the future.

7

7 responses to “Draft and Save Customizer Changes for Later with New Customize Snapshots Plugin”

      • Just a personal preference from my UX POV. Enhancements over features. Examples (last time I dug in): The mobile icons acquired the Collapse footer. That was prime real estate. Some Active Callbacks seem finicky at times. No core rgba color control. Multi-click panels. No panel/section cursor click-backs (clicking Static Front Page, mouse has to go all the way back to top). Depending on a theme’s nav walker, clicking through Live Preview links can be sluggish and the beforeSend or refresh indicator gives awkward state indication. Sometimes Change theme panel, while in scroll gets stuck and can’t go back up. Sidebar is too wide. GUI readability. Etc. BUT, these are all enhancements 3rd-Party Developers have been able to improve or master.

        • While I agree with a few of the items you’ve pointed out that could use some testing and polish (color picker!), I’m not sure I’d agree with the line of thinking that says no new features can be explored before the existing product is perfect. I think new features can be explored in plugins as this one is without blocking any enhancement or fixing the issues you’ve outlined. If you follow the “fixes/enhancements before exploration” line of thinking to the extreme, that would basically put WordPress itself into a multi-release stability cycle with nothing worth announcing and no way to attract new developers to the platform. That’s just bad for everyone.

          Historically WordPress has added very few features that were focused on the process of designing, developing and approving sites even though there is a whole industry of people building their careers on the software. All that to say if Weston Ruter wants to use some of his time to work out a new feature that will aid in the process of creating the site like snapshots rather than another simplistic add on that doesn’t move the platform very far (looking at you, site logo control) then I’m all for it, even if it stays a plugin forever.

        • @Tai: Thanks very much for identifying these areas for improvement.

          The mobile icons acquired the Collapse footer. That was prime real estate.

          What did you have in mind that should have been located here? I’ll also note that the word “Collapse” is redundant with the left-arrow button to collapse the sidebar, so we would have some additional space if we hid that text.

          Some Active Callbacks seem finicky at times.

          Do you have an example of this?

          No core rgba color control.

          Are you saying you want an alternative to entering a HEX color, the ability to toggle between HEX, RGB, and even HSL (similar to Chrome’s dev tools)? Seems like a good enhancement ticket.

          Multi-click panels. No panel/section cursor click-backs (clicking Static Front Page, mouse has to go all the way back to top).

          Good point. This has been raised in #35186. Please watch that ticket.

          Depending on a theme’s nav walker, clicking through Live Preview links can be sluggish and the beforeSend or refresh indicator gives awkward state indication.

          Could you elaborate on this? File a ticket?

          Sometimes Change theme panel, while in scroll gets stuck and can’t go back up. Sidebar is too wide.

          Yes, there are definitely issues with the positioning of the panels and the animations between them. Please watch #34391.

  1. @Brent Jett I agree. Also applaud the Customizer team on their stellar work. I’m an Agile guy, but block features like Mutombo. Haven’t read the Transactions doc, but I’m assuming Snapshots is a POC aligned in tandem. So yes, definitely forward-thinking. There’s no doubt that WordPress will thrive downstream with new features and the creativity of its 3rd-party developers. As for the Custo’s functionality: I personally glob it as an actionable module, since I’ve trained my clients to limit their Custo usage and to focus primarily on their content (aka: actually using WordPress, not fiddling with WordPress). So perhaps I’m slightly biased to new Custo features for now ;)

Newsletter

Subscribe Via Email

Enter your email address to subscribe to this blog and receive notifications of new posts by email.