[html] How to comment/uncomment in HTML code

Often while coding view templates in html, my habit of adding some helpful comments causes lots of time-consuming effort while testing.

Consider this code...

<!-- Here starts the sidebar -->
<div id="sidebar">
....
</div>

<!-- Here starts the main contents pane -->
<div id="main-contents">
...
</div>

<!-- Here starts the footer -->
<div id="footer">
...
</div>

Now, if I have to hide out some portion of the view template, in case of php I would just select the desired code and put single-line comments (using a shortcut key most of the times).

However, in html code, where only the block comments work, I end-up removing all the closing comment tags (-->) till the position I want the commenting to occur - something like this...

<!-- Here starts the sidebar
<div id="sidebar">
....
</div>

<!-- Here starts the main contents pane
<div id="main-contents">
...
</div>

<!-- Here starts the footer
<div id="footer">
...
</div>-->

Then when I'm done testing I have to go through the agony of putting back those closing tags.

Is there a better and time saving way of block commenting in HTML?

This question is related to html coding-style comments

The answer is


My view templates are generally .php files. This is what I would be using for now.

<?php // Some comment here ?>

The solution is quite similar to what @Robert suggested, works for me. Is not very clean I guess.


Put a space between the "-->" of your header comments. e.g. "- ->"


I find this to be the bane of XML style document commenting too. There are XML editors like eclipse that can perform block commenting. Basically automatically add extra per line and remove them. May be they made it purposefully hard to comment that style of document it was supposed to be self explanatory with the tags after all.


The following works well in a .php file.

<php? /*your block you want commented out*/ ?>

you can try to replace --> with a different string say, #END# and do search and replace with your editor when you wish to return the closing tags.


Eclipse Juno has a good way for it. You just do the cmd+/


Yes, to comment structural metadata out,

Using <script>/* ... */</script> in .html

Comment out large sections of HTML (Comment Out Block)

my personal way in a .html file is opening: <script>/* and close it with */</script>

<script>/* hiding code go here */</script>

Is a workaround to the problem since is not HTML.

Considering your code in .html...

  <!-- Here starts the sidebar -->
  <div id="sidebar">
  ....
  </div>

<script>/*
  <!-- Here starts the main contents pane -->
  <div id="main-contents">
  ...
  </div>

  <!-- Here starts the footer -->
  <div id="footer">
  ...
  </div>
*/</script>

And in a case is HTML inside PHP file using comment tag <?/* or <?php /* and close it with */?> . Remember that the file must be .php extension and don't work in .html.

<?/* hiding code go here */?>

Considering your code in .php...

  <!-- Here starts the sidebar -->
  <div id="sidebar">
  ....
  </div>

<?/*
  <!-- Here starts the main contents pane -->
  <div id="main-contents">
  ...
  </div>

  <!-- Here starts the footer -->
  <div id="footer">
  ...
  </div>
*/?>

Is worth nothing that is not HTML but a common developer practice is to comment out parts of metadata so that it will not be rendered and/or executed in the browser. In HTML, commenting out multiple lines can be time-consuming. It is useful to exclude pieces of template structural metadata containing comments, CSS or code and systematically commenting out to find the source of an error. It is considered a bad practice to comment blocks out and it is recommended to use a version control system. The attribute "type" is required in HTML4 and optional in HTML5.


Depending on your editor, this should be a fairly easy macro to write.

  • Go to beginning of line or highlighted area
  • Insert <!--
  • Go to end of line or highlighted area
  • Insert -->

Another macro to reverse these steps, and you are done.

Edit: this simplistic approach does not handle nested comment tags, but should make the commenting/uncommenting easier in the general case.


/* (opener) */ (closer)

for example,

<html>
 /*<p>Commented P Tag </p>*/
<html>

No. Unless you find a tool that does what you described for you.


Examples related to html

Embed ruby within URL : Middleman Blog Please help me convert this script to a simple image slider Generating a list of pages (not posts) without the index file Why there is this "clear" class before footer? Is it possible to change the content HTML5 alert messages? Getting all files in directory with ajax DevTools failed to load SourceMap: Could not load content for chrome-extension How to set width of mat-table column in angular? How to open a link in new tab using angular? ERROR Error: Uncaught (in promise), Cannot match any routes. URL Segment

Examples related to coding-style

Method Call Chaining; returning a pointer vs a reference? 80-characters / right margin line in Sublime Text 3 Cannot find reference 'xxx' in __init__.py - Python / Pycharm How to stick <footer> element at the bottom of the page (HTML5 and CSS3)? Simple way to create matrix of random numbers Is calling destructor manually always a sign of bad design? Count all values in a matrix greater than a value Iterate through a C++ Vector using a 'for' loop Which comment style should I use in batch files? Dictionaries and default values

Examples related to comments

Way to create multiline comments in Bash? Jenkins: Can comments be added to a Jenkinsfile? /** and /* in Java Comments Where is the syntax for TypeScript comments documented? Multiple line comment in Python How do I add comments to package.json for npm install? How to comment multiple lines with space or indent Is there a shortcut to make a block comment in Xcode? How to comment and uncomment blocks of code in the Office VBA Editor Which comment style should I use in batch files?