HTML Comments within Comments

Everyone once in a while I find myself in need of nested HTML comments (i.e. HTML comments within comments).  Unfortunately, HTML does not support nested comments.  When you put HTML comments within comments, some of your content ends up uncommented.

PHP

Since it is rare that I’m working on a straight HTML site, usually there is PHP involved even if only to load an include files for the header and footer, I’ll often comment out the lines using PHP tags.  Unfortunately, this is no help when the site does not include a server side language (e.g. PHP).

Almost HTML comments within comments

One of my fellow LaunchDM developers, Dustyn Doyle, came up with the excellent idea of using script tags and JavaScript comments to comment out a block of HTML.

For Example if You Have this HTML with comments

<ul>
  <li class="entry1">
    <a href="#link1">
      Entry One
    </a>
  </li><!-- .entry1 -->
  <li class="entry2">
    <a href="#link2">
      Entry Two
    </a>
  </li><!-- .entry2 -->
</ul>

Commented out Version

<script> /*
<ul>
  <li class="entry1">
    <a href="#link1">
      Entry One
    </a>
  </li><!-- .entry1 -->
  <li class="entry2">
    <a href="#link2">
      Entry Two
    </a>
  </li><!-- .entry2 -->
</ul>
*/ </script>

photo credit: A.Munich via photopin cc

Sal Ferrarello (@salcode)

Sal is a PHP developer with a focus on the WordPress platform. He is a conference speaker with a background including Piano Player, Radio DJ, Magician/Juggler, Beach Photographer, and High School Math Teacher. Sal can be found professionally at WebDevStudios, where he works as a senior backend engineer.