Copyright: 1999 HTMl Helper


Welcome
Welcome to Webmaster Help

 Welcome to HTML Webmaster Help.

If need general help in using Webmaster, please see the 5 minute walkthrough.

Additionaly you may find the answer to your question in the Sections Guide, or the How To section.

You can keep this help file "ontop" of other programs by selecting "options" from the Options menu of this help file, and switching "Keep Help on Top" to "On Top".

Visit us on the web at: http://www.html-helper.com


Sections

The following sections are available in this help file:

How To

Walk through

Page Wizard

Frames Wizard

Spell Checking

Browser Preview

Browser Preferences

Page / Source View

Color Coding

Font Formating

Code Helper

Hot Keys

Auto Save

Page Properties

Form Tools

Tool Box

Active Channel Setup

Quick Picture Wizard

Background Sound Wizard

Table Wizard

Quick Link Wizard

Quick E-Mail Link Wizard

Java Script Insertion

Java Script Editor

Web Templates

Note on Java Scripts

About

Helpful Web Links

http://www.html-helper.com	Our site

http://www.htmlgoodies.com	Beginner HTML

http://www.javagoodies.com	Beginner Java Script

http://www.webcoder.com	Dynamic HTML / Java

http://webreview.com	General Info


How To

In this section we will answer some common questions about using HTML Webmaster and writing HTML.

I want to add a ...

Picture

Link

Email Link

Form

Java Script

Background Sound

Table

Downloadable File

How do I ....

Spell Check my page

Change the Web Browser that "Browser Preview" Uses

Edit a Java Script

Replace some thing that is in my page

Make a Frames page

Change my Page's Colors after it has been made

Edit the entries in my Code Helper


awav
Click the Background Sound Wizard Button on the tool bar.


apic
On the tool bar click the Quick Picture Wizard Button


atable
Click the Quick Table Wizard Button on the tool bar.


alink
Click the Quick Link Wizard Button on the tool bar


Walk through

In this section, we will walk you through the basic steps of making a web page with HTML Webmaster.

Step one.

Make sure you have Webmaster started and ready.

Step two.

Click the New Page Button

When you click the New Page Button, the Page Wizard will appear.

Make any changes to the Meta tags you wish, then on the Page Wizard window, click the second tab named "Color Scheme".

Change the colors of the page by selecting and option on the right, and then selecting the color on the left, in one of the two color boxes.

When you are done, press the "Save" Button to save this as a Web Template.

Once you have saved it as a template, then click the "Make It" Button.

Depending on what colors and background picture you chose, the HTML code that is placed into Web Master should look like the following...

------------------------------------------------------------------

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">

<HTML>

<HEAD><TITLE>My Page</TITLE>

<META NAME="keywords" CONTENT="my page, about, me">

<META NAME="description" CONTENT="Great Page, Come See">

<META NAME="generator" CONTENT="HTML Webmaster">

<META NAME="author" CONTENT="Your Name">

<META NAME="copyright" CONTENT="Date, Author, Company">

<META NAME="resource-type" CONTENT="document">

<META NAME="revisit-after" CONTENT="30 days">

<META NAME="classification" CONTENT="Internet">

<META NAME="distribution" CONTENT="Global">

<META NAME="rating" CONTENT="General">

<META NAME="language" CONTENT="en-us">

<META NAME="Robots" CONTENT="ALL">

</HEAD>

<BODY BGCOLOR="#FFFFFF" Text="#000000" LINK="#0000FF" VLINK="#000099" ALINK="#00FF00">

<!--- BACKGROUND="image.jpg" --->

Content of page here.

Java Script also goes here when called for.

</BODY>

</HTML>

------------------------------------------------------------------

See the text above that is bright blue?

That is the contents of your web page.

In Web Master that text is the default color (black) not blue, in this tutorial it is blue to show you exactly what text we are talking about.

In Web Master, select that text and press the Back space button on your key board to delete it.

Step three.

Next we are going to add a Link (hyper link to another page), using the Quick Link Wizard.

Locate it's button on the tool bar and press it to open the Link Wizard.

Once the Quick Link Wizard is displayed, enter the following into each text box....

URL - 	http://www.yahoo.com

Display - 	Go to Yahoo

Mouse - 	Click Here to vistit Yahoo

Once you have entered the above into each box, click to "OK" button to have Web Master make your link.

The HTML Code that Web Master inserts into your page should look like the following.

