Mark Dixon

Often, when working on large, complicated WordPress sites it is not always evident which template file is being used for a certain page.

There is a template hierarchy but this is complex and not very evident to figure out. I admit to adding something (usually a bunch of Xs) to template files and refreshing the browser to try and figure out which file is being used.

There is an easier way

With the following code added to either the functions.php or header.php file we can view the current template file.

To add the PHP code to the functions.php file:

add_action('wp_head', 'show_template');
function show_template() {
	global $template;
	print_r('<div style="position: fixed; top: 0; z-index: 9999;">'.$template.'</div>');
}

To add the PHP code to the header.php (or other) file:

function show_template() {
	global $template;
	print_r('<div style="position: fixed; top: 0; z-index: 9999;">'.$template.'</div>');
}
show_template();

You can obviously style your div however you want. I have made it fixed to the top of the screen and given it a very high z-index so that it appears above my design.

It is not complicated but helps quite a bit with debugging certain WordPress behaviours.

Cheers.