HTML2JS
(HTML to JavaScript)
by Dieter "Belushi" Rausch, Berlin, (c) 2001-2002
**********************************************************************
Many people visiting my page did not understand the purpose of HTML2JS.
So, this file gives a closer look at what HTML2JS does.
THE PROBLEM:
**********************************************************************
- Your site is NOT database driven but based on plain HTML.
(Most private homepages are!)
- You have some HTML-code that has to be inserted on multiple pages;
for example a menu (could be a banner or anything else, too!).
- You don't want to (or can't) use frames for fixed menus
- When you update your site (adding/removing a new page) you usually
have to edit all pages manually that include that menu.
Now, that's stupid and boring!
Wouldn't it be great to siply save the menu "as is" into a separate file
and "link" it to the corresponding pages, so that (in case of any changes)
all you have to edit is that single, separately saved file instead of ALL
pages??
Well, plain HTML does not give you the chance to do that.
But - JavaScript does!!
THE SOLUTION:
**********************************************************************
With the introduction of the "SRC=" attribute you CAN save your script
into a separate file and insert the code into as many pages as you like.
Any changes to the JavaScript will instantly be active on all pages the
code is "linked" to via the "SRC=" attribute, so any changes can be made
by editing a SINGLE file instead of some dozens!
You don't like to code your menu in JavaScript, or you don't know JS at
all? Now, THAT is the point were HTML2JS comes into play!
THE EXAMPLE:
**********************************************************************
Step 1:
Create your menu using simple HTML commands.
Of course, if you like to, you can use complicated HTML commands, too :-)
You may use / headers and footers for testing purposes, but
they must be removed before proceeding to step 2!!!
OK, that's our example menu:
Grab the code between and and save it
to a new file "menu.html". Note, the file extension MUST be ".HTM" or
".HTML" - this one is mandatory!!
Step 2:
Launch HTML2JS and "Select" (Button!) the file you just created in the
"File open" window, then hit the "Go" button.
A file named "menu.js" will be created next to "menu.html" that looks like
this:
document.writeln('
');
If you know JavaScript, you can see what happened to your HTML code.
If you don't know JS, just ignore it - you don't need to know what it means.
Step3:
Open your TARGET files for editing. Your TARGET files are the final HTML
pages where you want the menu to appear! In our example, there would be three
target pages named "page1.html", "page2.html" and "page3.html".
You want the menu to appear on top of the pages, so the HTML code would look
something like this (a VERY simple example - the only part of interest is the
"MENU LINK CODE" !):
Hello world!
Note1: This example assumes that the three HTML pages and the script
"menu.js" are in the same folder! If they are not, you have to add the path
to your script-file inside the "src=" attribute.
Note2: To see that your menu has any effect, you should use different text
for "Hello world!" on the three pages!
OK, now run MSIE or Netscape or whatever browser you use and open any of the
pages: Voila - your menu is there and you can use it to "switch" between all
three of them.
THE BIG QUESTION NOW IS - what have we reached with that??
That's simple.
Say, you add a fourth page to your site named "page4.html".
All you have to do (besides creating the new page, of course :) is to add the
corresponding link to "menu.html" and run HTML2JS again. Done!
The new link will be visible on ALL FOUR pages instantly without touching any
of the pages themself!! That means, your menu has been updated on FOUR pages
by only editing ONE file instead of four!
Tell me, how many pages does YOUR site have? 10? 20??? Some dozens?!?!?
And NOW tell me how much time it would have needed you to update the menu on
all of them MANUALLY!!!!!!
Well - I think you now understood what HTML2JS is good for :-)
Greetings!
Dieter "Belushi" Rausch