[wp-hackers] Outputting Clean Well Indented and Readable X/HTML

Mon Mar 7 21:25:24 UTC 2011

You're always going to run into that problem.  Some PHP scripts in
particular are written in a way that can break clean outlining of HTML.  For
example:

<?php
class Example {
    function this_is_a_function() {
        ... do something ...
    }

    static function another_function() {
    ?>
    <div>Return HTML</div>
    <?php
    }
}
?>

Developers will write the PHP code so that it's presented in a clean,
readable format ... but the additional whitespace gets dumped in the browser
wherever it's used.  For example:

<html>
<head>
</head>
<body>
    <div id="header">
    </div>
    <div id="wrapper">
        <div id="content">
            <?php echo Example::another_function(); ?>
        </div>
    </div>
</body>
</html>

Once you start making the PHP generate HTML markup, you lose any chance of
creating clean indenting without an additional tool.  Fortunately, just
about any in-browser developer tool will compensate for this.  Firebug for
Firefox and the built-in developer consoles for Chrome and Safari all
re-create the X/HTML tree from the markup.  They dump the whitespace and
indenting in the document and re-render everything in a clean, *foldable*
 format.

So when you're developing and trying to troubleshoot issues, *please* use a
proper debugging tool.  Even the IE Developer Tools system is better than
trying to view-source and debug manually.  As far as best practices go, it's
always better to keep HTML generation out of your PHP files, but once you
start adding multiple plug-ins to freely available themes to dynamic
JavaScript-generated elements you lose any control over the presentation of
the source's markup.  The browser can still read it, so use one of the
browser tools that can both read it and make it easy for you to read as
well.

On Mon, Mar 7, 2011 at 12:54 PM, Andy Charrington-Wilden <
andycharrington at gmail.com> wrote:

> That's a great question. I too would like to hear how others deal with
> this.
>
> Andy
>
> Jealous Designs
> Website: jealousdesigns.co.uk
> Portfolio: jealousdesigns.co.uk/portfolio
> Phone: 07903030008
> Twitter: _a_n_d_y
> Skype: andycharrington
>
> Sent from my iPhone
>
> On 7 Mar 2011, at 20:34, Alex Andrews <awgandrews at gmail.com> wrote:
>
> > Dear all,
> >
> > Looking at the raw HTML for a site I'm working for, its really
> > horribly formatted. There is just so much unnecessary whitespace and
> > bad indenting. It makes it very difficult to work out what is going
> > on, and occasionally what is going wrong.
> >
> > How do other people cope with this? I know there are a few plugins,
> > but they don't seem to format HTML 5 well. HTML Tidy module for PHP is
> > unavailable on my server. How can one:
> >
> > 1. Use plugins to make HTML output from Wordpress look best.
> > 2. Have best practices for programming PHP in Wordpress to solve this
> problem?
> >
> > Thanks for all your help.
> >
> > All the best.
> >
> > Alex
> > _______________________________________________
> > wp-hackers mailing list
> > wp-hackers at lists.automattic.com
> > http://lists.automattic.com/mailman/listinfo/wp-hackers
> _______________________________________________
> wp-hackers mailing list
> wp-hackers at lists.automattic.com
> http://lists.automattic.com/mailman/listinfo/wp-hackers
>