<A HREF="http://www.yahoo.com" OnmouseOver="window.status='Click Here to vistit Yahoo'; return true" OnMouseOut="window.status=' '; return true">Go to Yahoo</A>

Step four.

Now we are going to see what our web page looks and acts like.

On the tool bar, find and click the Page / Source View button, to switch to Page View

Notice how the icon of that button changes to reflect if you are in page view, or source view.

Now your Web Page has a link to Yahoo in it, and clicking that link while in Page View will take you to Yahoo (if your connected to the internet).

When you are done looking at your web page, find and click the Page / Source View button again to go back to Source view

Step Five.

Our page is pretty plain, so we are going to spice it up a bit....

Postion your Cursor just under the link we just added.

On the tool bar find and click the Quick Picture Wizard Button.

After the Quick Picture Wizard pops up, select any picture you want, by using the file and directory navigator on the left hand side of the Quick Picture Wizard.

*Note if you need a picture, Web Master comes with pictures, they are located in the "Templates" sub-directory that Web Master was installed in.

The Quick Picture Wizard will scale the pictures to siz if they are too big to fit in the viewing area.

Once you have the picture you want, change the "Align" to "Center", and click the "Add" Button.

Notice that the Quick Picture Wizard stays open even after you have clicked the "Add" button?

That is so you can add alot of pictures at once, and change their position in the page by moving their HTML Tags.

Depending on the Picture you chose, Web Master inserts the following code:

<P ALIGN ="Center">

<IMG BORDER="0" SRC="addchan.gif" Height="20" Width ="138">

</P>

Repeat Step Four to see how your web page looks, and then come back to source view.

Step six.

Once you are back in source view, click the tab named "Code" on the left hand side of Web Master.

Once the code tab is displayed, you will see a listing of available code "helpers" that you can drag and drop right into your web page while it is in source view.

Scroll down until you see the code helper named "Hard Rule"

Click and hold down the mouse button on the "Hard Rule" entry.

Notice the Mouse Cursor changes to a little hand holding a box?

And look at where the tool bar was....now there is an area that displays

"<HR>"

While still holding down the mouse button, drag the mouse over your web page.

Notice that the Caret (insertion point) in the edit area follows the mouse?

Move the mouse so that that Caret is just above the image we just placed in our page.

Release the mouse button, and notice two things...

1. The tool bar is back to normal.

2. Where you released the mouse button is now the code for the Hard Rule (<HR>).

You have now mastered the basic skills needed to operate HTML Webmaster.

Thats all there is to it...90% of your editing can be done by using the features located on the tool bar.

For additional Help on making web pages, please see the HTML Reference, located in the "Help" menu of HTML Webmaster.


aemail
Click the Quick E-Mail Link Wizard Button on the tool bar.


adown
Click the "Download file" under the "Insert" Menu.


aspell
Click the Spell Cheking Button on the tool bar.


acbrow
Select "Browser Preferences" under the "Options" Menu.


areplace
Select "Find and Replace" under the "Edit" menu.


aform
Use the Form Tools - located under the tools menu.


aframe
Click the Quick Frame Wizard Button on the tool bar.


ajava
Click the Java Button on the tool bar, and select "Insert Script" from the menu that pops up.


ajav2
Click the Java Button on the tool bar, and select "Edit Script" from the menu that pops up.


About

HTML Webmaster

Copyright 1999 - HTML Helper

Bryan Cairns

All rights reserved.

Visit us on the web at: http://www.html-helper.com


accolor
Select "Page Properties" under the "Tools" menu.


acodhh
Select "Code Helper" under the edit menu, then click the "Edit" button on the Code Helper Options window.


Page Wizard

Page Wizard alows you to quickly and easily create a basic web page. There are two tabs on the Page Wizard, Meta Tags and Color Scheme.

Simply fill in the information for the Meta Tags, on the Meta Tags tab.

Then choose your pages colors and background picture (if desired), on the Color Scheme tab.

Once you have finished the above steps, you can click the "Save" button, to save all of this information as a Web Template, for later use.

To open a Web Template, simply click the "Open" button, and then select the Web Template of your choice.


Meta Tags

Meta Tags may look confusing, but they are actualy very simple to understand. Search Engines on the internet use Meta Tags to catagorize and gain information about your web site.

Below is a list of all the Meta Tags that Web Master puts into your page, followed by a brief explaination of each one.

<META NAME="keywords" CONTENT="my page, about, me">

Keywords are thing that people will type into a search engine to find your page.

<META NAME="description" CONTENT="Great Page, Come See">

