Статьи

Добавление вкладки контекстной справки на экраны пользовательских типов записей

Эта маленькая вкладка «Справка», расположенная в верхнем правом углу панели администратора WordPress, которая при нажатии открывает полезную информацию о различных страницах администратора и о том, как они работают, называется вкладкой контекстной справки.

Это контекстная информация, поскольку отображаемая информация относится к странице администратора, которая просматривается в данный момент.

Например, если щелкнуть вкладку контекстной справки на экране редактирования, отображается информация о том, как выполнить несколько задач, включая следующие примеры:

  • Как настроить отображение экрана
  • Как ввести заголовок и содержание сообщения
  • Как вставить медиа-файлы в контент публикации
  • Как включить или отключить комментарии и пинги

Вкладка «Контекстная справка» - экран сообщений

Если вы являетесь разработчиком плагинов или тем, это будет полезно для предоставления быстрой документации вашим пользователям, что, в свою очередь, уменьшает количество вопросов о поддержке от ваших клиентов. Если вы хотите узнать больше о разработке тем, ознакомьтесь с курсом по разработке тем WordPress на SitePoint Premium.

При создании пользовательского типа сообщения и страницы настроек темы или плагина не существует вкладки контекстной справки по умолчанию. Поэтому в этом уроке вы узнаете, как добавить его на вышеупомянутые страницы администратора.

Добавление вкладки контекстной справки на экраны типа публикаций

add_help_tab() и set_help_sidebar класса WP_Screen используются для добавления контекстного меню справки и боковой панели на вкладку справки на странице администратора.

Функция ниже добавит три меню на вкладку контекстной справки страницы администратора.

На данный sp_help_tabs функция sp_help_tabs не будет отображаться ни на одной странице администратора, поскольку вам еще предстоит определить страницы, на которых она будет отображаться.

 function sp_help_tabs() { $screen = get_current_screen(); $screen->add_help_tab( array( 'id' => 'sp_overview', 'title' => 'Overview', 'content' => '<p>Overview of your plugin or theme here</p>' ) ); $screen->add_help_tab( array( 'id' => 'sp_faq', 'title' => 'FAQ', 'content' => '<p>Frequently asked questions and their answers here</p>' ) ); $screen->add_help_tab( array( 'id' => 'sp_support', 'title' => 'Support', 'content' => '<p>For support, shoot us a mail via [email protected]</p>' ) ); } 

Ниже приведен скриншот вкладки контекстной справки при добавлении на страницу администратора.

Пользовательская вкладка контекстной справки

Функция get_current_screen() возвращает объект WP_Screen страницы администратора, которая просматривается в данный момент, и его значение сохраняется в переменной $screen .

Метод add_help_tab() , который принимает указанные ниже параметры, вызывается три раза, чтобы добавить три меню к контекстной справке для экрана.

  • id : уникальный идентификатор для вкладки. Он должен быть HTML-безопасным и не должен содержать пустых мест.
  • title : заголовок для вкладки.
  • content : содержимое вкладки справки. может быть в виде простого текста или HTML.
  • callback : функция, которая вызывается для вывода содержимого этой страницы.

Из приведенного выше описания параметров видно, что третий и четвертый параметры связаны между собой — они связаны с отображением содержимого вкладки. В то время как первый представляет собой строку, содержащую содержимое в текстовом или HTML-формате, второй представляет собой функцию обратного вызова, которая вызывается для отображения или печати содержимого вкладки.

Функция обратного вызова принимает два аргумента $screen и $tab , где первый — это объект WP_Screen текущей страницы, а второй — массив аргументов add_help_tab() и их значений.

Эти два аргумента пригодятся, если вы захотите отобразить базу содержимого вкладки при определенных условиях. Например, у вас уже может быть контент, который вам нужно вывести, что упрощает вывод строки. Однако вам может понадобиться что-то манипулировать для получения этого контента, что делает использование обратного вызова более подходящим.

Пример использования callback :

 function sp_help_tabs() { $screen = get_current_screen(); $screen->add_help_tab( array( 'id' => 'sp_overview', 'title' => 'Overview', 'callback' => function ( $screen, $tab ) { echo '<p>Overview of your plugin or theme here.</p>'; } ) ); } 

В приведенном выше коде анонимная функция используется в качестве обратного вызова. Именованную функцию также можно использовать так:

 function sp_help_tabs() { $screen = get_current_screen(); $screen->add_help_tab( array( 'id' => 'sp_overview', 'title' => 'Overview', 'callback' => 'overview_content' ) ); } function overview_content( $screen, $tab ) { echo '<p>Overview of your plugin or theme here.</p>'; } 

И content и callback могут быть объединены вместе с первым, отображаемым перед последним.

 function sp_help_tabs() { $screen = get_current_screen(); $screen->add_help_tab( array( 'id' => 'sp_overview', 'title' => 'Overview', 'content' => '<p>Overview of your plugin or theme here.</p>', 'callback' => function () { echo '<p>More detailed description of the plugin coming soon.</p>'; } ) ); } 

