Correct indentation of HTML and PHP using Vim

Viewed 46874

I've been using Vim for a while, and I can't get proper HTML indentation working in PHP files.

For example, what I want is for each child to be indented one tab more than it's parent, as shown below.

<?php
if(isset($sports)) {
    //Do something
?>
<div>
    <label>Uniform Size</label>
    <ul>
        <li class="left"><label for="s" class="small">S</label><input type="radio" name="size[]" value="S" id="s" class="radio" /></li>
        <li class="left"><label for="m" class="small">M</label><input type="radio" name="size[]" value="M" id="m" class="radio" /></li>
        <li class="left"><label for="l" class="small">L</label><input type="radio" name="size[]" value="L" id="l" class="radio" /></li>
        <li class="left"><label for="xl" class="small">XL</label><input type="radio" name="size[]" value="XL" id="xl" class="radio" /></li>
    </ul>
</div>
<?php
}
?>

Using the PHP-correct-Indent script, the code results in being formatted as follows:

<?php
if(isset($sports)) {
    //Do something
?>
<div>
<label>Uniform Size</label>
<ul>
<li class="left"><label for="s" class="small">S</label><input type="radio" name="size[]" value="S" id="s" class="radio" /></li>
<li class="left"><label for="m" class="small">M</label><input type="radio" name="size[]" value="M" id="m" class="radio" /></li>
<li class="left"><label for="l" class="small">L</label><input type="radio" name="size[]" value="L" id="l" class="radio" /></li>
<li class="left"><label for="xl" class="small">XL</label><input type="radio" name="size[]" value="XL" id="xl" class="radio" /></li>
</ul>
</div>
<?php
}
?>

Even with indented HTML which I then add PHP code to, the indentation is ignored, moving new lines of HTML code without any indentation at all.

So, is there any way that I can get the indentation format that I want working with HTML within PHP files, using Vim?

9 Answers

There is a set of vimrc instructions on the Vim Wiki called Better indent support for PHP with HTML that will use the correct plugin depending on the block.

There is also a Vundle/Pathogen Plugin that uses the same code but is easier to install and keeps your .vimrc clean.

Pathogen

cd ~/.vim/bundle
git clone https://github.com/captbaritone/better-indent-support-for-php-with-html.git

Vundle

Place in .vimrc

Bundle 'captbaritone/better-indent-support-for-php-with-html'

Run in vim

:BundleInstall

php-correct-indenting only cares about your PHP, and assumes the readability of the HTML is of no interest. An XML indenter would position the tags nicely, but wouldn't be able to indent the contents of a <?php> processing instruction to match. Maybe there is an indentation script that understands both the C-like syntax of PHP the programming language and [X][HT]ML the markup language being templated, but I've never met one yet - sorry.

Still, I'd like to fiddle with the indenting in your example even before php-correct-indenting mauled it! The <div> element is inside an outer if-statement, but I have no way to see that from the indenting. I'd suggest something like:

<?php if(isset($sports)) { ?>
    <?php
        // Do something
    ?>
    <div>
        <label>Uniform Size</label>
        <ul>
            <li>etc. etc.</li>
        </ul>
    </div>
<?php } ?>
Related