Description is a brief explanation of your site.

<META NAME="generator" CONTENT="HTML Webmaster">

Generator is the program used to make the web page with.

<META NAME="author" CONTENT="Your Name">

Author is the name of the person that created the web page.

<META NAME="copyright" CONTENT="Date, Author, Company">

Copyright is the copyright information for your page.

<META NAME="resource-type" CONTENT="document">

Resource-type basicaly tells the search engine that this is in fact a web page.

<META NAME="revisit-after" CONTENT="30 days">

Revisit-after tells the search engine to come back and re-read your site after a certain amount of time.

<META NAME="classification" CONTENT="Internet">

Classification - is this a web page or a network page?

<META NAME="distribution" CONTENT="Global">

Distribution - do you want your page to be available for every one or just a specific country?

<META NAME="rating" CONTENT="General">

Rating - is this an Business, Adult Site, or General site?

<META NAME="language" CONTENT="en-us">

Language - what language is this page written in?

<META NAME="Robots" CONTENT="ALL">

Robots  are programs that search engines use to read your web site and determine were in their database it goes.


Color Scheme

A color scheme is the way your page looks.

Below is a list of color commands your page uses and what they do.

All color commands use a Hex Value to determine the exact color.

BGCOLOR=

This is the color of the page's background.

BACKGROUND=

This is the picture used as a background - similar to your desk top background.

Text=

This is the color of the text in the web page.

LINK=

This is the color of any links in the web page.

Links "Link" one web page to another.

VLINK=

This is the color of any links one the web page that have been visited.

ALINK=

This is the color of a link while it is being visited.


Web Templates

A Web Template is a file that Webmaster uses to save web page properties such as, Meta Tags, Colors, and background pictures.

Once you change all the Meta Tags, Colors, and the background picture in the Page Wizard, you can save all of that information in a Web Template and open that Web Template in the future so that you do not have to re-create it all.

Web Template File Format-

The following information is for developers, or if you want to distribute your Web Template to friends or co-workers.

A Web Template is a Simple Text file that can be edited visualy by using the Page Wizard, or any text editor.

The basic layout of a Web Template is as follows:

Text in grey is a comment about the section.

<1>My Page<2> 	Meta Tag - Page Title

<3>Great Page, Come See<4> 	Meta Tag - Page Title

<5>my page, about, me<6> 	Meta Tag - Page Description

<7>Your Name<8> 	Meta Tag - Page Author

<9>Date, Author, Company<10> 	Meta Tag - Page Copyright

<11>#383C68<12> 	Color - Background

<13>#B8E4F8<14> 	Color - Text

<15>#00FFFF<16> 	Color - Link

<17>#00C0C0<18> 	Color - Visited Link

<19>#C0FFFF<20> 	Color - Active Link

<21>app.pic\picname.jpg<22> 	Background Picture

*See the listing between <21> and <22>?

The phrase app.pic\ is used in pre-created Web Templates (the ones that came with Webmaster), when you save a Web Template, app.pic\ will be replaced with the directory location of the picture on your hard drive.

App.pic\ is a command phrase for Webmaster, telling it that the picture resides in the same directory as the Web Template file.

If you plan on distributing your Web Template, please edit your Web Template with MS Note pad (or any text editor) and change the directory name to app.pic\ that way when the person you give it to opens it in Webmaster, the picture will be displayed. This is nessasary due to the fact that the local directory you use may differ from the persons you give your Web Template to.

By using app.pic\ the picture will display correctly so long as the picture and the Web Template are in the same directory.

Example

Below is a sample of what Background Picture section (between <21> and <22>) before editing and after editing. For this example the picture's name is Test.jpg, in a directory c:\backups\websites\mysite\

Before

<21>c:\backups\websites\mysite\Test.jpg<22>

After

<21>app.pic\Test.jpg<22>

Now when you ditribute your Web Template, so long as the picture and the Web Template are in the same directory, the picture will display correctly.

Note that if you wish to distribute your Web Template(s) through our web site, please make sure that they do not break any copy right laws, and email us.


Hex Value

A Hex Value is a 6 digit code with a "#" before it, that repersents a color.

Webmaster automaticaly generates this value based on the color you select.


Quick Frames Wizard

The Quick Frames Wizard allows you to quickly and easily create rather complex frame pages.

Webmaster offers nine frames to choose from, each one is depicted by a graphical representation.

Also if the "automaticaly generate pages" is selected then Webmaster is create all pages needed for your frames to work correctly.


Spell Checking

