Correct reformat of HTML

Lofi · Mar 05, 2006#12006-03-05T13:35+00:00

Is there a way to correctly reformat HTML in UltraEdit, especially block tags? I haven't found one so far.

I've currently found a way to reformat the HTML source of a webpage with the Firefox extension "view reformatted source". It successfully indents the HTML correctly, but unfortunately when I copy/paste the code from there to UltraEdit, I get a flat list, so the Firefox extension doesn't work correctly for me.

The flat list looks like this:

Code: Select all

<html>
<head>
</head>
<body>
<table>
<tr>
<td>
<input name="">
<input name="">
<input name="">
</td>
</tr>
</table>
<div>
<br>some text
<br>
</div>
</body>
</html>

Reindenting that code in UltraEdit results in:

Code: Select all

<html>
	<head>
	</head>
	<body>
		<table>
			<tr>
				<td>
					<input name="">
						<input name="">
							<input name="">
							</td>
						</tr>
					</table>
					<div>
						<br>some text
						<br>
					</div>
				</body>
			</html>

This is absolutely not what I want. It indents every tag, e. g. incorrectly the <input> tag several times.

So the solution might be to indent only block tags. Is there a way to achieve this in UltraEdit?

Or even better: Is there a way to reformat the HTML correctly so that there will be a line break plus the correct indention after every html tag?

What I want is this:

Code: Select all

<html>
	<head>
	</head>
	<body>
		<table>
			<tr>
				<td>
					<input name="">
					<input name="">
					<input name="">
				</td>
			</tr>
		</table>
		<div>
			<br>some text
			<br>
		</div>
	</body>
</html>

Thanks.

PS: Please no 3rd party product suggestions like HTML Tidy

Mar 05, 2006#22006-03-05T16:11+00:00

Add-on to my last post: Found a possible bug with the wordfile.txt & HTML combination in version 11.20.

e.g. META:

/Indent Strings = "<HTML" "<HEAD" "<META"
/Unindent Strings = "</HTML" "</HEAD" "</META"

would deliver the following wrong indention:

Code: Select all

<html>
	<head>
		<meta>
	</meta>
	<meta content="dummy" name="dummy">
</meta>

<script type="text/javascript" src="/dummy.js">
</script>
</head>
<body>
</body>
</html>

The meta tag doesn't get outdented correctly.

And the default wordfile.txt:

/L9"JavaScript" JSCRIPT_LANG
...
/Indent Strings = "{" "else"
/Unindent Strings = "}"

leads to this:

Code: Select all

<script type="text/javascript">

	function dummy() {
		if ()
			open();
			else
				close();
			

		}

	</script>

Hence the else should be removed/corrected in my opinion as it never gets outdented.

Grover · Oct 04, 2006#32006-10-04T17:11+00:00

I haven't tested extensively, but I believe you're looking for this command (which is present in v. 12.10b, at least):

Format: Reindent Selection

It could probably be replaced with something a lot fancier, but all I've needed so far is enough formatting to let me find my way through my predecessors' many nested tables.

bdkbdk · Oct 05, 2006#42006-10-05T17:24+00:00

Hi

I took the posted code, pasted it into Ultraedit, saved it as a html file, marked the whole file (Ctrl+A), chose Format->ReIndent Selection, and voila, the code was indented just as you requested.

paulkdeuter · Aug 02, 2009#52009-08-02T18:52+00:00

Hi,
I am still having trouble with html formatting. Neither reformat paragraph or reindent selection seem to do what I want. My request is the same as the original post: simple html formatting where tags at the same nest level are started on separate lines and have the same indentation.
Suppose you started with totally unformatted html: <div id="n11"><div id="n21"><div id="n31"></div></div><div id="n22"></div></div>
What are all the steps necessary to have UE format it as:

Code: Select all

<div id="n11">
    <div id="n21">
        <div id="n31">
        </div>
    </div>
    <div id="n22">
    </div>
</div>

Btw: I just noticed a new command called "XML Convert to CRLFs" which does what I want perfectly! But this command is grayed out unless the file has the extension ".xml" ... boo!

How about enabling that command for .htm, .html, .xhtml files and also for new windows where the text is not saved at all yet. I am asking for this because xml/html formatting is often the first step of troubleshooting problematic html that was cut/pasted from another source in a new window. I am not interested in saving this text at all, but rather just formatting it so that I can read it.

-Paul Deuter

Mofi · Aug 03, 2009#62009-08-03T05:03+00:00

Command "XML Convert to CRLFs" is mainly for XML, but works also for XHTML. You don't need to change the file extension to use it for XHTML. You just have to select the XML syntax highlighting language at View - View As (Highlighting File Type) for your file.

However, for HTML there is usually a better tool than "XML Convert to CRLFs", Format - HTML Validation - Run HTML Tidy. HTML Tidy is a tool to check a HTML file for errors and can also output a well formatted version of a HTML file. You just have to configure the HTML Tidy options to what you like. Read the HTML Tidy manual for details about the options.

The ReIndent Selection command of UltraEdit makes on HTML and XHTML files a better job when using instead of

Code: Select all

/Indent Strings = "<"
/Unindent Strings = "</"

in the wordfile following:

Code: Select all

/Indent Strings = "<blockquote>" "<blockquote" "<body>" "<body" "<colgroup>" "<colgroup" "<dd>" "<dd" "<dir>" "<dir" "<div>" "<div" "<dl>" "<dl" "<dt>" "<dt" "<fieldset>" "<fieldset" "<form" "<frameset" "<head>" "<iframe" "<li>" "<li" "<map" "<menu>" "<menu" "<noframes>" "<noscript>" "<ol>" "<ol" "<optgroup" "<script>" "<script" "<select" "<style>" "<style" "<table>" "<table" "<tbody>" "<td>" "<td" "<tfoot>" "<th>" "<th" "<thead" "<tr>" "<tr" "<ul>" "<ul"
/Unindent Strings = "</blockquote>" "</body>" "</colgroup>" "</dd>" "</dir>" "</div>" "</dl>" "</dt>" "</fieldset>" "</form>" "</frameset>" "</head>" "</iframe>" "</li>" "</map>" "</menu>" "</noframes>" "</noscript>" "</ol>" "</optgroup>" "</script>" "</select>" "</style>" "</table>" "</tbody>" "</td>" "</tfoot>" "</th>" "</thead>" "</tr>" "</ul>"

But please note that the ReIndent Selection command does not insert line breaks. And this command does not recognize multiple unindent strings on the same line which is a problem for example on a line containing </td></tr> but the matching start tags <tr> and <td> are not on same line, too.