plugins - Show missing Sidebar from Gutenberg admin area

admin管理员组

文章数量:1023849

I hid the custom sidebar from Wordpress example / by pressing remove from toolbar star in the panel. How to get this toolbar again (I can only rename plugin name in the code to see it again)? It looks like Gutenberg is saving somewhere it's settings. Where? Thanks

I hid the custom sidebar from Wordpress example https://wordpress/gutenberg/handbook/designers-developers/developers/tutorials/plugin-sidebar-0/ by pressing remove from toolbar star in the panel. How to get this toolbar again (I can only rename plugin name in the code to see it again)? It looks like Gutenberg is saving somewhere it's settings. Where? Thanks

• plugins
• sidebar
• block-editor

Share Improve this question asked Apr 24, 2019 at 19:25 LovorLovor 1,0061010 silver badges1616 bronze badges 2

• What's the toolbar star? – Tom J Nowell ♦ Commented Apr 24, 2019 at 20:30
• Star beside title which appears in the example – Lovor Commented Apr 24, 2019 at 20:59

Add a comment  | 

2 Answers 2

Sorted by: Reset to default 5

No code changes are necessary, it can be done entirely in the UI. Sidebars appear in the 3 dot drop down menu, the star is just a way to add a shortcut to the top toolbar, e.g. here are the Yoast and Jetpack sidebars listed:

Clicking on those options brings up their sidebars, as well as the unchecked star that can be used to re-add them to the top toolbar. In the image above, I had unchecked the star on the yoast sidebar, just as you had with your own sidebar

edit

On further investigation, I've replicated the issue and raised a bug on the Gutenberg repo

I also notice that there's what appears to be a more complete example here:

https://wordpress/gutenberg/handbook/designers-developers/developers/packages/packages-plugins/

So it appears that the handbooks code example is incomplete, and that you need to specify a component of type PluginSidebarMoreMenuItem in addition to the sidebar itself in order for it to show up as I described above

// Using ES5 syntax
var el = wp.element.createElement;
var Fragment = wp.element.Fragment;
var PluginSidebar = wp.editPost.PluginSidebar;
var PluginSidebarMoreMenuItem = wp.editPost.PluginSidebarMoreMenuItem;
var registerPlugin = wp.plugins.registerPlugin;

function Component() {
    return el(
        Fragment,
        {},
        el(
            PluginSidebarMoreMenuItem,
            {
                target: 'sidebar-name',
            },
            'My Sidebar'
        ),
        el(
            PluginSidebar,
            {
                name: 'sidebar-name',
                title: 'My Sidebar',
            },
            'Content of the sidebar'
        )
    );
}
registerPlugin( 'plugin-name', {
    icon: 'smiley',
    render: Component,
} );

I found an answer - settings are hidden in local storage in browser. Deleting it restores the sidebar. If someone knows how to disable this "star" option to hide the panel, I would be grateful

I hid the custom sidebar from Wordpress example / by pressing remove from toolbar star in the panel. How to get this toolbar again (I can only rename plugin name in the code to see it again)? It looks like Gutenberg is saving somewhere it's settings. Where? Thanks

I hid the custom sidebar from Wordpress example https://wordpress/gutenberg/handbook/designers-developers/developers/tutorials/plugin-sidebar-0/ by pressing remove from toolbar star in the panel. How to get this toolbar again (I can only rename plugin name in the code to see it again)? It looks like Gutenberg is saving somewhere it's settings. Where? Thanks

• plugins
• sidebar
• block-editor

Share Improve this question asked Apr 24, 2019 at 19:25 LovorLovor 1,0061010 silver badges1616 bronze badges 2

• What's the toolbar star? – Tom J Nowell ♦ Commented Apr 24, 2019 at 20:30
• Star beside title which appears in the example – Lovor Commented Apr 24, 2019 at 20:59

Add a comment  | 

2 Answers 2

Sorted by: Reset to default 5

No code changes are necessary, it can be done entirely in the UI. Sidebars appear in the 3 dot drop down menu, the star is just a way to add a shortcut to the top toolbar, e.g. here are the Yoast and Jetpack sidebars listed:

Clicking on those options brings up their sidebars, as well as the unchecked star that can be used to re-add them to the top toolbar. In the image above, I had unchecked the star on the yoast sidebar, just as you had with your own sidebar

edit

On further investigation, I've replicated the issue and raised a bug on the Gutenberg repo

I also notice that there's what appears to be a more complete example here:

https://wordpress/gutenberg/handbook/designers-developers/developers/packages/packages-plugins/

So it appears that the handbooks code example is incomplete, and that you need to specify a component of type PluginSidebarMoreMenuItem in addition to the sidebar itself in order for it to show up as I described above

// Using ES5 syntax
var el = wp.element.createElement;
var Fragment = wp.element.Fragment;
var PluginSidebar = wp.editPost.PluginSidebar;
var PluginSidebarMoreMenuItem = wp.editPost.PluginSidebarMoreMenuItem;
var registerPlugin = wp.plugins.registerPlugin;

function Component() {
    return el(
        Fragment,
        {},
        el(
            PluginSidebarMoreMenuItem,
            {
                target: 'sidebar-name',
            },
            'My Sidebar'
        ),
        el(
            PluginSidebar,
            {
                name: 'sidebar-name',
                title: 'My Sidebar',
            },
            'Content of the sidebar'
        )
    );
}
registerPlugin( 'plugin-name', {
    icon: 'smiley',
    render: Component,
} );

I found an answer - settings are hidden in local storage in browser. Deleting it restores the sidebar. If someone knows how to disable this "star" option to hide the panel, I would be grateful

本文标签： pluginsShow missing Sidebar from Gutenberg admin area