How can I easily retab html files according to some sane default?

I have some html files that I'd like to retab that look like this:

<header>
    <div class="wrapper">
                    <img src="images/logo.png">
                    <div class="userbox">
                            <div class="welcome">Welcome Andy!</div>
                            <div class="blackbox">
                                    <ul>
                                            <li><a href="#">Invite Friends</a></li>
                                            <li><a href="#">My Account</a></li>
                                            <li><a href="#">Cart</a></li>
                                            <li><a href="#">Sign Out</a></li>
                                    </ul>
                            </div>
                    </div>
            </div>
</header>

And I want them to look something like this:

<header>
  <div class="wrapper">
    <img src="images/logo.png">
    <div class="userbox">
      <div class="welcome">Welcome Andy!</div>
        <div class="blackbox">
          <ul>
            <li><a href="#">Invite Friends</a></li>
            <li><a href="#">My Account</a></li>
            <li><a href="#">Cart</a></li>
            <li><a href="#">Sign Out</a></li>
          </ul>
        </div>
    </div>
  </div>
</header>

Or some sane default. What's the easiest way to go about doing this from the terminal in ubuntu for all of the html files in the current directory?

Solution 1:

In vim:

:set softtabstop=0
:set expandtab
:set smarttab
:set shiftwidth=2
gg=G
:retab

EDIT: Explainations:

• lines 1-3: sane default
• line 4: indent with 2 spaces
• line 5:
  • gg: top line
  • =: indent until...
  • G: ...end
• line 6: insure that all tabs are converted to spaces

Solution 2:

sudo apt-get install tidy
cd whatever_dir_you_want
find . -name '*.html' -exec tidy -m {} \;

Note: this probably wont play nice with inline-php. Play around with tidy (without the -m argument) to see how it works.