Quick Tip: Get the Current Screen’s Hooks

Quick Tip: Get the Current Screen’s Hooks

Wherever possible it’s better to use screen-specific hooks rather than more generic init, admin_init, admin_footer etc. (unless you specifically want your callback to run on every screen). In this quick tip we’ll look at how you can easily obtain the screen hooks for any particular page.


Page Specific Hooks

Page specific hooks offer the most efficient (and cleanest) way of targeting a callback for only the screen(s) you need it for. They include:

  • load-{page-hook} – called prior to the screen loading (the logic for this can be found here)
  • admin_print_styles-{page-hook} – action for printing styles in the <head> of the admin page
  • admin_print_scripts-{page-hook} – action for printing scripts in the <head> of the admin page
  • admin_head-{page-hook} – action triggered inside the <head> of the admin page
  • admin_footer-{page-hook} – action triggered just above the closing </body> tag on the admin page

But what is the value of {page-hook} for any particular page? Looking at the load-* hook in particular you’ll find that there is a fairly convoluted logic in determining the {page-hook}. In particular, it treats custom plug-in pages differently from ‘core’ pages (such as post type and taxonomy pages), and for the sake of backwards compatibility, it will use multiple hooks for the same screen when editing posts, pages or categories.

The general rules for the value of {page-hook} can be summarised as follows:

  • For custom admin pages added via add_menu_page() (and related functions) it is the screen ID (the value returned by add_menu_page())
  • For the admin page listing posts of any post type, it is edit.php
  • On the ‘add new’ page of any post type, it is post-new.php
  • On the edit page of any post type, it is post.php
  • For taxonomy pages it is edit-tags.php

However the page hook is generated, it is ultimately stored in the global $hook_suffix.


Easily Get a Screen’s Hooks

In general those rules suffice in determining the page specific hooks. But when working with them I often find it helps to have an easy reference. To create this easy reference we’ll add a panel to the ‘help’ tab on the top right of every screen which will list the screen’s details (screen ID, screen base, and most usefully, the screen’s hook suffix). It will also list the screen’s specific hooks.

Panels in the help tab were introduced in 3.3, so this will only work for WordPress versions 3.3+. To add the panel we use the contextual_help filter. This is a filter for backwards compatibility purposes, so we don’t actually filter anything. Instead we use the WP_Screen::add_help_tab method.

/* Add contextual help */
add_filter( 'contextual_help', 'wptuts_screen_help', 10, 3 );
function wptuts_screen_help( $contextual_help, $screen_id, $screen ) { 

	// The add_help_tab function for screen was introduced in WordPress 3.3.
	if ( ! method_exists( $screen, 'add_help_tab' ) )
		return $contextual_help;

	/* ... generate help content ... */
	$help_content ='';

	$screen->add_help_tab( array(
		'id'      => 'wptuts-screen-help',
		'title'   => 'Screen Information',
		'content' => $help_content,
	));

	return $contextual_help;
}

To generate the help content, we take the global $hook_suffix and append it to the hook stems mentioned above. We also get a list of the screen’s details, which are stored as properties of the WP_Screen object.

	global $hook_suffix;

	// List screen properties
	$variables = '<ul style="width:50%;float:left;"><strong>Screen variables </strong>'
		. sprintf( '<li> Screen id : %s</li>', $screen_id )
		. sprintf( '<li> Screen base : %s</li>', $screen->base )
		. sprintf( '<li>Parent base : %s</li>', $screen->parent_base )
		. sprintf( '<li> Parent file : %s</li>', $screen->parent_file )
		. sprintf( '<li> Hook suffix : %s</li>', $hook_suffix )
		. '</ul>';

	// Append global $hook_suffix to the hook stems
	$hooks = array(
		"load-$hook_suffix",
		"admin_print_styles-$hook_suffix",
		"admin_print_scripts-$hook_suffix",
		"admin_head-$hook_suffix",
		"admin_footer-$hook_suffix"
	);

	// If add_meta_boxes or add_meta_boxes_{screen_id} is used, list these too
	if ( did_action( 'add_meta_boxes_' . $screen_id ) )
		$hooks[] = 'add_meta_boxes_' . $screen_id;

	if ( did_action( 'add_meta_boxes' ) )
		$hooks[] = 'add_meta_boxes';

	// Get List HTML for the hooks
	$hooks = '<ul style="width:50%;float:left;"><strong>Hooks</strong> <li>' . implode( '</li><li>', $hooks ) . '</li></ul>';

	// Combine $variables list with $hooks list.
	$help_content = $variables . $hooks;