Spell Checking your Web Pages ensures that there will be no miss-spelled words in your web page.

There are three ways you can Spell Check your web page.

While spell checking your web page, Spell Checker will highlight the text that it is currently checking.

Whole Document

This will spell check the entire page, if you have any html tags in the page, spell checker will tell you that the html tag is a miss spelled word. Use this option if you are creating a plain text file.

Non HTML Tags

This option will tell spell checker to only check text that is not in an html tag.

Example:

Text in red will not be checked, while green text will.

<a href="link.html">This will get checked</a>This Will get checked<!--- This will not get checked --->

Select and Right Click

If you only want to spell check a certain block of text, in Webmaster select the text you want to be checkd, than right click on the selected text and select "Check Spelling".

If you have any html tags in the selected text, spell checker will tell you that the html tag is a miss spelled word.


Browser Preview

By choosing Browser Preview, the page you are currently working on will be displayed in your default web browser.

To change the web browser that Webmaster uses, please see Browser Preferences.


Page / Source View

Page view allows you to quickly see what your web page will look like, with out ever having to save your work. Page view uses a standard MS Internet Explorer Interface.

Source view is what you use to work on your web page.


Color Coding

Color Coding allows your page's html tags to be colored in a color you specify.

Coloring Schemes:

Due to the fact that coloring hundreds of lines of html code takes time, we have designed Webmaster to use three different Coloring Schemes.

None:

Speed - Very Fast

Colors the entire contents of the page with the default color specified by MS Windows.

Basic:

Speed - Average

Colors only HTML Tags and Java Scripts.

Advanced:

Speed - Slow

Colors HTML Tags, Java Scripts, Links, and Pictures.


Code Helper

Code Helper is a way of storing your most used HTML Tags or plain text for easy Drag and Drop into Webmaster.

To Use Code Helper:

In the main window of Webmaster, click the tab name "Code" on the left hand side of Webmaster.

Webmaster will list all entries that are in your Current Code Helper File.

To place one of the entries into your web page, simply drag and drop the entry into your web page.

Or when typing in Webmaster, when you type "<" the Code Helper Box will popup and display a listing of entries in your current Code Helper File. Once the Box has poped up, select the entry you want and press the enter key or double click to put the code into your web page.

If you do not want to insert any code from the code helper box, just keep typing as normal.

Options:

Code Helper File:

This is the file that Code Helper will use to get the code listings.

Click the Browse Button to change what file Code Helper uses.

You can also edit your Code Helper file by clicking the "Edit" Button.

Additionaly you can create a new Code Helper File by clicking the "New" button.

Size:

This will effect the size of the popup code helper box.

You can choose btween small, medium, and large.

Set Focus to Code Helper:

Select this option to have the programs focus switch to Code Helper popup box when it is displayed.

Use this if you do not want to have to click on the popup box every time it "pops up".

Use Code Helper:

Deselect this option if you do not want the code helper popup box to "pop up" when you are typing.

Note that you can still drag and drop your code from the "Code" tab in Webmaster.


Hot Keys

With Hot Keys, you can assign HTML Code or plain text to a specified key on the keyboard.

Web Master allows you to assign up to 12 keys, and and the text you enter into the text box just right of that Key listing, will be placed into your web page when you press that key.

Example:

Hot Keys has assigned the enter key with <BR> (an HTML hard return).

When you are using Hot keys and press the enter key, <BR> is placed at the edit line.


Browser Preferences

If you want to change the web browser that Webmaster uses to display web pages during Browser Preview, click the "Browse" button, and then select the Web Browser you wish to use.

If you want to change bacl to the system default web browser, simply click the "Reset" button.

*Please note this has only been tested with Netscape and IE.


Auto Save

Auto Save will save you web page with out asking you, providing you have saved it once before.


Page Properties

Page Properties allows you to quickly and easily change the Hex Values of your web page, along with the background picture.


Form Tools

Form tools allows you to quickly and easily add html form elements into a web page.


Tool Box

The Tool Box allows you to quickly and easily add commonly used Code into your page.


Font Formating

The Font Formating Dialog Box allows you to change the way the text on your page looks.

Options:

Font Face:

The name of the font used, if the person viewing your web page does not have that font installed, their web browser will display it as normal text.

Bold:

Sets the text to Bold.

Italic:

Sets the text to Italic.

Underline:

Underlines the text.

Color:

Sets the color of the text.

Size:

Sets the size of the text.


Active Channel Setup

