Another benefit of the new integrated HTML web page viewer in JWM is that you can browse a web page (or any text document) whilst you have another document open in the wordprocessor. This allows you to have a English text file open whilst you translate it into Japanese, for example. Of course, in the JWM browser you can also Command-click any character to get detailed character information.
Important notes:
Inserting tags into your document
The HTML web page editor in JWM is very similar to BBEdit 5.0 - most of the tag dialogs are identical, so you will be right at home if you are a BBEdit user. It is assumed that you have a working knowledge of how HTML web pages are created. If not, rest assured that HTML is generally very simple and quickly learned. This mini-tutorial will help you use some very simple HTML features to give you an idea of how it works.
Note: you will be able to edit your HTML text using the wordprocessor and view it with the HTML viewer whilst the help system displays this help page. If you close this help page accidently, you can bring it up again by selecting Help contents via the Info menu and navigating to it.
Start by opening a new text document by selecting Standard HTML page from the New submenu of the Text menu (you might like to call the document test) - this will bring up the Text dialog (shown in Figure 1 below). You will notice a range of buttons at the top of the dialog. If you move the mouse pointer across these buttons, a description of what each button does will be displayed.
The Mini-button bar allows you to enter a range of the most often used HTML tags quickly and conveniently. Each of these mini buttons also has an equivalent speedkey (displayed in it's description), which vastly speeds up your entry of HTML tags. For example, pressing Control-B (ie. holding down the Control key and pressing B) inserts the <B></B> tags into your document.
Setting character styles and colors
Select Bold from the Character style button (or press Control-B), and the switch on and switch off tags for bold type will be inserted into your document, leaving the cursor in the centre of the tags. Now type in some text between these switch on and switch off tags. Press the View document in browser button (on the top right of the Text dialog), and you will see your page displayed in the browser, with the text you entered in bold. That was pretty easy, wasn't it?
Now, to have normal text displayed, type it outside the bold tags. You will see it come up as normal text when you look at it with the browser. You might like to try putting in some italic and underlined text in the same way. Of course, you can copy and paste text to move around the HTML tags so they are in the right place. To put in colored text, select Font... from the Character style button and the Font tag dialog will be displayed (shown in Figure 2). Use the popup menu next to the Color checkbox to select the color you would like your text. Then press Apply to insert the tag.
Inserting pictures and sounds
Now, let's do something more adventurous - inserting a picture and a sound. To do this, place the cursor where you want the picture to be placed, and select Image... from the Miscellanous button. The dialog shown in Figure 3 will be displayed. Now press the File... button and select the sample image called 'sample.pct' (in the Japanese WordMage folder). Then press Apply. You will see the tag for an image (picture) placed in your HTML text. Now press the View document in browser button to see your picture inserted in your HTML document.
This should give you an idea of how easy it is to produce multimedia HTML web pages with JWM by embedding pictures and sounds in them. Of course, you can add your own pictures and sounds to a HTML web page as well. Just record a sound (such as some Japanese pronunciation) on your computer and save it as an .aif (ie. AIFF) file so JWM can read it (it must be saved as an 8-bit mono uncompressed AIFF to be compatible). Also, any pictures you want to include should be in .pct (ie. PICT) format, otherwise JWM won't be able to read them. Pictures can be converted from various there formats into PICT format using shareware packages such as Graphic Converter (on the MacOS) and Paint Shop Pro (on Windows 95/98/NT).
Horizontal rules
You can also separate sections of text using a Horizontal rule - this HTML tag simply draws a line across the page. To insert a horizontal rule, select Horizontal rule... from the Miscellanous button, and the dialog shown in Figure 4 will be displayed. Press the Apply button to insert the HTML tag.
To insert a link in your HTML web page document, you first need to have a new HTML web page to link to. Create a new page now and store it in the Japanese WordMage folder. Now go back to your original HTML web page document and select Link/Target... using the Miscellanous button. The dialog shown in Figure 5 will be displayed. Now press the File... button and select the new HTML web page you just created. Then press Apply. When you load up your original HTML web page in the browser, you should now see a link to the new page you created. As you move the mouse pointer across it, you should see the name of the document shown in the bottom left size of the browser. Click the link and the new page should load up. Use the Forward and Back buttons on the browser to move between these recent pages.
To make a more complex unordered list (like the example above), you need to embed a second unordered list within the first. When the HTML web page is viewed, the second list will be further indented to the right. You can embed up to three levels of indentation in this way. The HTML source for the example above is shown in Figure 6 - it looks a bit complex on first viewing, but once you examine how it works it's not too bad. Lists of this type are fairly complex compared to most other HTML tags, since they are harder to visualize. A bit of experimentation, however, should ensure that you get the result you want. For example, the New line break in the middle of the HTML source ensures that the embedded list item following it is spaced correctly.
How to boil a three-minute egg
Further information
For more information about HTML coding (including in-depth tutorials), please refer to the many books on this subject available from bookstores.
A complete HTML 3.2 reference guide is contained in the 'HTML 3.2 reference' folder bundled with this software. The main page of this guide is 'HTML 3.2 reference.html', which can be opened with Netscape Navigator or Internet Explorer.