HTML-X is a text-based program (runs under the Terminal program) designed to make maintaining a web site easier and more productive. HTML-X allows you to eliminate the redundancy that can be found in many web sites. For example, if your site has the same basic format on every page, you can change every page at once using HTML-X. In this way, HTML-X is to HTML as styles are to Adobe PageMaker. If you like designing web pages with text editors and don't like wasting time, HTML-X is for you!
First, if you have not already done so, you must install HTML-X. Be sure to put HTML-X in a folder where it is easy to find. If you need instructions on how to do that, HTML-X is not for you.
Open up StyledEdit and type (or copy and paste) the following:
header { start [<HTML> <HEAD><TITLE><|VAR NAME="title"></TITLE> </HEAD> <BODY BGCOLOR="#FFFFFF" TEXT="#000000"> <CENTER><H1><|VAR NAME="title"></H1></CENTER>] end [</BODY> </HTML>] }Now save the file as "styles.def" in the same folder as the "htmlx" program. Next, start a new document in StyledEdit and type (or copy and paste) the following:
<|HTMLX SRC="styles.def" TITLE="My Page"> <|STYLE NAME="header"> </|STYLE NAME="header">Now, save that file as "mypage.htx" in the same folder as "styles.def" and the "htmlx" program. Next, open up the Terminal program, change to the HTML-X folder, then type "htmlx mypage.htx mypage.html". Now double click on the "mypage.html" file in the HTML-X folder. NetPositive should load and something similar to the picture below should appear:
If what you get doesn't look like the above, make sure that you type (or copy) the files exactly as they are above. Since that the Be File System is case sensitive, you must be sure that the file names in HTML-X are in the right case.
Assuming that you have HTML-X working, lets discuss exactly what went on in the tutorial. The file "styles.def" acted as the definition file. Basically, it stores the HTML information for the HTML-X commands. The HTML-X commands used in this example where: <|style name="header">, </|style name="header">, <|var name="title"> and <|htmlx src="styles.def" title="My Page">. You might be saying to yourself "great, but what do they mean?" Well, I'll explain.
The <|htmlx src="styles.def" title="My Page"> command tells HTML-X that the default definition file is "styles.def" and that the variable title equals "My Page". The <|htmlx> command (or tag) must be the first thing in an HTML-X file because it declares the default definition file.
The <|style name="header"> tag (or command) opens the default definition file, in this case "styles.def", and gets the information located in the start position of the block named "header". In english: all of the stuff between the [ and the ] below the "start", below the "header", in the file "styles.def" is placed in the output file. Read the above again, but this time, compare the styles.def, mypage.htx, and mypage.html files to see how it works. Wondering about the <VAR NAME="title"> tag? I'll get to that in a minute.
The </|style name="header"> tag is basically the same as the <|style name="header">, but this one grabs the information from the "end" section of the "header" block in the definition file "styles.def"
The <VAR NAME="title"> tag is really quite simple. It prints whatever title is equal to in the <|htmlx> tag. In this case, it prints "My Page". VAR is an abreviation for variable.
There it is! You have made it past the tutorial! Hopefully, everything is more or less clear. If not, don't worry, I'll try to improve the documentation as I go along. Also, if you have a question, feel free to e-mail me at numlumps@hotmail.com
* Don't use spaces or \ (backslashes) in block and chunk names
* Don't forget to close all chunks with ] and all blocks with }
* To include the [ ] { } characters in a chunk ALWAYS put a \ in front (i.e. \[)
* To include a backslash (\) in a chunk type \\
* Don't forget that files in the BeOS are case sensitive
* Don't forget to close your " " (quotes)
* Don't use any files over 30,000 bytes with HTML-X; In the future, I will try to remove this limit
* You can use styles inside of styles, but, be careful, or you will create an infinite loop!
* By adding the SRC="" parameter to a STYLE tag, you can use multiple definition files per
HTML-X file
* Print the current date with the <|DATE> tag (see the Commands.html file for details)
* Print the current time with the <|TIME> tag (see the Commands.html file for details)
* Declare variables local to styles by adding the parameter varnamehere="" to the styles tag
* HTML-X has the capability for random and "time-sensitive" styles although they aren't
very useful in the BeOS version (yet)
If you have any questions or comments about HTML-X, e-mail me at numlumps@hotmail.com.
The HTML-X web page is located at
http://www.geocities.com/Athens/Parthenon/1774/htmlx.htm
Be sure to stay in touch.