Active Channel Setup allows you to quickly and easily add an active channel to your site.

Options:

Channel Address:

The Url the acm file will be located at.

Base Address:

The Url of your site.

Channel Title:

The name of the channel.

Description:

A brief decsription of the channel.

Update Interval:

How often should the channel update your subcribers?

Image:

A 16x16 picture.

Icon:

A 32x80 picture.

Wide:

A 32x194 picture.


Quick Picture Wizard

The Quick Picture Wizard allows you to quickly and easily add pictures to your web page.

Options:

Add:

Adds the picture to your web page.

If "copy to work dir" is checked, then the picture is copied to your current directory if it is not there already.

Add as Link:

Adds the picture to your web page as a Link.

If "copy to work dir" is checked, then the picture is copied to your current directory if it is not there already.

URL:

The Web Address used in "Add as Link".

Align:

Controls the alignment of your picture.

Left

Center

Right

Status:

The text you enter here is the text that will appear in the web browsers status bar when the mouse moves over the link.


Background Sound Wizard

The Background Sound Wizard allows you to quickly and easily add a Background Sound to your web pages.

Sound Files supported are

WAV Files	*.wav

MIDI Files         	*.mid

Options:

Add:

This will add the HTML Code specified by the Browser Encoding. And if "copy to work dir" is checked then Webmaster will copy the WAV or MIDI file to your current directory if it is not already there.

Play:

Plays the selected sound file.

Stop:

Stops the sound file if it is playing.

Browser Encoding:

Internet Explorer:

This option will add the HTML Code to play the sound in IE.

Netscape:

This option will add the HTML Code to play the sound in Netscape.

Both:

This option will add the HTML Code to play the sound in both IE and Netscape.


Table Wizard

The Table Wizard allows you to quickly and easily add complex Tables to yor web page.

Options on the Size Tab:

Table Size:

On the size grid, click once to begin sizing, and click again to stop sizing.

Border Size:

Controls how thick the cell borders are going to be.

Cell Padding:

Controls how much padding each cell has.

Cell Spacing:

Controls the spacing between cells.

Alignment:

Controls each cells alignment.

Font Size:

Controls the font size of any text in the cells.

Include Font Formatting:

Check this option to include font formatting information in the table.

Options on the Colors Tab:

Background:

Contols the background color of the table.

Border:

Controls the border color of the table.

Border Dark:

Controls the dark border color of the table.

Border Light:

Controls the light border color of the table.

Font Color:

Controls the font color in each cell.

Picture:

Click the Picture Button to add a background image to your table.


Quick Link Wizard

The Quick Link Wizard allows you to quickly and easily add complex links to other pages, sites, or files.

Options:

URL:

Type in a web address or press the down arrow on the combo box to select from a list of files in your current directory.

Display:

The text you enter here will be the text that the person viewing your web page will see.

Mouse:

The text you enter here is the text that will appear in the web browsers status bar when the mouse moves over the link.

Target:

The target command tells the web browser to load the link in a certain way.

None  	Do not include target info.

_BLANK 	Loads the page in a blank window.

_TOP 	Loads the page in the same window, will break out of a frames page.

OTHER	You can specify a target name.


Quick E-Mail Link Wizard

The Quick E-Mail Link Wizard allows you to quickly and easily add complex email links which will launch the users email program so that they can send you email.

Options:

Mail To:

The email address you type in here will be the one that people that click on the link will send mail to.

Display:

The text you enter here will be the text that the person viewing your web page will see.

Mouse:

The text you enter here is the text that will appear in the web browsers status bar when the mouse moves over the link.


Java Script Insertion

The Java Script Insertion tool allows you to quickly and easily add complex Java Scripts into your web page by simply selecting the script of your choice and clicking the "Insert" button.

The Java Script Files (JAV Files) that the Java Script Insertion Tool uses can be made and edited with the Java Script Editor.

Note on Java Scripts


Java Script Editor

The Java Script Editor allows you to quickly and easily create and edit JAV files for use with HTML Helper and HTML Webmaster.

Simply Type in or copy and paste the Java Code into the two text boxes and then give it a title.

Once you have completed that, you can then save your JAV File for later insertion into your web page via the Java Insertion Tool

Note on Java Scripts


Note on Java Scripts

All Java Scripts packaged with this program are belived to be public domain, if this is not the case, please email us, with valid proof that you are the original author of the Script and we will promptly remove it from future versions of this program.

If you are a Java Script Author, and wish to distribute your JAV files (royalty free) through our web site, please email us.