This little tab « Help Which is on the top right corner of the WordPress admin dashboard which when clicked reveals useful information about the various admin pages and how they work is called a context-sensitive help tab.
First of all, if you have never installed WordPress discover How to Install a WordPress Blog in 7 Steps et How to search, install and activate a WordPress theme on your blog
Then back to why we are here.
This help is contextual because the information it displays belongs to the administration page currently being viewed.
For example, when the context-sensitive Help tab is clicked on the article edit screen, information about how several tasks are revealed, including the following examples:
- How to customize the screen display
- How to enter the title and content of the message
- How to insert media files into the content of the publication
- How to enable or disable comments and pingbacks
If you are a plugin developer or WordPress theme, it will help you provide quick documentation to your users which will reduce your customer support questions.
When a custom post type and settings page of the WordPress theme or plugin are created, there is no contextual help tab by default. Hence, in this tutorial, you will learn how to add one to the admin pages mentioned above.
Read also our 5 steps to create better content for your blog
Added contextual help tab on the dashboard
The methods " add_help_tab () " and " set_help_sidebar () " of style WP_Screen allow you to add a contextual help menu and a sidebar to the Help tab in an administration page.
The function below will add three menus to the contextual help tab of an administration page.
For now, the "sp_help_tabs" function is not displayed in any administration page because you have not yet defined the page (s) where it will be displayed.
function sp_help_tabs() {
$screen = get_current_screen();
$screen->add_help_tab(
array(
'id' => 'sp_overview',
'title' => 'Aperçu',
'content' => '<p>Aperçu de votre plugin</p>'
)
);
$screen->add_help_tab(
array(
'id' => 'sp_faq',
'title' => 'FAQ',
'content' => '<p>Foire aux questions</p>'
)
);
$screen->add_help_tab(
array(
'id' => 'sp_support',
'title' => 'Assistance',
'content' => '<p>Assisance</p>'
)
);
}Below is a screenshot of the Context Help tab when added to an admin page.
Also take a look at How to create screenshots on WordPress
Function " get_current_screen () »Returns an object« WP_Screen Of the currently open administration page, and its value is saved in the variable $ screen.
The method " add_help_tab () ”, Which accepts the parameters below, is called three times to add three menus to the on-screen contextual help.
- ID : a unique identifier for the tab. It must be secure in HTML and must not contain spaces.
- Title: title for the tab.
- Content: content of the help tab. Maybe in plain text or HTML.
- Reminder: the function must be called to display the contents of this page.
From the parameter description above, you can see that the third and fourth parameters are related - they deal with the display of tab content. While the former is a string containing the content in text or HTML format, the latter is a callback function that echoes or prints the content of the tab.
Discover more How to customize the admin area of your WordPress blog
The callback function accepts two arguments " $ screen " and " $ tab ". While the first is the subject " WP_Screen "Of the current page and the last, an array of arguments and their values of the function" add_help_tab () ».
These two arguments will be useful if you want to display content on the tab under certain conditions. For example, you may already have the content you need to display, so you can just display the channel. However, you might have to manipulate something to acquire this content, which makes using a callback more appropriate.
An example of the use of the callback:
function sp_help_tabs() {
$screen = get_current_screen();
$screen->add_help_tab(
array(
'id' => 'sp_overview',
'title' => 'Aperçu',
'callback' => function ( $screen, $tab ) {
echo '<p>Aperçu de votre onglet</p>';
}
)
);
}In the code above, an anonymous function is used as a callback. A named function can also be used as follows:
function sp_help_tabs() {
$screen = get_current_screen();
$screen->add_help_tab(
array(
'id' => 'sp_overview',
'title' => 'Aperçu',
'callback' => 'overview_content'
)
);
}
function overview_content( $screen, $tab ) {
echo '<p>Aperçu de votre plugin.</p>';
}Both: "content" and "callback" can be combined with the first displayed before this one.
function sp_help_tabs() {
$screen = get_current_screen();
$screen->add_help_tab(
array(
'id' => 'sp_overview',
'title' => 'Aperçu',
'content' => '<p>Aperçu de votre plugin</p>',
'callback' => function () {
echo '<p>Plus de détails sur le plugin</p>';
}
)
);
}To add a sidebar using onscreen context help, use " WP_Screen And his method set_help_sidebar " as following :
function sp_help_tabs() {
$screen = get_current_screen();
$screen->add_help_tab(
array(
'id' => 'sp_overview',
'title' => 'Aperçu',
'content' => '<p>Aperçu de votre plugin</p>'
)
);
$screen->add_help_tab(
array(
'id' => 'sp_faq',
'title' => 'FAQ',
'content' => '<p>Foire aux questions</p>'
)
);
$screen->add_help_tab(
array(
'id' => 'sp_support',
'title' => 'Asistance',
'content' => '<p>Tout sur l'assistance</p>'
)
);
// Add a sidebar to contextual help.
$screen->set_help_sidebar( 'Cette section sera ajoutée à la sidebar.' );
}To add the contextual help tab to a "book" publication type, hook the "sp_help_tabs" function to the "load-edit.php" and "load-post.php" actions. Next, run a conditional check to make sure that you are in a custom post type for "book", like so:
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' => 'Aperçu',
'content' => '<p>Aperçu de votre plugin</p>'
)
);
$screen->add_help_tab(
array(
'id' => 'sp_faq',
'title' => 'FAQ',
'content' => '<p>Foire aux questions</p>'
)
);
$screen->add_help_tab(
array(
'id' => 'sp_support',
'title' => 'Assistance',
'content' => '<p>Section pour l'assistance</p>'
)
);
// Add a sidebar to contextual help.
$screen->set_help_sidebar( 'Cette section sera ajoutée à la sdeibar.' );
}Function " sp_help_tabs () "Was hung on" Load-edit.php »And« Load-post.php Because you want the context-sensitive help tab to appear in the publication lists (page that lists the publication belonging to the publication type) and the edition page (administration page where a publication is edited, saved and published).
See our article on How to restore the editing mode without distraction of WordPress
To make sure you add the Context Help tab to the custom post type " book ", You can use the conditional" if "statement inside the function to ensure that the current screen ID is indeed" edit-book " and " book ". Note that the screen ID is " edit-book " and " book In the square brackets Load-edit.php " and " Load-post.php " respectively.
If you want the contextual help tabs displayed in the list of books and the edit-book editing screens to be different, connect two functions containing the contents of the tab Load-edit.php " and " Load-post.php "as following:
add_action( 'load-edit.php', 'post_listing_screen_help_tab' );
/**
* Cette section sera ajouté au CPT book
*/
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' => 'Revue des livres',
'content' => '<p>Ajouter une revue des livres ici</p>'
)
);
// Add a sidebar to contextual help.
$screen->set_help_sidebar( 'Cette section s'affichera sur la 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' => 'Modifier uner evue',
'content' => '<p>Comment modifier une revue.</p>'
)
);
// adds a sidebar to contextual help.
$screen->set_help_sidebar( 'Cette section s'affichera sur la sidebar.' );
}How to add a help menu to plugins settings pages
Adding a help tab to a plugin or plugin settings page WordPress theme is pretty much the same process as on a custom post format screen.
The only difference is the hook on which the function containing the contextual help tab will be hooked, which in this case is " hook_suffix ”Returned by add_menu_page (). If you are creating a top-level menu or if it is an add_submenu_page () submenu.
Discover also our article on Some WordPress plugins to redirect
The code below creates a top-level menu for our demo plugin and our context-sensitive help tab which has been added to the plugin's configuration 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() {
/* Le code pour les réglages sera ajouté ici */
}
function sp_help_tabs() {
$screen = get_current_screen();
$screen->add_help_tab(
array(
'id' => 'sp_overview',
'title' => 'Aperçu',
'content' => '<p>Aperçu de votre thème ici</p>'
)
);
$screen->add_help_tab(
array(
'id' => 'sp_faq',
'title' => 'FAQ',
'content' => '<p>Foire aux questions</p>'
)
);
$screen->add_help_tab(
array(
'id' => 'sp_support',
'title' => 'Assistance',
'content' => '<p>Section d'assistance</p>'
)
);
$screen->set_help_sidebar( 'Cette section sera ajoutée à la sidebar.' );
}The " hook_suffix "Returned by" add_menu_page () Has been recorded on a variable $ hook_suffix Then used with the prefix " load To form an action load- $ hook_suffix Which was used to include our context sensitive help tab using the " sp_help_tabs () On the plugin settings page.
That's about everything about the fairly detailed method on how to add a help menu to the plugin settings pages.
Discover also some premium WordPress plugins
You can use other WordPress plugins to give a modern appearance and to optimize the handling of your blog or website.
We offer you here some premium WordPress plugins that will help you do that.
1. WooCommerce Multi Currency
WooCommerce Multi Currency is a WordPress Plugin quite impressive premium that allows you to display your store in multiple currencies. It adds an option that allows the user to switch between currencies at any time. Changing between currencies is quite fast, which makes it even more convenient.
Since it is likely to work with multiple currencies, having the ability to be available in multiple languages is just a logical next step.
Read also our 10 WordPress plugins and WooCommerce to use multiple currencies
WooCommerce Multi Currency is therefore compatible with Polylang, WPML and many other plugins. It also offers a region detector, which will display the visitor's local currency.
Download | Demo | Web hosting
2. Aparg SmartAd
Si Do you want to win some money by selling advertising space on your website then you have come to the right place. the WordPress Plugin premium Aparg SmartAd is a unique ad management plugin, which offers you exclusive features.
Its installation time and interface will provide you with an excellent user experience. It's the only one WordPress Plugin of this type, which has intelligent advertising control that will allow you to reach your target audience.
Read also How to choose the keyword that will attract visitors on WordPress
Its main features are: Multilingual support, a professional graphical interface, the support for multisite, intelligent management of advertisements, 43 pop-up templates and 34 animations, fully customizable, support for multiple ad formats, the ability to schedule advertisements, automatic detection of ad blockers, etc.
Download | Demo | Web hosting
3. CommentPress
CommentPress is a powerful and compact premium WordPress plugin that allows you to insert, edit and delete comments quickly and easily. CommentPress uses Ajax, jQuery and PHP to give visitors the possibility to insert comments without having to reload the page.
This plugin has many customization options, finally giving it the look and appearance you want. It has a captcha to block spam and brings more security to your comment section.
Read also our article on How content marketing affects the SEO of your blog
Its main features are: the easy insertion of comments, the possibility for users to reply to specific comments, the pagination of comments, complete management of the administration of the comments section, buttons for easy insertion of images, videos and links, a fully responsive layout, a Captcha to secure the form and avoid spam, and much more.
Download | Demo | Web hosting
Recommended Resources
Find out about other recommended resources to help you build and manage your website.
- How to Display Recent SoundCloud Music from an Artist on WordPress
- Blog: What your readers do not need to know you
- 8 WordPress plugins to integrate an editing function
- 10 WordPress plugins to add a newsletter to a blog
Conclusion
Here ! That's it for this tutorial, I hope it will allow you to add a contextual help menu on WordPress. Do not hesitate to share with your friends on your favorite social networks.
However, you can also consult our resources, if you need more elements to carry out your projects of creation of Internet sites, by consulting our guide on WordPress blog creation.
If you have suggestions or remarks, leave them in our section Comments.
...