Which will give us something like the following:


The Code in Full

You can place the following in your site’s utility plug-in, or (if you must), your theme’s functions.php. Make sure you rename wptuts_screen_help to something unique to you.

add_action( 'contextual_help', 'wptuts_screen_help', 10, 3 );
function wptuts_screen_help( $contextual_help, $screen_id, $screen ) {

	// The add_help_tab function for screen was introduced in WordPress 3.3.
	if ( ! method_exists( $screen, 'add_help_tab' ) )
		return $contextual_help;

	global $hook_suffix;

	// List screen properties
	$variables = '<ul style="width:50%;float:left;"> <strong>Screen variables </strong>'
		. sprintf( '<li> Screen id : %s</li>', $screen_id )
		. sprintf( '<li> Screen base : %s</li>', $screen->base )
		. sprintf( '<li>Parent base : %s</li>', $screen->parent_base )
		. sprintf( '<li> Parent file : %s</li>', $screen->parent_file )
		. sprintf( '<li> Hook suffix : %s</li>', $hook_suffix )
		. '</ul>';

	// Append global $hook_suffix to the hook stems
	$hooks = array(
		"load-$hook_suffix",
		"admin_print_styles-$hook_suffix",
		"admin_print_scripts-$hook_suffix",
		"admin_head-$hook_suffix",
		"admin_footer-$hook_suffix"
	);

	// If add_meta_boxes or add_meta_boxes_{screen_id} is used, list these too
	if ( did_action( 'add_meta_boxes_' . $screen_id ) )
		$hooks[] = 'add_meta_boxes_' . $screen_id;

	if ( did_action( 'add_meta_boxes' ) )
		$hooks[] = 'add_meta_boxes';

	// Get List HTML for the hooks
	$hooks = '<ul style="width:50%;float:left;"> <strong>Hooks </strong> <li>' . implode( '</li><li>', $hooks ) . '</li></ul>';

	// Combine $variables list with $hooks list.
	$help_content = $variables . $hooks;

	// Add help panel
	$screen->add_help_tab( array(
		'id'      => 'wptuts-screen-help',
		'title'   => 'Screen Information',
		'content' => $help_content,
	));

	return $contextual_help;
}
Note: Want to add some source code? Type <pre><code> before it and </code></pre> after it. Find out more
  • http://www.deluxeblogtips.com Rilwis

    Very nice tip! I used to reference screen information, and when I need that, I just print_r the screen object. Haven’t thought about the contextual help! Thanks for sharing.

  • http://www.wpfix.org wpfix

    Nice tutorial :)

  • http://press12.com OMGCarlos

    Wow, the thought using screen specific hooks never occurred to me. Nice tut, especially love the panel idea!

  • Dan

    You forgot the tag. The whole post is showing up on the front page ;)

    • http://wp.envato.com/ Japh Thomson
      Staff

      Thanks, Dan! All fixed now. Sorry about that :)

  • Wilhelm Wanecek

    Great tut!
    However, are you aware of that the full tutorial is posted as a entry on the start page? :P
    Or is it just me?

    • http://wp.envato.com/ Japh Thomson
      Staff

      Thanks, Wilhelm! I’ve fixed this up now. Sorry about that :)

  • http://www.soulsizzle.com Ryan Marganti

    I do something similar using FirePHP (w/Firebug). Never thought to make use of contextual help screens. Great idea.

  • Carl

    Great Tut. Very Helpful. Is there a way of adding this to the admin bar as a menu item?

    • http://stephenharris.info/ Stephen Harris

      Hi Carl,

      Sorry this reply has come so late. Yes I can’t see why this couldn’t be added to the admin bar instead. I just chose the screen option has its a bit more out of the way.

  • Pingback: Tweet Parade (no. 37 Sep 2012) | gonzoblog.nl

  • Clifford

    Is this only for wp-admin pages (back-end)? How can I get something like this for the front-end, to see where all the hooks show up?

    Thank you.

    • http://stephenharris.info/ Stephen Harris

      Hi Clifford,

      Sorry for the delayed response. Yes it is only for the admin pages – there aren’t screen specific hooks (in the sense of the above) on the front-end.

      Typically for these pages (to enqueue scripts/styles say) you hook into wp_head and use the conditionals. Better still you can enqueue the scripts/styles in the callback of widgets and/or shortcodes for which they are needed (if that is the case).

  • Pingback: 8 Useful Snippets For Working With WordPress Hooks | W-Shadow.com

  • Pingback: Quick Tip: Get the Current Screen’s Hooks | ThemeMountain