Есть ли способ добавить новую вкладку в редактор WordPress Gutenberg

Я совершенно не знаком с Гутенбергом, и мне нужно добавить новую вкладку в разделе настроек. Пожалуйста, проверьте этот снимок экрана.

введите описание изображения здесь

Я создал несколько блоков для Гутенберга, но опыта в этом нет. Я пробовал этот код

import { TabPanel } from '@wordpress/components';

    const onSelect = ( tabName ) => {
        console.log( 'Selecting tab', tabName );
    };

    const MyTabPanel = () => (
        <TabPanel className="my-tab-panel"
            activeClass="active-tab"
            onSelect={ onSelect }
            tabs={ [
                {
                    name: 'tab1',
                    title: 'Tab 1',
                    className: 'tab-one',
                },
                {
                    name: 'tab2',
                    title: 'Tab 2',
                    className: 'tab-two',
                },
            ] }>
            {
                ( tab ) => <p>{ tab.title }</p>
            }
        </TabPanel>
    );

Но мне это не помогло. Кто-нибудь здесь, пожалуйста, помогите мне. заранее спасибо


person Manoj Dhiman    schedule 19.10.2020    source источник


Ответы (1)


На приведенном вами снимке экрана место, в которое вы пытаетесь добавить вкладку, - это заголовок настроек (gutenberg / packages / edit-post / src / components / sidebar / settings-header), для которого в настоящее время нет слота в API Гутенберга для расширения (хотя это потенциально может быть сделано, лучше не мешать основному пользовательскому интерфейсу).

Предпочтительный метод добавления в пользовательский интерфейс администратора - использовать предоставленный SlotFill для нестандартного контента в настоящее время есть:

  • PluginBlockSettingsMenuItem
  • PluginDocumentSettingPanel
  • PluginMoreMenuItem
  • PluginPostPublishPanel
  • PluginPostStatusInfo
  • PluginPrePublishPanel
  • ПлагинSidebar
  • PluginSidebarMoreMenuItem

слот PluginSidebar полезен для добавления пользовательского контента, который специально для ваших плагинов / блоков. Главный вопрос, который следует учитывать, - это то, применяется ли контент, который вы хотите добавить, только к вашему блоку, публикации / странице в целом или является какой-либо другой «глобальной» настройкой, связанной с плагином.

Если ваш контент применяется ко всему сообщению / странице, Слот PluginPostStatusInfo может быть хорошим местом для добавления. Вы также можете добавить свою собственную панель, которая отображается под вкладкой «Документ».

Если содержимое зависит от блока, вы можете использовать его для добавления настраиваемых элементов управления под вкладкой «Блок», которые контекстно отображаются при выборе вашего блока. Это также было бы хорошим местом для значений мета-полей, относящихся к блоку, или настраиваемых элементов управления для цветов / параметров отображения, связанных с вашим блоком.

В официальной документации WordPress Gutenberg также есть руководство по Элементы управления блоком: панель инструментов блокировки и боковая панель настроек, в которой рассматриваются некоторые распространенные сценарии добавления ваших собственных настроек в блоки.

person S.Walsh    schedule 20.10.2020