Чтобы добавить боковую панель к контекстной справке для экрана, используйте WP_Screen set_help_sidebar следующим образом:

 function sp_help_tabs() { $screen = get_current_screen(); $screen->add_help_tab( array( 'id' => 'sp_overview', 'title' => 'Overview', 'content' => '<p>Overview of your plugin or theme here</p>' ) ); $screen->add_help_tab( array( 'id' => 'sp_faq', 'title' => 'FAQ', 'content' => '<p>Frequently asked questions and their answers here</p>' ) ); $screen->add_help_tab( array( 'id' => 'sp_support', 'title' => 'Support', 'content' => '<p>For support, shoot us a mail via [email protected]</p>' ) ); // Add a sidebar to contextual help. $screen->set_help_sidebar( 'This is the content you will be adding to the sidebar.' ); } 

Чтобы добавить вкладку контекстной справки на экран пользовательского типа записи book , подключите функцию sp_help_tabs к действиям load-edit.php и load-post.php . Затем выполните условную проверку, чтобы убедиться, что вы находитесь в book CPT следующим образом:

 add_action( "load-edit.php", 'sp_help_tabs' ); add_action( "load-post.php", 'sp_help_tabs' ); function sp_help_tabs() { $screen = get_current_screen(); $screen_ids = array( 'edit-book', 'book' ); if ( ! in_array( $screen->id, $screen_ids ) ) { return; } $screen->add_help_tab( array( 'id' => 'sp_overview', 'title' => 'Overview', 'content' => '<p>Overview of your plugin or theme here</p>' ) ); $screen->add_help_tab( array( 'id' => 'sp_faq', 'title' => 'FAQ', 'content' => '<p>Frequently asked questions and their answers here</p>' ) ); $screen->add_help_tab( array( 'id' => 'sp_support', 'title' => 'Support', 'content' => '<p>For support, shoot us a mail via [email protected]</p>' ) ); // Add a sidebar to contextual help. $screen->set_help_sidebar( 'This is the content you will be adding to the sidebar.' ); } 

Функция sp_help_tabs() была подключена к действиям load-edit.php и load-post.php потому что вы хотите, чтобы вкладка контекстной справки отображалась в списке типов сообщений (страница, load-post.php список сообщений, относящихся к типу сообщений) и редактировании сообщений ( Страница администратора, на которой сообщение редактируется, сохраняется и публикуется).

Чтобы быть уверенным, что вы добавляете вкладку контекстной справки в экран настраиваемого типа записи book , вы используете условный оператор if внутри функции, чтобы убедиться, что текущий идентификатор экрана является либо edit-book либо book . Обратите внимание, что идентификатор экрана — это edit-book и book в load-post.php действий load-edit.php и load-post.php соответственно.

Если вы хотите, чтобы вкладка контекстной справки, отображаемая в load-edit.php и экранах edit-book , отличалась, подключите две функции, содержащие содержимое вкладок, к load-edit.php и load-post.php следующим образом:

 add_action( 'load-edit.php', 'post_listing_screen_help_tab' ); /** * This will be added to the admin page listing all post in "book" CPT. */ function post_listing_screen_help_tab() { $screen = get_current_screen(); if ( 'edit-book' != $screen->id ) { return; } $screen->add_help_tab( array( 'id' => 'book_review', 'title' => 'Book Reviews', 'content' => '<p>How to add a book review here</p>' ) ); // Add a sidebar to contextual help. $screen->set_help_sidebar( 'This is the content you will be adding to the sidebar.' ); } add_action( 'load-post.php', 'post_edit_screen_help_tab' ); /** * This will be added to the admin page for editing a post belonging to "book" CPT. */ function post_edit_screen_help_tab() { $screen = get_current_screen(); if ( 'book' != $screen->id ) { return; } $screen->add_help_tab( array( 'id' => 'edit_book_review', 'title' => 'Book Review Edit', 'content' => '<p>How to edit a book review entry.</p>' ) ); // adds a sidebar to contextual help. $screen->set_help_sidebar( 'This is the content you will be adding to the sidebar.' ); } 

Добавление вкладки контекстной справки на страницы настроек

Добавление вкладки справки на страницу настроек плагина или темы — это почти то же самое, что и добавленный выше экран типа сообщения.
Единственным отличием является action hook , к которой будет подключена функция, содержащая настройку вкладки контекстной помощи, которая в этом случае является hook_suffix возвращаемым add_menu_page() . Если вы создаете меню верхнего уровня или add_submenu_page() если это подменю.

Приведенный ниже код создает меню верхнего уровня для нашего демонстрационного плагина и нашу вкладку контекстной справки, добавленную на страницу настроек плагина.

 add_action( 'admin_menu', 'register_plugin_page' ); function register_plugin_page() { $hook_suffix = add_submenu_page( 'plugins.php', 'SitePoint Plugin', 'SitePoint', 'manage_options', 'sp-config', 'sp_plugin_page' ); add_action( "load-$hook_suffix", 'sp_help_tabs' ); } function sp_plugin_page() { /* Code for the settings page will go here */ } function sp_help_tabs() { $screen = get_current_screen(); $screen->add_help_tab( array( 'id' => 'sp_overview', 'title' => 'Overview', 'content' => '<p>Overview of your plugin or theme here</p>' ) ); $screen->add_help_tab( array( 'id' => 'sp_faq', 'title' => 'FAQ', 'content' => '<p>Frequently asked questions and their answers here</p>' ) ); $screen->add_help_tab( array( 'id' => 'sp_support', 'title' => 'Support', 'content' => '<p>For support, shoot us a mail via [email protected]</p>' ) ); $screen->set_help_sidebar( 'This is the content you will be adding to the sidebar.' ); } 

Функция hook_suffix возвращаемая add_menu_page() была сохранена в переменной $hook_suffix и затем использована вместе с префиксом load для формирования действия load-$hook_suffix которое использовалось для включения нашей вкладки контекстной справки — sp_help_tabs() — на страницу настроек плагина.

Вывод

В этом уроке мы узнали, что такое вкладки контекстной справки, их важность и как их реализовать в экранах типов сообщений WordPress и страниц настроек плагинов / тем, надеясь, что это приведет к уменьшению количества вопросов поддержки и технической поддержки клиентов!

Если у вас есть какие-либо вопросы или предложения, оставьте комментарий ниже!