FEATURES

MINI TUTORIAL

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 index via the Windows menu and navigating to it.

Start by opening a new text document by selecting New... from the Text menu. You might like to call it test.htm. In this demo version of JWM, you can't actually save text documents, but you can still work through this simple tutorial and try out a few things.

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. Go to the Header tag/Template input button and select Header.... Put in a title for your document and press Apply (there is no need to use any other areas of the header dialog for this simple example). You will see the HTML header tags generated by JWM, with the cursor ready for your next input in the BODY area of the text - you enter all your subsequent text in this area.

You will notice that there are various tags (ie. any text enclosed by the 'less than' and 'greater than' symbols is a tag - these symbols are above the comma and period keys on your keyboard) in the header. You can safely ignore these for now, if you don't know what they are used for. HTML generally works by using one tag to switch on something (eg. like a text style, such as bold), and another to switch it off again. Other tags are used to insert pictures and sounds, and generally there is only one tag for these types of operations.

Select Bold from the Character tag input button, 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 Look 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 your tags so they are in the right place.

The Insert tag input button allows you to insert paragraphs and new line breaks. These simply act like carraige returns, allowing you to format your HTML text so that paragraphs are properly separated. New line breaks insert a single carraige return, and paragraphs insert two carraige returns. Note that in the HTML standard, only the tags have relevance when formatting text - it doesn't really matter where you insert white space (ie. carraige returns and spaces), though you need to make sure tags stay in one piece.

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 Insert tag input button. 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 Look button to see your picture inserted in your HTML document.

Do the same thing with a sound: select Sound... from the Insert tag input button. Now press the File... button and select the sample sound called 'sample.aif' (in the Japanese WordMage folder). Then press Apply. You will see the tag for a sound placed in your HTML text. Now press the Look button to see your sound inserted in your HTML document - press the play button to listen to it.

This should give you an idea of how easy it is to produce multi-lingual HTML web pages with JWM, and embed pictures and sounds in them. There are a range of other tags available (including links, text formatting, etc.) - you might like to see what these do. Of course, you can add your own pictures and sounds as well. Just record a sound (such as some Japanese pronunciation) on your computer and save it as an .aif format file so JWM can read it. Also, any pictures you want to include should be in .pct (ie. PICT) format, otherwise JWM won't be able to read them.

For more information about HTML coding (including in-depth tutorials), please refer to the many books on this subject available from bookstores.