Proper indentation of code generated inside hooks

Question

I really like having my code all properly indented and all, but all the code generated by wordpress, like the one that appears on the header when we use wp_head(), loses all the indentation.

I think it doesn't really matter, neither the users nor the search engines give a s**t about the code being indented or not, but when it comes to debugging, it really helps a lot.

Do you know of any plugin or option or something to fix this?

Answer 1

I don't think correct global indentation is possible without massive (and inefficient) output buffering to change it.

Since you are primarily interested in this for debug purposes I suggest using some tool that will format and color-code output (of any page btw, not just those that you control).

Firebug and View Source Chart work nicely for me.

Answer 2

You can use a custom helper function in functions.php

function add_indented($fn, $num_tabs=1, $params=null){
    ob_start();
    call_user_func($fn, $params);
    $html = ob_get_contents();
    ob_end_clean();
    $tabs="";
    for ($i=0 ; $i<$num_tabs ; $i++) $tabs.="\t";
    echo preg_replace("/\n/", "\n" . $tabs, substr($html, 0, - 1));
    echo "\n";
}

Then we use this function where we need to add the tabs.

Before

<?php wp_head(); ?>
<?php wp_footer(); ?>
<?php get_template_part('template-parts/content','home'); ?>

After:

<?php print_indented("wp_head"); ?>
<?php print_indented("wp_footer"); ?>

<!-- Add 4 tabs -->    
<?php print_indented('get_template_part', 4,'template-parts/content', 'home'); ?>