How to Close and Re-Open WordPress Gutenberg Sidebar

The sidebar gets a lot of use in the WordPress Block Editor, a.k.a. Gutenberg, but I found myself in a situation where I needed to programmatically close the sidebar and then re-open it later. This is how I did it.

// Save the name of the currently open sidebar to generalSidebarName.
generalSidebarName = wp.data.select('core/edit-post')
  .getActiveGeneralSidebarName();

// Close the sidebar.
await wp.data.dispatch('core/edit-post').closeGeneralSidebar();

At some point later to the sidebar name we stored in generalSidebarName.

// Re-open the sidebar (to the same sidebar that had been open).
wp.data.dispatch('core/edit-post').openGeneralSidebar(generalSidebarName);

Sal Ferrarello (@salcode)

Sal is a PHP developer with a focus on the WordPress platform. He is a conference speaker with a background including Piano Player, Radio DJ, Magician/Juggler, Beach Photographer, and High School Math Teacher. Sal can be found professionally at WebDevStudios, where he works as a senior backend engineer.