Introduction to AceHTML

AceHTML 6 has a user friendly interface. In fact, it has graphic toolbars that allow the user to create pages easily in a short time. Moreover, there is a set of tabs which organizes the tools by category to make it easy for the user to find his/her way through this impressive array of tools.

Refer to the What's New list in AceHTML 6.

Throughout your tour of AceHTML Help, you will find the following icons:

: for the Netscape browser; and

: for the Microsoft Internet Explorer browser.

When these icons are placed next to HTML commands they indicate that the commands are Netscape or Microsoft Internet Explorer extensions.

© 2004 Visicom Média inc.


What's new in AceHTML 6

  • Code Snippets Library

  • File Explorer

  • FTP connections integrated to File Explorer

  • Style sheet editing (CSS) with TopStyle

  • Improved spell-check function

  • Separate spell-check dictionaries

  • PHP code integrated to several functions: Code Completion, Code Tooltips and PHP Syntax Check

  • VB Syntax Check

  • Link Check, covering the Web site's entire tree.

  • ASP, .NET and PHP pages executed directly from the server.

A number of other changes to preferences and the interface.

Get a list of the updated features at this address: http://softwares.visicommedia.com/en/products/acehtml/.


System requirements

To install and use AceHTML you need the following minimum system requirements:

Minimum configuration:

  • IBM or compatible PC with a Pentium processor or more.

  • Windows 98, Me, 2000, XP, NT (SP5) or better.

  • 64 MB RAM (128 MB for Windows NT, 2000 or XP).

  • 30 Mo free space.


Getting help

To obtain help, you can refer to the AceHTML Editor. You will find answers to most of your main questions. As a registered user you can also get help from Technical Support.

AceHTML's Help Modules

AceHTML provides several help modules. Apart from the traditional help provided with the application, there are other tools available:

  • HTML Reference, a useful guide for those working directly in HTML code.

  • CSS Reference, a practical guide for the developer using style sheets.

  • SSI Reference, a helpful guide when programming using Server Side Includes.

  • JavaScript Reference, a useful guide for users who wish to integrate these types of scripts in their HTML documents.

  • What's this?, which allows you to obtain help concerning a particular option or selection box in a dialog box.

  • Tip of the Day, which displays a useful tip about using AceHTML at startup.

  • And, finally, Visicom on the Web, our main site which offers a continually updated list of available references and resources.

Access the OnLine Help

  1. Start the AceHTML program.

  2. Click on the Help menu.

  3. Select the item on which you want help.

At any point while you are working with AceHTML, click on the F1 shortcut to obtain help pertinent to the activity you are carrying out (Refer to list of shortcuts).

Get AceHTML's technical support

Contact our support service if you have any questions or encounter any problems using AceHTML:

When you purchase AceHTML, you can take advantage of technical support services through e-mail for one month from the date of purchase. Therefore, it's important to register as soon as possible.

To submit a question to technical support, go to the following address:
http://softwares.visicommedia.com/en/.

Only registered users can take advantage of our technical support. But before contacting our technical support service, please be you to read the section "Frequently Asked Questions".


Product updates

If you are registered in AceHTML's mailing list, you will be immediately advised of each product update. To register on our mailing list, go to the following address:
http://softwares.visicommedia.com/en/.

Other Help supports are also available to support web page developers in their design process.

To be kept informed of product update news:

Apart from the mailing list, AceHTML informs you of the software version status at the bottom of the About AceHTML display (also in the application's startup screen). You must be connected to the Internet.

When a more recent version is available on Visicom's Web site, the Download button will appear.

  • Click on the Download button to access the download page.
    You can also check out the download page directly from AceHTML by clicking on     Help | Visicom Media on the Web | Download Page.

To verify the update information on the About AceHTML window:

Visicom Media regularly updates AceHTML. Clients who have purchased the most recent version of AceHTML can obtain free updates.

Information on the version of the software you are using is displayed in AceHTML’s opening window on the lower border. If this information is not displayed, then the program was not properly installed.

  1. Click on Tools | General Preferences.

  2. Click on Environment | Other.

  3. Checkmark the box Check for the latest version on the Internet.

You also have access to information concerning the last update from the application itself.

  1. Make sure you are connected to the Internet.

  2. Click on the Help menu.

  3. Click on the Visicom Media on the Web option and then on Look for last version available.


License to use the product

PLEASE READ THE FOLLOWING ACEHTML END-USER LICENSE AGREEMENT CAREFULLY

YOU ARE GRANTED THE FOLLOWING LIMITED RIGHTS:

a. A non exclusive, non transferable right to use the shareware version of the AceHTML for evaluation purposes. This trial period allows you to run the software for an evaluation period of 30 days.

b. The right to distribute AceHTML in its shareware form to third parties provided the latter agree to accept the terms of this Agreement.

IT IS STRICTLY PROHIBITED TO:

a. Modify AceHTML in part or in its entirety.

b. Decompile or reverse engineer AceHTML.

c. Provide your registration number to third parties if you are a registered user.

SHOULD YOU FAIL TO COMPLY WITH ANY OF THE ABOVE, YOUR USER RIGHTS ARE AUTOMATICALLY TERMINATED. THIS TERMINATION WILL BE IN ADDITION TO ANY CRIMINAL, CIVIL OR OTHER REMEDIES WHICH VISICOM MEDIA INC. MAY SEEK.

LIMITED WARRANTY:

LIMITATION OF LIABILITY FOR INDIRECT DAMAGES. Visicom Media Inc. cannot be held responsible under any circumstances for damages of any character (including, but not limited to, direct or indirect damages resulting from the loss of business profits, business interruption, loss of business information, or other pecuniary loss) arising out of the use or inability to use this product.

This software is provided under license on an "AS IS" basis, without warranty of any kind, expressed or implied, including without limitation, implied warranties of merchantibility and fitness for a particular purpose. Visicom Media Inc. or any third party involved in the creation, production, or delivery of the program, cannot be held responsible under any circumstances, for any direct or indirect damage, including loss of profits, interruption of business activities, or other, faced by the user of this program, even in the case that Visicom Media Inc. has been advised of such damages.

The user assumes responsibility for the result or performance of the program. Visicom Media Inc. may, at any time, revoke this license by notifying the user of the software. The user may cancel his license to use the product by destroying or erasing all copies of the software.

This limited warranty will be governed and interpreted according to Canadian law.

PROPERTY:

The AceHTML trademark is a registered trademark and is protected by Canadian Laws on Trademarks and Intellectual Property. Use of the products name is strictly forbidden unless it is used with the express written permission of Visicom Media Inc.

AceHTML, including its code, documentation, appearance, structure, and organization is an exclusive product of Visicom Media Inc., who retains the property rights to the software, its copies, modifications, or merged parts.


Acknowledgments

We wish to thank all those who have helped to improve AceHTML through their comments, suggestions, and their reports of bugs.

AceHTML™ (1996-2004) development by Visicom Media inc

AceHTML On-line help

Complétif Inc.


How to register

You can register the software directly from the trial version. As soon as we receive payment we will send you a serial number via e-mail. When you enter the serial number the mention of "trial version" is removed and your registration is confirmed.

To find out different ways to register, visit us at the following address:
http://softwares.visicommedia.com/en/.

You can register AceHTML under the program’s Help menu.

Options available:

How to order AceHTML | Here you will find information on how to order the program.
Register AceHTML | Use this option to register your copy by entering your name and registration code.


Using the internal browser

AceHTML comes with two internal browsers for viewing HTML pages so that you need not use an external browser such as Netscape or Microsoft Internet Explorer. AceHTML’s internal browser is installed by default. This browser supports only basic HTML.

Alternatively you can use Microsoft Internet Explorer as your internal browser. In any case, to ensure good performance, it is necessary to have Microsoft Internet Explorer version 5.01 (or later) installed in your system. Youcan set Microsoft Internet Explorer Browser in General Preferences (menu Environnement | Internal Browser).

To download Microsoft Internet Explorer, visit: http://www.microsoft.com.


Display Internal Browser

The AceHTML Internal Browser lets you check your documents: layout, dynamic elements, etc. When the Internal Browser is displayed, the tab Viewer appears below the display, on the same bar as the Editor tab in the Edit Window.

  1. In the View menu, click on Display Internal Browser.
    You can also use the shortcut key F10. (See the list of shortcuts).
    A tab is displayed at the bottom of the Edit Window, for toggling from one mode to another. This command allows you to display AceHTML's internal browser in order to view your progress.

Using the internal browser

A button bar for accessing manipulation commands is displayed in the browser.

Refreshes the screen to reflect recent changes.

You can also select auto refresh viewer.

Lets you display the page preceding or following the one being viewed.

Lets you stop an upload to or visible animations in the internal browser.

Lets you open a document in the default browser window.

Lets you anchor the browser to the Edit Window so that it is always displayed.

The Local entry is displayed by default, signifying that the browser is displaying the current document. You can also enter a URL other than that of the current document (local or Internet).

Displays horizontal and vertical rulers on the internal browser window, letting you determine the positions of objects on the page.

Defines the URL of the primary server responsible for interpreting specific server codes.

Lets you simulate various environments, according to the screen resolution.

Displays the browser in full screen mode.

Docking the internal browser to the Edit Window:

  1. Display the internal browser.

  2. Click on the Dock Style button.

  3. Click on the desired docking mode.

Automatically refreshing the internal browser

You can set AceHTML so that the internal browser is automatically refreshed, thereby allowing you to view the most recent versions of your work.

  1. In the Tools menu, click on General Preferences.

  2. In the Environment menu, click on the link Internal Browser.

The right side of the window is refreshed.


Start Internal Browser

This command allows you to start the internal browser (the one included with AceHTML, and to refresh the results of your HTML document. If the internal browser is already open, this command will simply refresh the results of your HTML document.

AceHTML use Microsoft Internet Explorer (5.01 or later).

To start the internal browser:

  • In the Standard toolbar, select Start internal browser. You can also use a shortcut by pressing the following key: F12 (Refer to list of shortcuts).

If the internal browser is already open you can press the Refresh button to refresh the results of changes made to the HTML document. You can also indicate to auto refresh in your custom configuration.


External browsers

AceHTML allows you to select the default external browser used to view the results of the changes you make to an HTML document. The location of the external browser must be specified in AceHTML's General Preferences.

Microsoft Explorer | This option allows you to choose Microsoft Internet Explorer as your internal browser to visualize the progress of the Web page being edited: http://www.microsoft.com.
Netscape Navigator | This option allows you to choose Netscape as your internal browser to visualize the progress of the Web page being edited: http://browsers.netscape.com/browsers.
Other browser | This option allows you to choose another external browser to view the Web page you are editing.


Start External Browser

This command launches the external browser in order to view the results of your document in the browser you selected.

To start the external browser:

  • In the Standard toolbar, select Start External Browser. You can also use a shortcut by pressing the following keys: CTRL+F12 (Refer to list of shortcuts).

You can also use one of the following keyboard shortcuts:

  • SHIFT+CTRL+E: to use Internet Explorer,

  • SHIFT+CTRL+N: to use Netscape,

  • SHIFT+CTRL+A: to use another browser.

If you have not saved your document, AceHTML will instruct you to save it before starting the browser.

If no browser is running in the background, AceHTML will ask you to start it.

If the access path to the browser has not been identified or is incorrect, the General tab in General Preferences will appear. You can now locate the browser.

Press the [image] button, located to the right of the Start External Browser button, you have the option of selecting the external browser with which you want to display your document (Netscape or MS Explorer).


Customizing AceHTML's Desktop

Unless you have not enabled the Auto Save option for the desktop, AceHTML does not keep the changes you make to your work environment; that is, custom toolbars, display options, window arrangement, and all other customized parameters will be lost. You can always save them in order to use them during a new work session by saving your desktop.

AceHTML provides you with four predefined desktop configurations:

  • Default and Basic: displays the explorer window to the left of the edit window.

  • Docked: displays the explorer anchored to the edit window.

  • Full Screen: displays the edit window in full screen size.

  • Like AceHTML v3: embeds the explorer window to the left of the edit window (like the code's tree structure window in the previous version of the application).

  • Auto Save: determines the desktop automatic save mode. On start up, the application displays the desktop such as it was the last time it was closed.

This command is also useful to save several desktop configurations which correspond to the different tasks you have to perform

When you save your desktop, AceHTML keeps it in memory:

  1. the interface configuration determined in the General Preferences and the Editor Preferences,

  2. The window arrangement,

  3. The toolbar and menu bar configuration,

  4. The tabs bar configuration.

To save the desktop:

  1. Once the parameters have been established, from the View menu, select desktop.

  2. Click on the Save current desktop option. A dialog box appears.

  3. Enter a name for the configuration you want to save.

You can also use the Desktop toolbar:

  • Click on the Save current desktop button.

To delete the desktop:

  1. Display the desktop you want to delete.

  2. From the View menu, select Desktops.

  3. Click on the delete current desktop option.

You can also use the Desktop toolbar:

  • Click on the Delete current desktop button.

To display a desktop:

  1. From the View menu, select Desktops.

  2. Click on arrow on the Current desktop list.

  3. From the list, select th

You can also use the Desktop toolbar:

  • Roll down the Current desktop list.


Displaying and Configuring Toolbars

AceHTML has a Menu Bar and four Toolbars which allow quick access to the program's features.

Standard Menu Bar | The menu bar displays AceHTML's commands.
Standard toolbar | The Standard toolbar displays the file management icons.
Edition Toolbar | The Edition toolbar displays the document edit icons.
Project Toolbar | The Project toolbar displays the project management icons.
Desktop Toolbar | The DeskTop toolbar displays the AceHTML desktop customizing icons.
Vertical toolbar | The Vertical toolbar has several tools to facilitate the editing task. You can display or hide line numbers, bookmarks shown on margins and the code completion tool.
Tabs Toolbars | Bar with tabs placed at the top of the edit window by default. The tabs bar provides access to all the Web page editing commands.

"Intelligent " menus

AceHTML's menu bar provides access to the program's commands. Each menu can be updated in the user’s preferences, these are called "Intelligent " menus.

In certain menus, AceHTML only displays the most frequently used commands. When a "»" symbol appears at the bottom of the list, it means that there are other commands available in the menu.

To add a command to the menu:

  1. Click on the menu which has the "»" symbol at the bottom of the list.

  2. Slide the mouse over the "»" symbol.
    The name of a command which appears in a raised area indicates that this command belong to the menu by default.
    The name of a command which appears in a depressed area indicates that this command does not belong to the menu by default.

  3. From the complete menu, click on the name of the command you want to add to the menu.
    The command is executed. From this moment on, this command will appear on the menu when AceHTML considers that you need it.

Restore menus and tools to default settings:

  1. Click on arrow located on the extreme right of the menu bar.

  2. Click on the Add or Remove Buttons to display the list.

  3. Click on the Reset Toolbar option.

You can also use the Reset Toolbar command from the View | Toolbars menu to restore all toolbars.

To display or to hide a toolbar:

  1. From the View menu, click on the Toolbar option to display the list of available toolbars.

  2. Click on the toolbar you want to hide or display.

A check mark indicates that the toolbar in question is displayed.

To move a toolbar:

Each toolbar has a handle on its extreme left.

  1. With the left mouse button, click on the handle of the toolbar you want to move.

  2. Holding the left mouse button depressed, drag the toolbar to the desired location.

This procedure changes the toolbar from a fixed toolbar to a floating toolbar and vice versa. To return it to its original position, double click on the toolbar's title bar.

To add or delete buttons on a toolbar currently displayed:

  1. Click on the arrow on the extreme right of the toolbar you want to configure in order to display the drop-down list.

  2. Click on Add or Remove Buttons option in order to display the list.
    The list of available buttons for the selected toolbar is displayed. A check mark indicates that the button is currently displayed.

  3. To display a button, click on the corresponding command in order to display a check mark next to it.

  4. To hide a button, click on the command with a check mark in order to make it disappear.

To reset a toolbar:

Resetting a toolbar returns it to its original condition.

  1. Click on the arrow on the extreme right of the toolbar you want to configure in order to display the drop-down list.

  2. Click on Add or Remove Buttons option in order to display the list.

  3. Click on the Reset Toolbar option.


Customizing Toolbars

There are three ways of accessing the dialog box which allows you to configure the toolbars:

  • Customize option on the Toolbar command in the View menu

  • Customize option from the toolbar drop-down list. You can access this list from the small arrow located on the extreme right of each toolbar.

  • Customize option on the toolbar's context menu.

The Customize dialog box has four tabs which allow you to personalize the toolbars: Toolbars, Commands, Page and Options.

Toolbars tab

This tab allows you to select the toolbars which you want to display each time you start AceHTML. If there is a check mark next to the name of a toolbar it means that the toolbar is displayed. This command also gives you access to the toolbar editing commands.

New

Allows you to create a new toolbar. This option allows you to organize the commands you can access from a toolbar according to your work habits.

Rename

Allows you to change the name of a toolbar. This command is only available for a toolbar you created yourself.

  1. Click on the toolbar you want to rename.

  2. Click on the Rename button.

  3. In the Rename Bar dialog box, enter the new name for the toolbar.

Delete

Allows you to delete a toolbar permanently. This command is only available for a toolbar you created yourself.

  1. Click on the toolbar you want to rename.

  2. Click on the Delete button.

Reset

Resets the toolbar's original configuration. This option is only available for the program's toolbars: Menu, Standard, Edition, Project and Desktop.

Not floating

Prevents changing a toolbar into a floating toolbar.

Command tab

This tab provides access to AceHTML's edit commands which can be represented by a button (icon).

Pages tab

This tab provides access to the tabs bar customizing commands.

New

Allows you to create a new tab to be displayed on the tabs bar. This option allows you to organize the commands you can access from a toolbar according to your work habits.

Rename

Allows you to change the name of a toolbar. This command is only available for a toolbar you created yourself.

  1. Click on the toolbar you want to rename.

  2. Click on the Rename button.

  3. In the Insert categories dialog box, enter the new name for the toolbar.

Delete

Allows you to delete a toolbar permanently. This command is only available for a toolbar you created yourself.

  1. Click on the toolbar you want to rename.

  2. Click on the Delete button.

Up/Down

Allows you to reorganize the order in which the tabs are displayed.

Reset

Restores the toolbar's original configuration.

Options tab

This tab provides access to many toolbar customizing options.

Display recently used menus first | This option enables lists with the "»" symbol at the bottom of the menus. It allows you to display only those commands defined as most frequently used and, afterwards, those you add after using them. By default this option is enabled. If you disable it AceHTML will always display complete menus.
Display entire menu after a short delay | This option is only available if the previous option is enabled. It allows you to display the entire menu automatically after the short list has been displayed for a certain time. Displayed commands are identified by raised areas; hidden commands by depressed areas.
Reset data | This option returns the default configuration to the menu bars and the toolbars.
Large icons | This option allows you to change icons by making their images bigger.
Show Screen Tips on Toolbars | If enabled, this option displays on-screen description of toolbar buttons. This information is displayed when the pointer pauses over the button.
Show shortcut keys in screen tips | This option is only available if the previous option is enabled. If enabled, shortcut keys are displayed in creen tips.
Menu Animation | This drop-down list provides access to the different manners in which menus are displayed.

To create a toolbar:

  1. Click on the arrow on the extreme right of the toolbar you want to configure in order to display the drop-down list.

  2. Click on Add or Remove Buttons option in order to display the list.

  3. Click on the Customize tab.

  4. Display Toolbar tab.

  5. Click on the New File icon.

  6. A small dialog box is displayed. Enter the name that will identify the toolbar.

  7. Press OK.
    A new entry is added to the Toolbar list and a toolbar without buttons or contents appears next to the dialog box.

  8. Display the Commands tab.

  9. Add the desired icons and define their options.

You can use the context menu from the Add button to access other commands, such as changing the function's name.

To add buttons on a toolbar or in a menu command:

To add a button on a toolbar the Customize dialog box must be displayed.

  1. From the Commands tab, select a command to be added by clicking on it with the left mouse button.

  2. Hold the mouse button depressed as you drag the command to the desired location on the toolbar.
    You can add this command to a menu by sliding the button over the desired menu's name and placing it inside the list which is displayed.

To move or remove a button from the toolbar:

To move or remove a button on a toolbar the Customize dialog box must be displayed.

  1. Click on the icon corresponding to the command you want to move or remove.

  2. Slide the icon to the desired location. This location may be on the same toolbar or on another one.

  3. To delete a button, slide the icon outside all toolbars and menus.

You can move or remove a command on a menu in the same manner. To return to the original menu, execute the Reset command.


Configuring Tabs toolbar

This command allows you to configure the tab bar. You can create a new tab or add and remove buttons from a tab.

To add or remove a button from a tab bar:

  1. Display the tab you want to edit in the foreground.

  2. Click on the small arrow located on the extreme right of the tab you want to modify.

  3. The list of available buttons is displayed. Click on the desired button(s). When a check mark appears next to a command, it means that it is displayed in the selected tab.

  4. To access the more advanced toolbar options, go to the end of the list and click on the Customize… option

Only those buttons allowed on the tab being edited can be chosen.

To display or to hide a tabs bar:

  1. From the View menu, click on the Toolbars option
    or
    Click on the small arrow on the extreme right of the tab you want to edit and click on the Add or Remove Buttons command. Go to the end of the list and click on the Customize option.

  2. Click on the Pages tab. The AceHTML list of tabs is displayed.

  3. Click on the box to add or remove the check mark next to the desired tab.
    If there is a check mark next to the name of a tab bar it means that the toolbar is displayed; otherwise, it is hidden.

To create a new tab bar:

  1. From the View menu, click on the Toolbars option
    or
    the small arrow on the extreme right of the tab you want to edit and click on the Add or Remove Buttons command. Go to the end of the list and click on the Customize option.

  2. Click on the Pages tab.

  3. Click on New button.

  4. In the new page dialog box that appears, enter the name you want to appear on the bar's tab.

  5. Click on the OK button.

To add icons on the new tab bar, use the same add or remove a button on the tab bar procedure described previously.

To move the tab bar:

The tab bar has a handle on its extreme left.

  1. With the left mouse button, click on the handle of the toolbar you want to move.

  2. Holding the left mouse button depressed, drag the toolbar to the desired location.


Modifying the Interface Display

You can make display changes to a number of items in AceHTML.

Most of the tools can be displayed from the View menu.

  1. Click on the View menu to see the list.

  2. The list contains the items that can be displayed or hidden. A check next to an item indicates that it is displayed.

Display Code Explorer | Code Explorer is displayed as a tree, with nodes, links, sources (images or other), Applet Java codes (.class), and the HTML document's JavaScript and VBScript functions. Code Explorer is displayed in the Resources window. This option is activated by default.
Display Visual Explorer | Visual Explorer lets you view all of a document's hyperlinks. Visual Explorer is displayed in the Resources window. This option is activated by default.
Display Code Inspector | Code Inspector displays all of the properties and attributes that can be used for a given code (tag, rule, etc.). It also lets you modify these. Code Inspector is displayed in the Resources window. This option is activated by default.
File Explorer | The File Explorer lets you identify the link to FTP sites that will help you create Web pages. File Manager is displayed in the Resources window.
Code Snippets Library | The Code Snippets Library lets you create a personalized code list that you can insert in your document. Personal codes can be classified by category, programming language, etc. The Code Snippets Library is displayed in the Resources window. This option is activated by default.
Display Vertical toolbar | The vertical toolbar offers functionalities that can help you with editing tasks: display or hide line numbers or bookmarks in the margins, code highlighting tool, code completion tool.
Display Special | The Special Characters toolbar lets you quickly access special characters you may want to insert in the document you are editing (accented characters, symbols, etc.). When activated, it is displayed above the Edit window. This option is activated by default.
Display Internal Browser | The Internal Browser is integrated to AceHTML. It lets you view the progress made as you edit your Web pages. When this option is activated, a distinct window opens every time the application is run. This option is activated by default.
Auto refresh viewer | When activated, this option automatically refreshes the Web page you are editing so that you can see your progress as you work.

Other display options are available in General Preferences, in the Tools menu.

Show status bar | The status bar is displayed below the Edit window. It provides information on the status of the document: position in the Edit window, modifications done, etc. This option is activated by default.
Show margin toolbar | The margin toolbar lets you display line numbers, along with stars indicating where lines have been clipped. It is displayed to the left of the Editor window (gray zone).
Display vertical toolbar | The vertical toolbar offers functionalities that can help you with editing tasks: display or hide line numbers or bookmarks in the margins, code highlighting tool, code completion tool.


Standard toolbar

Create a New File

Open a File

The arrow allows you to open a recently edited file.

Save File

Save All Files

Close File

Close All Open Files

Show/Hide Project Manager

Check Online Links

Check Documents

Evaluate Documents

File Manager


Edit toolbar

Find

Extended Search and Replace

Cut

Copy

Paste

Undo

Redo

Indent Right

Start Spell Checking

Start Internal Browser

Start External Browser


Project toolbar

The Project toolbar is used to manage the open project.

  1. From the View menu, click on Toolbars. The Toolbar list is displayed.

  2. Click on Project to add a checkmark and display the Project toolbar.

The Project toolbar has the following options:

Add current file to project

Remove current file from project

New project

Open project

Save project

Save project to FTP

Open all project files

Close project


Encoding

Encoding is used to create complex HTML documents using several languages (ASP, XML, CSS). It improves coding of characters, which are then better interpreted (decoded) by servers.

Generally speaking, even if a standard HTML document is created with style sheets or scripts that refer to various coded languages, it will still be considered as "unicode". The North American standard is Arabic Windows-1256).

  1. In the View menu, click on Encoding.

  2. Select the desired code from the menu list.

You can also display the Encoding toolbar.


Font Toolbar

The Font toolbar lets you quickly change the font used for characters in the Edit Window.

Changing the font of characters via the Font toolbar does not affect the actual document being edited. The only change is to the Edit Window display.

Choice of character fonts.

Font size.


Vertical toolbar

The Vertical toolbar has several tools that makes editing your document easy: it contains tools to display or hide line numbering or bookmarks on the margin, a highlighting tool, or a code completion tool.

Display or hide the margin bar.

Display or hide the line numbers shown on the margin bar.

Display or hide hidden characters in the document. Line breaks or paragraph breaks are some of several hidden characters. These characters are useful during editing but are ignored by browsers ("br" or "p" tags).

Display line breaks on the margin bar.

With this tool you can highlight information on your edit window. Click on it to highlight text.

Details on using the highlight tool

Used to access design tools, to remove bookmarks and to move around in the edit window.

Details on bookmarks

This option activates the display of a tip concerning the tag you select in the edit window. The information displayed includes the attributes or properties that can be associated to the code being edited.

This tool is used to help you complete lines of code as you enter them.

Details on the code completion tool.

With this tool you can anchor all the displayed elements in one single window. If this option is disabled, the edit window and the viewer are displayed separately.


Common tab

External link

Internal Link

Insert an image

Insert a quick table

Font
The arrow provides access to predefined font sizes.

Headings Style
The arrow provides access to predefined heading styles.

Bold

Italic

Underline

Center

Align Left

Align Right

Justify

Paragraph
The arrow provides access to predefined alignments

Line Break
The arrow provides access to predefined alignments

Preformatted
The arrow provides access to predefined line widths.

Block Quotation

Comment

Font Color

Other formatting commands are also available from the Tabs menu, under the option Common:

Example <XMP>

SuperScript <SUP>

SubScript <SUB>

Blink <BLINK>

No Break Line <NOBR>


Images Tab

Image Browse

Insert an image

Image Map

Insert an Image with GOgraph


Specialized Tab

 | Document Meta Properties
 | External link
 | Internal Link
 | Horizontal Line
 | Embedded Module
 | Background Sound button
 | Active X
 | Insert Java Applet
 | Special Characters
 | Define a script
 | JavaScript Commands Summary
 | HTML Tags Summary
 | Insert ASP Command
 | Insert PHP Command
 | Insert WML Command
 | Document Body
Additional buttons
 | Existing External Destination
 | Marquee button
 | Spacer button


Table, Frames and Lists tab

 | Insert a table
 | Insert a cell
 | Insert a row
 | Insert a quick table
 | Insert frames
 | Ordered list
 | Unordered list
 | List definition
Additional button
 | Insert heading row


The forms tab

Forms definition

Check box

Radio button

List box

Combo box

Text box

Password box

Textarea box

Button

Reset button

Submit button

Form image

Hidden entry

File Attach


CSS tab (Style Sheets)

Edit document

Edit Links

Edit inline STYLE

Edit external file

Edit style properties using TopStyle

Edit inline style using TopStyle


Script tab

The scripts supplied with AceHTML were kindly supplied by Visicom Media Inc. and independent authors. According to agreements with the latter, you are free to use the scripts included in AceHTML in any of your HTML documents. However, the Notice on the Authors Rights that appear as comments in the scripts, must be preserved.

Each script follows the same creation procedure by using the Script Definition window. In this window scripts are classified by categories.

There are five categories:

Text effects

Dynamic effects that can be applied to text

Graphical Effects

Dynamic effects that can be applied to images

Tools

Tools that make Web pages more efficient. For example, you can add a calendar, a clock a button to print the page, etc.

Menus

Dynamic menus that help you surf the Web site

Mathematics

Tools that allow you to perform different mathematical operations such as amortization tables, calculation of interests, number of days, etc.


Custom Buttons

Custom buttons are helpful in situations where you want to insert a series of commands. For example, you might want to insert tags that make a piece of text both bold and italic at the same time. By assigning a custom button to such an option you could then simply click on the button to achieve the desired effect.

To add a custom button:

  1. In the Custom tab, click on the icon Custom Buttons. The Configure custom buttons dialog box is displayed.

  2. Press on the Add button. A second dialog box appears.

  3. Enter a name for the button in the Button title box.

  4. You can replace the suggested shortcut key by placing the cursor inside the Shortcut box and then pressing CTRL or Shift, or both and another key.

  5. Select the type of command that you want to associate with the button.
    You can associate an HTML tag, a script several lines long or starting an external program.
    The adjacent areas of the dialog box are updated according to the type of command selected.

  6. From the dropdown list in the Icon area, choose an icon to represent the command.

  7. In the Button Content area, enter the required information.

  • If you are associating an HTML tag, you must indicate the opening and closing tags in the corresponding fields.
    For example, to define bold and italic formatting, enter <B><I> as the opening tags and </B></I> as the closing tags.

  • If you are defining a script, you must enter the script lines in the entry fields. You can also import an external file by clicking on the Import button.

  • If you are defining an external program, you must enter the location of the program you want to run when the button is pressed.

  8. Press on the OK button.

The custom button is placed on the Custom tab.

To modify the properties of a custom button:

  1. In the Custom Buttons tab, click on the Custom Buttons. The Configure custom buttons dialog box is displayed.

  2. From the list, elect the button that you want to modify.

  3. Click on the Properties button.

  4. Change the properties.

  5. Click on the OK button.

To delete a custom button:

  1. In the Custom tab, click on the Custom Buttons. You can use the shortcut CTRL+1, CTRL+2, etc. according to the number of the button you want to delete (Refer to Shortcuts list).

  2. From the list, select the button that you want to delete.

  3. Click on the Delete button or press the keyboard’s Delete key.

  4. Click on the OK button.

To use a custom button:

You use a custom button much in the same way you use other AceHTML buttons, on selected text, or before entering text. You have access to the commands defined in the button in several ways:

  • Using the Custom tab

  • Using the context menu

  • Using the shortcut you assigned to the custom button.

The custom button is added to the list of buttons on the tabs bar. You can add the button to the custom bar.


File menu

  • New

  • Open

  • Close

  • Close All

  • Import file

  • Save

  • Save As

  • Save all

  • Save as Template

  • Send to

  • Open file from Web address

  • Print

  • Exit


Edit menu

  • Undo

  • Redo

  • Repeat Last Command

  • Cut

  • Copy

  • Paste

  • Paste as HTML

  • Clear

  • Select All

  • Indent Right

  • Indent Left

  • Find

  • Replace

  • Find Next

  • Extended Search and Replace

  • Go to Line Number

  • Go to Next Tag

  • Go to Previous Tag

  • Tag Properties

The context menu that opens on the edit window also allows you to delete a tag.


View Menu

  • Project Manager

  • To-do list

  • Image Browse

  • Desktops

  • Display Code Explorer

  • Display Visual Explorer

  • Display Code Inspector

  • Displa y File Manager

  • Display Code Snippets Library

  • Display Vertical toolbar

  • Display Special Characters Bar

  • Display Status Bar

  • Display Internal Browser

  • Auto Refresh Viewer

  • Shift to Edit Window

  • Encoding

  • Toolbars


Project menu

This menu allows you to manage a group of HTML files that are part of the same project.

  • Add Current File To Project

  • Remove Current File From Project

  • New Project

  • Open Project

  • Close Project

  • Save Project

  • Save Project As

  • Save Project on FTP

  • Archive project as backup

  • Open All Project Files


Syntax Menu

  • Reference Editor

  • Syntax Checking Preferences

  • Check Online Links

  • Check Document

  • Check Project

  • Evaluate Document

  • Evaluate Project

  • Check All Documents

  • Evaluate All Documents


Options menu

  • General Preferences

  • Editor Preferences

  • Objects Editor

  • File Manager

  • Code Optimizer

  • Start External Browser

  • Start Internal Browser

  • S tart Spell Checking

  • Start AceFTP

  • Start PHP external interpreter

  • Start Perl external interpreter


Documents Menu

This menu lists the HTML documents that are open during a work section. This list is limited to the first ten documents opened during the work session; you have access to other files in another window.

You can also determine which documents are open by referring to the tabs displayed at the top of the edit window. Each tab contains the name of the document.

To make a document the "active" file:

Making a document the active" file consists of displaying it on the foreground of the edit window in order to be able to modify it.

There are two ways to make a document the active document:

  • using the Documents menu,

  • using the document tab bar.

To make a document the active one using its tab:

  • Click on the name of the document you want to make the active one. You will note that the tab comes to the foreground.

To make a document the active one using the documents menu:

  • From the Document menu, select the name of the document.

To display the complete list of documents:

  1. From the Documents menu, select Documents Window. You can also use the shortcut ALT+O (Refer to list of shortcuts).

  2. Another window opens on top of the edit window. The complete list of documents is available in this window.

  • Use the scroll bar to display the name of documents that are not visible.

  • Double click on the name of the document you want to make the active one. The documents window remains open. Click on the X on the extreme right of the title bar in order to close it.


The Table Menu

The menu of the Table window gives you quick access to commands in order to modify the table, cell, row and column properties:

  • File Menu

  • Edit Menu

  • Options Menu

  • Table Menu


General Preferences

Automatic Browser Search

  1. In the Search on disk zone, select the drive that contains your external browser. Your C drive should be displayed by default.

  2. Select the default browser by checking the corresponding box.
    AceHTML offers the following options: Internet Explorer, Netscape or Opera. You can also enter the name of another browser in the field. In fact, if you know the browser address, you can enter it directly in the adjoining zone.

  3. Click on Search.

  • If you selected Netscape, AceHTML searches for the file netscape.exe.

  • If you selected Microsoft Internet Explorer, AceHTML searches for the file iexplore.exe.

Search results are displayed in the lower zone of the dialog box. Double-click on the program file to associate, to display it in the browser zone.

General Preferences

Most of the connection parameters and parameters for messages and queues are defined by default, on the basis of the operations you do most often.

  1. In the Tools menu, click on General Preferences.
    You can also use     SHIFT + CTRL + F11 (See the List of Shortcut Keys).

The General Preferences window is divided into two sections:

  • The section on the left includes the list of parameters you can change.
    Some of the parameter options can be classified by category.

  • Click on the link to display the corresponding options. Whenever suboptions are available, the parameter tree will be displayed.

  • The section on the right displays the options corresponding to the selected parameters.

  • Click on a parameter. The right side of the window will be refreshed.

You can reset the AceHTML parameters at any time by clicking on Restore.

AceHTML lets you define the following parameters:

  • Environment

  • Editor

  • Files Handling

  • Syntax Checking

  • External Interpreters

Environment

Environment options include display parameter commands. The Environment menu includes options for displaying or hiding display items for the Edit window and the Code Inspector.

Main Environment options

Show status bar | The status bar is displayed below the Edit Window. It provides information on the status of the document: position in the Edit Window, modifications done, etc. This option is activated by default.
Display special characters bar | The Special Characters toolbar lets you quickly access special characters (accented characters, symbols, etc.). When displayed, it can be seen above the Edit Window. This option is activated by default.
Display vertical toolbar | The vertical toolbar offers functionalities that can help you with editing tasks: display or hide line numbers or bookmarks in the margins, code highlighting tool, code completion tool.
Desktop docked in a single window | This option lets you dock all the display items in one single window. When disabled, the Edit Window and browser window will be displayed separately.
Display internal browser | The internal browser is integrated to AceHTML. It lets you view the progress made as you edit your Web pages. When this option is activated, a distinct window opens every time the application is run.
Create new document on startup | When this option is activated, AceHTML will create a new document every time the software is run. This option is activated by default.
Reopen last opened files on startup | With this option, AceHTML file saves the last files opened, in memory, when you exit the application. When you start up AceHTML again, these documents are automatically opened.
Reopen last project on startup | With this option, AceHTML saves the last project opened, in memory, when you exit the application. When you start up AceHTML again, the project is automatically opened.
Auto-save desktop settings | When you activate this option, changes made to the work environment (customization of toolbars, item display and masks, etc.) are saved. They will be displayed as they last were the next time you start up AceHTML. Display definitions can also be saved for future use.
Disable Java and scripts in internal browser | When this option is activated, the AceHTML internal browser does not display the execution of Java items or scripts. This facilitates the execution of the command displayed.
Check for last version on the Internet | This option lets you check the Visicom Web site to verify whether any more recent versions of AceHTML are available.
Show file extensions on editor tabs | Displays file extensions on tabs of opened pages. This function can be useful when you work with different types of files (.html, .asp, .css, etc.).
Display tips of the day on startup | When this option is activated, a tip is displayed whenever AceHTML is run. This option can also be disabled from the Tips window. This option is activated by default.

Internal Browser

[Top of page]

Work offline only

Stops your computer from automatically connecting to the Internet when you click on a hyperlink in the internal browser window.

Suppress all dialogs

Prevents, if you are using Internet Explorer, dialog boxes from being displayed in the internal browser.

Automatically save FTP files before viewing

When you ask to view your page in the internal browser, AceHTML saves it, by default, on the FTP server before displaying it.

Display status bar

The status bar is displayed below the internal browser.

Auto-refresh browser

This option automatically refreshes the Web page you are editing so that you can see your progress as you work.

When you select this option, the milliseconds field is activated. You can define the frequency at which the page is refreshed.

Use a base URL

At start up, the internal browser connects directly to the URL specified in the Base URL field.

Use an HTTP Proxy

Activate this option if your computer connects to a proxy server.

When you select this option, the Proxy Port zone is activated. In the next field, enter your server port number. A proxy server normally uses a port 80.

External Browser

[Top of page]

Search on disk

From the dropdown list, select the work unit that contains the executable browser program you want to associate. This program is usually located in C:\Program Files.

Locating the External Browser on Disk >>

Netscape

Select this option if you want Netscape as your main external browser.

Microsoft Explorer

Select this option if you want Microsoft Internet Explorer as your main external browser.

Empty field

Select this option if you want to assign another browser as your main external browser. You can choose the browser Opera.exe, proposed by AceHTML, or enter the complete name of the desired browser software and its execution extension (.exe) in the dropdown list field.

  • In the field next to the selected browser, enter the software location (address) on your computer. You can also do a search.

Maximize browser window when launched

The browser window will always be full screen once you activate this option.

Use a temporary file for previews

When you preview a file, AceHTML creates a temporary file in the same folder. Activating this option displays the last file previewed in the internal browser.

Misc. Options

Save files before previewing in external browser | Once this option is activated, the HTML document being edited must be saved before it can be previewed with the external browser. This option is activated by default.
Save project before previewing in external browser | AceHTML automatically saves the project when you display the documents.

Editor Options

[Top of page]

Editor options let you configure the basic editor parameters: file history and document encoding and editing options.

The commands in the Editor sub-menu provide access to other editing options:

Always insert UPPERCASE tabs | This options enables tags to be automatically converted to uppercase characters as they are entered. This option is helpful when you need to draw a distinction between tags in the Edit Window. This option is activated by default.
Always quote string attributes | When this option is checked, all attributes comprised of character strings will be in quotation marks.
Always quote numeric attributes | When this option is checked, all attributes comprised of numbers will be in quotation marks.
Force default values for tags | Check this option to display all default attributes in the tables in the generated HTML code.
File History Length | This option lets you specify the number of files to keep in the history. The list of history files is displayed when you open the dropdown list associated to the Open command in the File menu.
Project History Length | This option lets you specify the number of project to keep in the history. The list of history files is displayed when you open the dropdown list associated to the Open command in the menu Project.
Selectable characters by double-click | Specify the special characters (except for A through Z and 0 through 9) that will be selected when you double-click on a word in the Edit Window.

Encoding

[Top of page]

Generate special characters

This options enables characters to be automatically converted to special characters. It is useful if you are working with older browser versions.

When you select this option, the Special characters in decimals box is activated. This latter option lets you display all special characters in decimals. For example, the character é = &eacute, a special character, becomes &#233, a special character in decimals.

Convert ISO 8859-1 special characters

This options enables special characters to be converted according to ISO standard 8859-1.

Attention: This standard is not supported by Netscape 4 and older versions.

Activate Encoding

This option lets you activate or disable the international automatic encoding system in AceHTML. Activating this option will activate the adjoining zones.

Encoding

This dropdown list gives the various available encoding options. Select the one that corresponds to your alphabet. Western alphabets correspond to ISO-8859-1.

Encode pages without encoding specification

This option lets you encode HTML pages with no specified encoding META tags. The encoding will follow the encoding alphabet selected in the preferences.

When you select this option, the box Show a confirmation before applying an encoding is displayed. If you activate this option and the document does not include an encoding alphabet, AceHTML asks for a confirmation before executing the encoding.

File types that should not be encoded

This list gives the extensions (file types) that should be ignored by the encoding. Enter the file extension directly in the field. Separate extensions with commas (,). An asterisk (*) authorizes all characters preceding the file extension; you must enter it.

Validate values entered in Code Inspector | When this option is activated, AceHTML validates modifications according to the information contained in reference files (see Reference Editor).
Display all CSS properties | This option lets you see all of the style sheet properties. This option is activated by default.

Tables

[Top of page]

Show &nbsp; in cells

This option lets you automatically insert NBSP codes in table cells, to display the latter.

Quick table cell widths in percentage

Activate this option to force a cell width on the table cells. By default, the width of cells is proportional to the number of cells in a row.

If this option is disabled, no particular size will be assigned to the cells. Rather, their size will be adjusted on the basis of the cell contents.

Code Helpers

[Top of page]

The code content parameters define the Edit Window tool options, the code tooltips and the code completion options. You can also access display options for these commands on the vertical toolbar in the Edit Window.

Code Tooltips | Check this box to display code tooltips. These are help balloons that are displayed whenever the mouse cursor remains in a specific location for more than a certain amount of time.
Code Completion | Check this box to activate the AceHTML code completion assistant. You can also activate the assistant by pressing CTRL + Space.
Delay | Use the indicator to change the delay time before a tooltip help balloon is displayed.

File Handling

[Top of page]

Automatically copy referenced files to current directory

When activated, this option automatically copies files referred by links to the current directory. This prevents the relativization of the access path to a set address, and subsequently, the broken links that can occur when the file is uploaded to the server.

Keep networked path of referenced files

This option is useful if you use AceHTML to edit Web pages for an Intranet. Otherwise, disable this option, to prevent the relativization of access paths.

Force lowercase for referenced file names

When activated, this option enables uppercase characters to be automatically converted to lowercase when files are saved. This is useful when the host server does not recognize uppercase characters in file names.

Save files in Unix format

Activate this option if your site is hosted by a Unix server.

Remember last Open/Save directory

Once this option is activated, the address of the directory used is saved. This option works in conjunction with commands for opening and saving files. This option is activated by default.

Create a backup copy

This option lets you create a backup copy of each document modified and saved. Activating this option will activate the adjoining zones.

You can enter the file extension name in the File backup extension zone. By default, AceHTML proposes the extension .bak.

You must indicate the directory in which the backup should be saved in the Backup folder zone. If necessary, click on Open to search for the directory.

File Sharing with other applications

There may be a conflict if you use AceHTML to open a file that is already open in another application. File sharing options let you determine the behavior of AceHTML:

  • Only if read access is required: you can open files in read-only mode. To make changes to the file, save it under another name.

  • Files cannot be shared: AceHTML notifies you that the file is being used by another application, and refuses to open it.

  • Files can be shared without restrictions: AceHTML lets you open and modify the file. If you use this option, make sure you avoid all version conflicts.

Document Types

[Top of page]

When you open a document in AceHTML, the application determines the file type, by checking the extension.

By default, file extensions are associated to a specific document type. You can change this association or create new file extensions.

Default document type for new documents

This dropdown list gives the various types of documents to which a file extension can be associated.

Types

This zone displays the list of extensions associated with the document type selected in the zone above.

Options of selected type

This zone lets you identify and add a new extension to the list.

  1. Begin by selecting the document type to which you want to associate the extension.

  2. Enter the extension in the zone.

  3. Click on Add to add it to the list.

Extensions always begin with the character . (point), and are generally comprised of only 2 or 3 characters (some HTML documents will have more, such as secured HTML, .shtml).

Define additional options:

  • Insert comments upon creation: A comment is inserted at the beginning of the document when you create a new file of the type selected in the list Types.

  • Insert document prolog: A prologue is inserted at the beginning of the document when you create a new file of the type selected in the list Types. Example: <!doctype html public "-//w3c//dtd html 4.0//en">.

  • Customize initial content: Activate this option to access the Edit button. Click on it to display the dialog box Initial content of HTML documents, which lets you customize the initial script.

Add

This button lets you add an extension to the list.

Delete

This button lets you delete an extension from the list.

  1. Select the extension to delete from the list.

  2. Click on Delete.

Default visible file extensions

List of extensions displayed in the Managers when no masks are applied. Enter the file extension you want to add directly in the field. Separate extensions with commas (,). An asterisk (*) authorizes all characters preceding the file extension; you must enter it.

Associations

[Top of page]

These options let you further define an extension's association to the document type by indicating behavior when the file is opened in Windows Explorer.

File types associated with AceHTML

This zone displays the list of extensions associated with AceHTML in Windows.

Select dormant

This button lets you select the list of dormant extensions, namely those that are not associated to a behavior.

Add extension

This button lets you add an extension to the list.

  1. Click on it to display the corresponding dialog box.

  2. In the field, enter the new extension and click on OK.

The extension is automatically added to the list.

Remove extension

This button lets you remove an extension from the list.

  1. Select the extension to be removed from the list Associated extensions by clicking on it.

  2. Click on Remove extension.

A confirmation message is displayed. Click on OK to execute the removal.

Add AceHTML in Internet Explorer Edit menu

This option lets you identify Internet Explorer as the default browser for opening this type of file in Windows Explorer.

Once in Windows Explorer, double-clicking on a file with this extension will launch AceHTML, which will open the file.

Syntax Checking

[Top of page]

The options in this menu are used to defined how the HTML syntax check and document check are done.

Other than the basic commands for limiting the number of messages received, syntax checking options include:

Number of messages

Maximum number of errors | This zone lets you determine the maximum number of error messages when checking HTML documents. Once this number is reached, the HTML check stops.
Maximum number of warnings | This zone lets you determine the maximum number of warning messages displayed in the message window when checking HTML documents. Once this number is reached, the HTML check stops.

HTML

[Top of page]

Attribute integrity | This option lets you ensure that the mandatory attributes determined by the HTML syntax editor are respected. This option is activated by default.
Optional end tag without start tag | End tags, given their status as orphans, can never be associated with an opening. Example: Paragraph end tag </P>, and no start tag <P>.This option is activated by default.
Unknown start tag | There is no start tag in the HTML reference file specified in the syntax editor. This option is activated by default.
Missing optional end tag | No end tag was detected for the corresponding start tag, despite it being optional. Example: When the box is checked and you use a tag <P> without an end tag </P>.
Dead links | A link points to an inexistent target or address. This option is activated by default.
Unknown end tag | There is no end tag in the Reference Editor's HTML reference file. This option is activated by default.
Unclosed comment | The comment has no end tag.
Disallow unknown tags | An unknown tag has been detected. An unknown tag is a tag that does not adhere to the rules established in the HTML syntax editor. For example, a tag <META>, found elsewhere than in the tag <HEAD>.This option is activated by default.
Required attribute missing | A required attribute, which must be associated to a tag, is missing. Example: the attribute <HREF>, for a link, is missing. This option is activated by default.
Required end tag without start tag | An end tag, to which no start tag has been associated, is missing. This option is activated by default.
Required end tag not found | A required end tag is not detected. This option is activated by default.
Tag containing illegal symbol | An unauthorized character is detected within a tag (example, &). This option is activated by default.
Optional start tag | A warning message will be displayed if you use an optional start tag.
Disallow attributes in end tags | An attribute is detected within an end tag. End tags can never include attributes. This option is activated by default.
Tag bracket not found | One of the start or end tag brackets is missing (tags are always enclosed in brackets, namely < and >). This option is activated by default.
Duplicate internal links (anchors) | When two links have the same name. This option is activated by default.
Tag must be empty | A warning message will be displayed if you add parameters or values not authorized for a particular tag.
Unclosed script blocks | A script tag is not closed.

CSS

[Top of page]

When checking the document, activating the options below will display their respective messages:

Unterminated CSS comment | An error was made in formulating a CSS comment.
Unknown @-rule | One of these rules is unknown. It can either not exist, or include a syntax error. The @-rule (CSS2 rules) makes it possible to provide special information to the application that will interpret the style sheets.
Illegal @import rule | The @import rule is illegal.
Illegal @charset rule | The @charset rule is illegal.
Bad formed or not correct URL | A URL address includes a syntax error.
Unknown pseudo-class | The pseudo-class identified is unknown; it may either not exist, or include a syntax error. Pseudo-classes are items that are executed with the class attribute, to apply specific effects to items.
Unknown medium type | The medium identified is unknown. In a CSS rule, a medium is a peripheral used to execute a visual effect: computer monitor, television, projection screen, etc.
Improper character set or language code | A character string cannot be identified as either a code or rule.
Unknown CSS property | A rule's property is unknown; it can either not exist, or include a syntax error.
CSS property not defined for selector | A rule property cannot be associated to the specified selector; either it does not exist, or it includes a syntax error.
Bad value for CSS property | The value associated with a rule property is unknown; either it does not exist, or it includes a syntax error.
Unknown HTML attribute | The HTML attribute associated with a rule property is unknown; either it does not exist, or it includes a syntax error.
Bad HTML comment | An HTML comment associated to a rule includes a syntax error.
Syntax errors | A syntax error can be detected.

JavaScript

[Top of page]

Identifier expected but reserved word found | A word specified as an identifier (ID) is in the document, but cannot serve as an identifier.
Identifier reserved for future use | The identifier (ID) cannot be used when called, as it is reserved for another use.
Predefined object | An object's definition was modified, whereas this was not permitted.
Predefined method | An object's method was modified, whereas this was not permitted.
Expected character not found | A character is missing from the script.
Unterminated string | A specified character string is not closed.
Digit expected | The number for executing the script cannot be found.
Multiline comment not closed | The script multiline comment is not closed.
Expression terminated | The expression has been completed, but some items are still missing.
Operator expected | The operator for processing information is missing.
Statement not allowed there | The statement has not been inserted in the right section of the script.
Improper function placement | The function has been defined at the wrong place.
Duplicate identifier | The name of the function is included twice in the script.
Identifier expected | The function identifier (ID) is missing.
Bad "switch" statement | A syntax error has occurred in the switch statement.
Bad "try" statement | A syntax error has occurred in the try statement.
Illegal label | The name of the label used in the function is not authorized.
Syntax error | A syntax error has been identified.
Missing semicolon between statements | The semicolons for separating statements within a function are missing.
Incorrect regular expression | The expression contains errors.
Illegal class name | The name of the class used in the function is not authorized.
Check objects, methods and functions | Check statements for objects, methods and functions. A message will be displayed if any errors are found.
Check .NET modifiers | Verification of .NET modifiers A message will be displayed if any errors are found.

PHP

[Top of page]

Identifier expected but reserved word found | A word specified as an identifier (ID) is in the document, but cannot serve as an identifier.
Predefined function statements | The statement for these functions is predefined and cannot be modified.
Illegal character | The script includes unauthorized characters.
Expected character not found | A character is missing from the script.
Unterminated string | A specified character string is not closed.
Multiline comment not closed | The script multiline comment is not closed.
Statement not allowed there | A certain character string is not authorized.
Nested functions not allowed | Nested functions are included in a location where they are not permitted.
Duplicated identifier | The name of the function is included twice in the script.
Identifier expected | The function identifier (ID) is missing.
Bad "switch" statement | A syntax error has occurred in the switch statement.
Syntax errors | A syntax error can be detected.
Semicolon between statements | There are semicolons in statements, whereas this is not permitted.
Incorrect heredoc string syntax | The syntax in the heredoc statement is incorrect.
Bad "if" statement | The syntax of if statements contains errors.
Variable expected | A variable is missing from the statement.
Bad "class" statement | The syntax in the class statement is incorrect.
String expected | You cannot find a character string you are looking for.

VB

[Top of page]

Syntax errors | A syntax error can be detected.
Reserved word errors | The identifier (ID) cannot be used when called, as it is reserved for another use.
Duplicated identifier | The name of the function is included twice in the script.
Statement or operator not allowed | An identified character string is not authorized.
Incorrect Function statement | The syntax of Function statements contains errors.
Incorrect "Class" statement | The syntax of Class statements contains errors.
Incorrect "For" statement | The syntax of For statements contains errors.
Incorrect "If" statement | The syntax of If statements contains errors.
Incorrect "Select Case" statement | The syntax of Select Case statements contains errors.
Conflicting scope definition | A message will be displayed if there is conflicting use of these functions.
Conflicting declaration modifiers | Modifiers are checked. A message will be displayed if there is conflicting use.

External Interpreters

To use the external interpreter function, you must have the necessary files.

Two types of interpreters can be used:

  • PHP interpreters

  • PERL interpreters.

Associating an interpreter file

  1. Enter the name and address of the interpreter file in the zone corresponding to the type of file you wish to associate. If necessary, click on Open file to search for the file on your workstation.

  2. In the Parameters zone, specify the parameters to associate to external interpreters.


Editor Preferences

To display general preference options:

  1. In the Tools menu, click on Editor Preferences.
    You can also use SHIFT + CTRL + F12 (See the List of Shortcut Keys).

The Editor Preferences dialog box has four tabs that include various parameter options:

General | This tab includes functions for defining the mode for entering items in the Edit Window along with printing options.
Color | This tab includes all the functions for modifying the attributes for displaying the various items making up an HTML document.
Options | This tab includes all the options for defining the default HTML document editing and printing parameters.
Auto-correct | This tab includes all the options for defining the HTML document auto-correct parameters.
Code Templates | This tab lets you define a custom script library.


Display Options

Left Margin | This zone lets you specify the length of the left margin. The value is given in pixels.
Show Left Margin | This option displays the margin to the left of the Edit window (gray zone). You can display line numbers, and stars indicating where lines have been clipped, in this margin.
Editor Font | Font of the characters displayed in the Edit window. You can change the font size in the Size field.


General Options

Auto Indent | This option lets you retain the alignment of command lines once you have pressed Enter, to insert a line break. Alignment involves aligning all command lines so that they are equally indented. This alignment is only activated in the Edit Window. If the option is disabled, the new line will be displayed in the first column in the Edit Window. To modify the alignment, use Align right or Align left in the Editor menu.
Smart tabs | When this box is not checked, tabs (TAB key) will be equal to the first occupied space in the previous line.
Small fill | This option changes the behavior of Auto Indent by only considering the smallest possible number of characters, and only using tabs and spaces when required.
Use TAB character | Automatically replaces a group of spaces by a tab.
Show non-printable characters | This option shows characters that are not usually displayed in the Edit Window (space, tab, etc.).
Word wrap | Establishes a right margin, for wrapping lines that are too long.
Double-click word select | Double-clicking on this option in the Edit Window selects an entire word.
Cursor beyond end of lines | This option lets you place the cursor beyond the space where a line would normally wrap. Line wrap must be enabled for this option to work.
Focus on current line | Inserts a border around the line on which your cursor is.
Unlimited Undo/Redo | Keeps all operations in memory, enabling an unlimited number of Undo and Redo operations in the Editor toolbar.
Activate Syntax Highlighting | This option displays the color of items (comments, tags, etc.) in the Edit Window. This option works in conjunction with the colors defined in the Color Tab (Preferences) in the Edit Window. This option is helpful when you need to draw a distinction between text and items. When this option is disabled, all items in the window (codes, rules, text) will be displayed in black and white.
Mark wrapped lines | This option displays a star in the margin of the Edit Window for each wrapped line. Wrapping lines only affects the Edit Window; it has no impact on the resulting Web page.
Wrap column | This zone will be useful if you show wrapped lines. It lets you decide at which column you want the line to wrap. Enter a number corresponding to the number of characters.
Show wrapped lines | This option leys you display wrapped lines in the Edit Window. Selecting it enables you to view an entire command line without using the horizontal scroll bar.

Printing Options

Wrap long lines | This option lets you wraps overly long lines.
Print line numbers | This option lets you number all of the lines in a printed document.
File name in header | When this option is activated, the name and address of the HTML file will be printed in the upper left corner of the document.
Date in header | When this option is activated, the print date will be printed in the upper right corner of the document.
Page numbers | When this option is activated, the printed document will include page numbers.
Print in color | This option lets you print the Edit Window in color. You can then identify tag colors on your paper copy.

Other options

Indent step | This zone lets you specify the indent step (alignment) (in pixels).
Default TAB stop | This zone lets you specify the size of the alignment between the document left margin and the text line(s), once you press the TAB key.
Tab columns | This zone lets you specify under which column text should begin (alignment), once you press the TAB key.


Color Options

Any modifications made to the properties and attributes only apply to the Edit window. They will not appear on the Web page displayed by a browser.

Language

AceHTML proposes HTML code by default.

Preview zone

Lets you view modifications in the Edit window as they are made.

Syntax items

Displays the list of items you can include in the Edit window.

  1. Select the item whose color you want to change.

  2. Apply the desired changes and attributes in the other tab zones.

Foreground

This button displays the AceHTML color palette for the foreground (characters) of the previously selected item. When the foreground option is unavailable, the button is grayed-out.

Background

This button displays the AceHTML color palette for the background (background raster) of the previously selected item. When the background option is unavailable, the button is out-out.

Default

Check one of the boxes if you wish to use default values for a specific item.

Text Attributes

Check the boxes corresponding to the desired text attributes. Text refers to the text outside of the tags, namely, that which will be visible on your Web page.


Auto-Correct

This tab allows you to customize an editor preferences dictionary within AceHTML in order to correct a word automatically or to create AutoText entries for entering words or phases using only an abbreviation.

To create a new Auto Correct entry:

  1. In the text box below the Replace column, enter an error you make frequently.
    For example, enter teh.

  2. In the text box below with column, enter the correction corresponding to the error you entered previously.
    For example, enter the.

  3. Click on the Add button to add this Auto Correct entry to the list.
    The top part of the dialog box displays the list of Auto Correct entries you have made.

To edit an Auto Correct entry:

  1. In the Auto Correct list, click on the entry you want to edit in order to select it.
    The entry's information is displayed in the fields under the list.

  2. Make the desired changes.
    The Delete button changes to the Replace button.

  3. Click on the Replace button to replace the Auto Correct entry on the list.

To delete an entry:

  1. In the Auto Correct list, click on the entry you want to delete in order to select it.
    The entry's information is displayed in the fields under the list.

  2. Click on the Delete button.


Code Templates

This tab allows you to create a library of custom scripts that you want to use in the design of your Web pages with the aid of keyboard shortcuts.

The window is divided into two sections:

The top section | Displays the list of scripts found in the template selected in the lower section of the window.
The lower section | Displays the list of code templates.

To create a new code template:

  1. In the text box below the Name column, enter the code.

  2. In the text box below the Description column, enter a brief description of the code.

  3. Click on the Add button to add this entry to the list.

The top part of the dialog box displays all the codes you have defined.

You can also define a code template by using the shortcut CTRL+J (Refer to list of shortcuts).

To edit an entry:

  1. In the list of codes, click on the entry you want to edit in order to select it.
    The entry's information is displayed in the fields under the list.

  2. Make the desired changes.
    The Delete button changes to the Replace button.

  3. Click on the Replace button to replace the code on the list.

To delete an entry:

  1. In the list of codes, click on the entry you want to delete in order to select it.
    The entry's information is displayed in the fields under the list.

  2. Click on the Delete button.


Edit Window

The edit window is your work space. It displays the HTML tags, the codes, and the text which represent the contents of your document. When you work with dialog boxes, the codes generated by the commands are automatically inserted in the edit window at the point of insertion.

Default display of the current edit window:

The tabs of the open documents:

Each tab appears on the top of the edit window, below the special characters bar, and is identified by the document name. The highlighted tab corresponds to the document being edited.

The documents are arranged in the order in which they were opened. However, you can move them easily. Click on the tab you want to move and, while keeping the left mouse button pressed, move it to the desired location.

Special characters bar:

Located above the edit window, the special characters bar allows you to insert special characters and symbols quickly by simply clicking on the desired character or symbol. You can hide the special characters bar using the View menu.

The Vertical toolbar:

A tools mini bar has several options that makes editing your document easy: it contains tools to display or hide line numbering or bookmarks on the margin, a highlighting tool, or a code completion tool.

More Vertical toolbar details .

Sheet margin:

Located to the left of the edit window, the sheet margin displays the line numbering, the bookmarks and the page breaks.

Status bar:

Located on the bottom of the edit window, the status bar indicates your position on the edit window and the current working mode.


Highlighting Effects

Creating a Web page requires a lot of detail. If you use a wide array of programming code, HTML, Scripts, Style Sheets, etc. you will end up with documents that contain a lot of different types of information that are displayed in a large number of lines.

You can use bookmarks to help you mark certain information so that you can find it quickly. The To-do list is another tool that helps you with the development of your projects. Besides all these tools, AceHTML also has a highlighting tool to help you identify information so that you can spot it quickly.

The highlighting tool is available on the edit window’s mini bar.

To apply highlighting to text:

  1. Click on the Highlight button on the mini bar and then click on the Highlight option.
    The pointer turns into a pencil.

  2. Drag the pencil over the text you want to highlight.
    The highlighting tool remains active until you click on the button again. It highlights using the last color used.

To disable the highlighting tool:

  1. Click on the Highlight button to disable it.

To change the highlighting color:

  1. Click on the Highlight button on the mini bar and drop down the Select a color menu.
    The list of available colors is displayed.

  2. Click on the desired color.
    All the highlighting in the document changes to the selected color.

Removing highlighting

You can remove the highlighting of selected text, all the highlighting in a document, or the highlighting in all open documents.

To remove highlighting from selected text:

  1. Click on the Highlight button on the mini bar and click on the Highlight option.
    The pointer changes to a pencil.

  2. Drag the pencil over the highlighted text.
    The highlighting is removed.

To remove all highlighting in the document:

  1. Click on the Highlight button on the mini bar and then click on the Remove highlight from file option.
    Highlighting removed from all the documents.

To remove highlighting from all open documents:

  1. Click on the Highlight button on the mini bar and then click on the Remove highlight from all files option.
    The highlighting is removed from all the documents that were open when the command was executed.


File Explorer

File Explorer lets you identify links to FTP sites that will help you create Web pages. The File Explorer tree is displayed by default in File Explorer whenever you open or save a document.

  1. Select the command Display|Display File Explorer.
    You can also use the shortcut key MAJ + F7. See the list of shortcut keys.

File Explorer is part of the Resources window, which is displayed on the left side of your screen when you start AceHTML. If the window is floating, click and drag the title bar towards the Code Inspector and Code Explorer tabs to dock it. Once the window is docked, use the pop-up menu commands to replace the superimposed window. Select the command Always on Top to keep File Explorer displayed at all times.

Using File Explorer

File Explorer displays a tree containing the files you are working on. These are in two categories:

§ Desktop: access to all folders and files on your workstation.

§ FTP site: access to all FTP sites you have configured.

You can transfer files from Windows Explorer to File Explorer and vice versa. You can also use File Explorer to insert a hyperlink in your document, by clicking and dragging from an FTP site to the active document in the Edit window.

You can use the pop-up menu commands to copy or cut documents or folders, as you would in Windows Explorer.

The properties of folders and files on a server enable you to define the options for accessing scripts and modifying elements.
File Explorer is fully integrated to Ace HTML. You can use FTP server directories defined in File Explorer for all commands for opening documents , saving documents and saving projects .

Creating an FTP connection

  1. Display the contents of the FTP site file in your File Manager window.

  2. Select the command New FTP site from the pop-up menu. The New FTP site window is displayed. Enter the server identification and user information:

Name displayed

Identification of the connection displayed in File Manager.

Server

URL of the FTP server you want to connect to.

Port

Communication port. By default, the port used to communicate with an FTP server is 21. If necessary, you can change the port number. You can obtain this information from your Internet service provider.

User name

Enter your user name. You can obtain this information from your Internet service provider.

Password

Enter your password.

Initial directory

Name of the directory you want to open once the connection is established. Leave this field blank to access the Web site root.

Http URL

HTTP Address to connect to the server, if you are not using an FTP address.

Passive (PASV)

To use a passive connection.

PASV mode is a passive exchange mode that is used to ensure there are no conflicts when simultaneously transferring files.

Certain servers with a firewall require use of the passive mode, as the connection in such cases must be established by the server.


File Manager

The AceHTML File Manager lets you work on files, as you would in Windows Explorer. Moreover, it has dynamic software functions that facilitate document management. File Manager lets you:

  • View the structure of system directories;

  • Copy and move files and/or documents using the pop-up menu or drag-and-drop;

  • See an overview of the selected file, particularly useful in the case of HTML documents, images and sounds;

  • View information on file size, along with the date of the most recent modifications;

  • Search by criteria, to find the desired files;

  • Display a list or detailed list of files (in the window) or show files as small or large icons.

  • View desktop elements.

The Manager is displayed in the Resources window by default. You can also superimpose it on the Edit Window.

To open the File Manager:

  • Click on the File Manager icon located on on the Standard AceHTML toolbar.
    You can also use the shortcut F2 (Refer to list of shortcuts).

Following is a brief description of the icons found in the File Manager:

The Recent Folder button displays the list of folders recently consulted. The option Clear List lets you reset the function.

The Parent Folder button lets you view the file structure.

The New Folder button lets you create a new folder in the current directory.

The Delete button lets you delete the selected file or folder.

The View button displays the list of various folder display modes.

The Preview button lets you view an image or the contents of a selected file.

The Show Folder Tree button displays the folder structure, as in Windows Explorer.

Insert Link

This button lets you insert an external link in the current document:

  1. Place your mouse pointer at the spot in the document where you want to insert the link, and select the text that will serve as a Meta tag.

  2. Display File Manager.

  3. Select the document to be linked.

  4. Click on the Insert Link button.

AceHTML will insert a reference to the following file at the specified location:

<a href="top.html">text</a>

Insert Image

  1. Place your mouse pointer at the spot in the document where you want to insert the image.

  2. Display File Manager.

  3. Select the image to insert.

  4. Click on the Insert Image button.

AceHTML will insert a reference to the following file at the specified location:

<img src="image.gif" border="0" width="25" height="25">

Containing

This zone lets you specify a search object. If the search object consists of several words, insert them in quotation marks.

Modified

This zone is used to search only those files that were added in a specified interval.

Search

The button lets you search for a file that meets the criteria you included in the Text or properties zone.

New Search

The New Search button lets you cancel previous search criteria and use default values to do a new search.


Start AceFTP

This command allows you to start AceFTP, a program to transfer files between your computer and the server, without having to exit AceHTML. AceFTP is perfectly integrated with the AceHTML editor. Thus, to transfer your Web pages, you can use these two programs combined.

To start AceFTP without closing AceHTML:

  1. Make sure you are connected to Internet.

  2. keyboard shortcut F9 .
    The connection dialog box appears.

  3. Enter the username and password and click Connect. have AceFTP already installed in your computer.

If you don't have AceFTP installed, you can download a trial version from the following address: http://softwares.visicommedia.com/en/products/aceftp/.


Image Browse

This command displays, as thumbnails, all the bmp, gif and jpg format images found in any directory in your hard disk. This command is used to check the name, location, and format of your graphics files.

To display images found in a directory:

  1. In the Standard toolbar, select Image Browse
    or
    From the File menu, select Image Browse. You can also use the shortcut Shift+F2 (Refer to list of shortcuts).

  2. Select the directory containing the images you want to view.

The window is split into two windows. On the left side you can see your disk's the directory tree while the right window displays the bmp, gig and jpg images.

From the left window, select the directory that contains the images you want to view.

The right window displays all the images found on the selected directory.

You can toggle between your edit window and the Image Browse window to move around your document and insert more images.

Click on an image. The following information is displayed on the status bar: the size in pixels, the size in kilobytes, the date it was last modified and the directory where it's found.

You can also insert the image with the corresponding code in your HTML document. To do so, simply double click on the desired image and the code (<img src="image.gif" border="0" width="25" height="25">) will be inserted where the cursor is positioned in your document.


Create new document

Besides HTML documents, AceHTML can be used to create many different types of files:

  • XHTML documents, the last version code that has evolved from HTML. When you create an XHMTL document, the heading in the document indicates it is an XHTML document. The Code Optimizer allows you to convert an HTML document into a XHTML

  • JavaScript documents, scripts to be integrated in your document and intended to execute a particular task, such as applying a dynamic effect on images.

  • CSS documents (Cascading Styles Sheets), scripts containing formatting rules which you can link to your HTML document to standardize the page format of your Web pages.

  • WML documents (Wireless Markup Language) for formatting HTML documents for WAP telephones.

  • XML documents (which have an .xlm or .dtd extension), the advanced Web page programming language, which allows - amongst other things - complex data processing.

  • PERL documents (which have a .pl or .cgi extension), scripts which establish a link between one of your forms and a data base.

  • Standard text documents (with the .txt extension) to create documents with any type of extension.

Creating a new document:

  1. In the File menu, select New.
    or
    In the Standard toolbar, click on the New button. You can also use a shortcut by simultaneously pressing the CTRL+N keys (Refer to list of shortcuts).

  2. When you click on the icon, select the type of document you want to create.
    HTML document     is selected by default.

  3. Click on the OK button.

An edit window is displayed in which you can create your HTML document. The document’s heading will contain the information necessary to correctly interpret the document you have chosen to create.


Import File

This command allows you to import a text (.txt) file into your working document. The advantage is that the imported file will be inserted at the exact location you want inside the document you are working on.

  1. In the File menu, select Import File.

  2. AceHTML displays the Open File(s) dialog box. Indicate the desired drive and select the directory which contains the file to be imported.

  3. Select the document to be imported.

  4. Click on the Open button (or double click on the desired file).

  5. The Import File dialog box allows you to chose the point where the file will be inserted on the edit window:

  • At the cursor position inserts the file at the insertion point prior to the execution of the command.

  • At the end of the file inserts the file at the end of the text body (before the </BODY> tag).

  6. Check the Change carriage return to <BR> for .txt file if you wish to keep the line breaks.


Using bookmarks

An HTML document can often represent several screen pages. At that point, it may become cumbersome to move around the document and locate information. AceHTML employs bookmarks to mark certain points on the edit window in order to locate the information easily and to access it quickly.

You can also use the shortcut CTRL+ALT+J+Number to insert a bookmark and CTRL+ALT+K+Number to go to the position of your bookmark (Refer to list of shortcuts).

To create a bookmark:

  1. Go to the line you want to bookmark.

  2. Click on the right mouse button to display the context menu.

  3. Click on the Insert bookmark option. The list of the ten available bookmarks is displayed.

  4. Select the bookmark with the number you want to assign.

Once the bookmark has been defined, AceHTML displays its identification number on the margin.

To go to a bookmarked line:

  1. Display the context menu from anywhere on the sheet.

  2. Click on the Go to bookmark option. The list of available bookmarks is displayed. The bookmark numbers that have not been assigned yet are displayed in gray. Only the assigned bookmarks are seen in normal characters.

  3. Click on the bookmark where you want to go.
    The edit window relocates to the designated place.


Go to next or previous tag

AceHTML comes with different tools to help you move around the edit window, for example, you can use bookmarks or jump from one tag to another using a simple command.

To jump to another tag:

  1. Place the cursor over a tag.

  2. In the Edit menu, select the appropriate command, depending on the direction you want to move:

  • Go to next tag

  • Go to previous tag


Spell Checking

With spell check, you can correct spelling and grammar mistakes in documents. You can customize the spell checking options.

To use spell checking in AceHTML, the English dictionary must be installed in the system. AceHTML uses both a main dictionary and a custom dictionary.

1. In the Edit toolbar, click on Start Spell Checking. You can also use F5 (See the List of Shortcut Keys).

  • If necessary, click on the arrow to select the language of the documents.

The Spelling Options dialog box opens. The title bar gives the language.

Spell checking identifies all of the words in a document that are not found in the specified dictionary. Each time it encounters such a word, it pauses, enabling you to check and if necessary, correct any errors.

  • In the zone Not Found, AceHTML displays the words that it has not found in the dictionary. These can be errors, but could also be words that are correct and that you will want to add to the dictionary.

  • In the Suggestions zone, AceHTML displays a list of suggested corrections.

Correcting spelling errors

Ignore

Click on this button to ignore the unknown word, marked in red, and continue with the check.

The spell checker will pause again the next time it encounters this same word.

Ignore All

Click on this button to ignore the unknown word each time it is encountered during the current check.

Replace

Click on this button to replace the unknown word by the word suggested.

  1. Click on the suggestion that corresponds to the proper spelling of the word.
    or
    Click in the zone Unknown Word and enter the correctly spelled word.

  2. Click on Replace to correct this occurrence.

The spell checker will pause again the next time it encounters this same word.

Replace All

Click on this button to replace this word (either with the suggested word or with a correction you have entered) each time it is encountered during the current check.

Add

Click on this button to add the unknown word to the current dictionary.

Auto correct

Click on this button to automatically correct the word in the Not Found zone by the last word used to correct this same error. This button is disabled as long as the error is not encountered, and if the dictionary is unable to make a suggestion.

Options

Click on this button to display the spelling options.

Close

Click on this button once you have completed the check, or if you wish to stop the check and return to the Edit Window.


Spell Checking options

These options let you determine the spell checking parameters.

Ignore words in UPPERCASE | Does not take words in uppercase into account.
Ignore words containing numbers | Does not take series of characters containing numbers into account.
Ignore Internet addresses | Ignores character strings recognized as Internet addresses (http, mailto, etc.)
Ignore quoted lines | Ignores character strings marked by the item blockquote.
Ignore abbreviations | Ignores character strings marked by the item ABBR.
Suggest from main dictionaries only | Forces the checker to consult the main dictionary. If this option is disabled, the checker will consult both the main directory and the personal dictionary selected.
Prompt on repeated word | Stops whenever it runs across doublets (e.g., we we).
Automatically correct DUal capitals. | Changes the second letter of a word if a second cap is recognized.
Dictionaries | List of correctors integrated into AceHTML.
Custom Dictionary | A customer dictionary is created the first time AceHTML is used. Each time a term is added to the spell check feature, it goes into this dictionary. If the option Suggest from main dictionaries only is disabled, the check is done from both the main and customary dictionary lists.


Print document

This command allows you to print a document on the default printer.

  • In the File menu, select Print.

The print dialog box has the following options:

Print selected block | Check this box if you want to print only the section you have selected in the edit window. If no text was selected, this option is disabled.
Wrap long lines | If checked, long lines are cut when the HTML document is printed.
Line numbers | If selected, the HTML document is printed with every line numbered.
Title in header | If selected, the printout of the HTML document contains on the left upper corner the name of the document and the directory where it is located in your hard disk.
Date in header | If selected, the date and time are printed on the upper right corner of the document.
Page numbers | If selected, the page numbers are printed on the document.
Print in color | The edit window is printed in color and therefore the tags are easily detected in the printout.
Setup | Click on the Setup button to display a dialog box where you can make changes to your printer’s parameters.

The Print button can be added to the Edit toolbar.


Send to email address

This function lets you send the Web page being created to an e-mail address. There are two possible commands:

  • To Mail Recipient in Body: the current Web page is sent in the message itself (contents).

  • To Mail Recipient in Attach: the current Web page is sent as an attachment.

Once the command is executed, the Send a page to a friend dialog box opens. Enter the e-mail address of the recipient and click on Ok.

AceHTML use the default messaging service installed.


Exit AceHTML

The Exit command closes the AceHTML program as well as all open documents. If there are one or more documents which have not been saved since they were last modified, AceHTML will ask you to save them before exiting the program.

  • In the File menu, select Exit
    or

  • You can also exit AceHTML by clicking on the Exit button on the top right corner of the screen.


Open a document

The Open command lets you open a document saved on a disk. The document is displayed in its own window, with the file name given in a tab.

  1. In the File menu, click on Open.
    or
    In the Standard toolbar, click on Open.
    You can also use a shortcut, by pressing CTRL + O (See the List of Shortcut Keys). Click on the arrow displayed to select from among the last files on which you worked.
    The File Manager window is displayed. By default, AceHTML displays the File Manager, which contains the defined FTP servers. By launching the Desktop tree, you can search for a file on your hard drive.

  2. Select the file you want to open:

  • In the zone Look in: select the desired browser: the Windows desktop or File Manager.

  • In the browse field, find the proper directory.

  • In the File type zone: select the type of file you want. Click on the arrow to access the list of available file formats.

  • In the File name zone: type in or select the file you want.

  3. A series of options let you manage files within AceHTML.

  4. Click on Open.

You can also open a document from Windows Explorer. To do so, select the document in the File Manager window and drag it to the AceHTML Editor window or the AceHTML icon on the taskbar.

You can also open a document directly from a Web site.


Open a file from an FTP Address

The AceHTML File Manager lets you open a document directly from an FTP server. You must have first configured the connection to the server where the file is located.

  1. Make sure you are connected to the Internet before opening the document.

  2. In the File menu, click on Open.

  3. In the File Manager window, click on the Look in: list, go to the bottom, and select the file FTP Sites.

  4. The established connections are displayed in the window browser zone.

  5. Select the server, and find the file you want to open.


Open Document from Web Site

The Open document from Web Site command allows opening a document directly from a Web Site. The document will open on a window of its own and the name of the file will be displayed on the tab.

However, to open a document from a Web site you must have authorized access.

  1. From the File menu, select Open a document from Web Site.
    The Web Address dialog box is displayed. By default, the entry area for the URL address displays the http:// protocol.

  2. In the entry area enter the complete address of the document, including its name.
    The Save file(s) dialog box is displayed. AceHTML directs you to make changes to the document directly from your hard disk.

  3. Indicate the directory in your hard disk where you want to save the document and then click on the Register button.
    AceHTML connects to the specified URL address and opens the document using the name you assign to it. If the document has links to external files (images, JavaScripts, CSS, etc.), these are not saved with the document.


Recall last files

  1. From the File menu, click on the arrow corresponding to the Open option.

  2. The list of the last files edited with AceHTML is displayed. Click on the name of the document you wish to open.

AceHTML displays up to 16 files in this list.


Save document

The Save command allows you to save the current document to disk. If the document has not been saved, this option will have the same effect as the Save As command.

To save the current document:

  • In the File menu, select Save.
    or

  • In the Standard toolbar, click on the Save icon. You can also use a shortcut by simultaneously pressing on the keys CTRL+S (Refer to list of shortcuts).

If you wish to save an existing document under another name or in another location, use the Save As command.


Save to FTP

The AceHTML File Manager lets you save a document directly to an FTP server. You must have first configured the connection to the server where you want to save the file.

  1. Make sure you are connected to the Internet before opening the document.

  2. In the File menu, click on Save As.

  3. In the File Manager window, click on the Look in: list, go to the bottom, and select the file FTP Sites.
    The established connections are displayed in the window browser zone.

  4. Select the server, and find the file you want to save.

  5. Save the file.


Save a document under a different name

The command Save As lets you save a document that has never been saved to a disk. It can also be used to save an existing document under a new name.

Saving a new document a saving a document under another name:

  1. In the File menu, click on Save As.
    The File Manager window is displayed. By default, AceHTML displays the File Manager, which contains the list of defined FTP servers. By launching the Desktop tree, you can search for a location on your hard drive.

  2. Assign a file name to the document:

  • In the zone Look in: select the desired browser.

  • In the browse field, select the desired directory.

  • In the zone File type: select the type of file you want. Click on the arrow to access the list of available file formats.

  • In the zone File name: enter the new file name or select an existing file.

  • Once you are done, click on OK.


Save as Template

If you frequently use the same type of document with the same type of elements, you can create a template. The document template will retain the contents you save: the links to external files (.css, .js) as well as the text content and formatting of the document.

Please note that the linked files are not saved when you save the template. You must make sure they are present so that the links are preserved. You can also create a site template that contains all the necessary files.

To save a document as a template:

  1. From the File menu select Save as Template.
    A dialog box for saving the template is displayed.

  2. Enter a name for the template in the Template name box.

  3. Click on OK.
    A message is displayed indicating the template has been saved under the Custom tab of the New document dialog box.


Save all open documents

The command Save All lets you save all open documents to a disk. This command is useful when working on more than one document at the same time.

  • In the File menu, click on Save All.
    or

  • In the Standard toolbar, click on Save All.
    You can also use SHIFT + ALT + F5 (See the List of Shortcut Keys).

If one or more documents are open that have never been saved, the File Manager window will open, to allow you to select the directory and identify the document. The File Manager window is displayed. By default, AceHTML displays the File Explorer, which contains the list of defined FTP servers. By launching the Desktop tree, you can search for a location on your hard drive.


Close document

It's possible to close a document without exiting AceHTML. If the document has not been saved, or if it has been modified since the last time it was saved, AceHTML will ask you to save it before closing it.

  • In the File menu, select Close.
    Or

  • In the Standard toolbar, click on the Close icon.

If the document has undergone changes which have not been saved, a message will remind you to save it. If you close a document that has never been saved, a message is displayed so that you can save it under the name of your choice.

You can also use the shortcut CTRL+W (Refer to list of shortcuts).


Close All

It's possible to close all open documents at once. If one of the documents has not been saved, or has been modified since the last time it was saved, AceHTML will ask you to save it before you close it.

  • In the File menu, select Close All.
    or

  • In the Standard toolbar, click on the Close All icon.

If any of the documents has undergone changes which have not been saved, a message will remind you to save it. If you close a document that has never been saved, a message is displayed so that you can save it under the name of your choice.

You can also use the shortcut CTRL+ALT+F4 (Refer to list of shortcuts).


To-Do list manager

The function To-Do List lets you monitor progress on a Web project. You can add, change or remove items from the list, set priorities, or assign to-do items to persons in charge. You can also change how the list is displayed.

You can enter a list of general to-do items, or define a list of items for a specific project.

Displaying the General List

  1. In the View menu, click on To-Do List.
    The To-Do List window is displayed as a tab in the work sheet zone.

Displaying the Project List

  1. Open the project for which you want to create a To-Do list.

  2. Display the list of to-do items.
    The To-Do List window is displayed.

  3. Open the pop-up menu and click on the option Project List.
    The title bar gives the name of the project To-Do file. The file has a .todo extension.

The To-Do List window is automatically hidden when you are working in the Edit Window. If you want it to remain visible, select the option Always on Top in the pop-up menu.

The To-Do List window

The To-Do List window displayed is docked in the Edit Window zone. The pop-up menu in the window lets you manipulate docking. The pop-up menu also includes other functions. Four columns illustrate the list information:

Action Item | Specifics on the task to be done on the item in the Module column.
! Item priority | There are up to 100 priority levels, the highest priority being level 1.
Module | Name of object (HTML document, image file, CSS file, …) to be modified. This column indicates the relative address of the object in your folders. To add it to a To-Do, it must already exist.
Owner | Name of the person responsible for doing the task in question.
Category | Category you have defined for classifying this To-Do item.

Modifying how the To-Do List is displayed

The To-Do List is displayed in a window that you can manipulate directly or by using pop-up menu commands. Any changes you make to how a list is displayed will apply to all displays generated during the same work session.

  • The Dock function on the pop-up menu lets you dock and undock the window.

  • Once the window is undocked, you can click and drag the window borders in order to change its size.

  • You can change how columns are sorted by clicking on the title of the column controlling the sort. An arrow indicates the sort order. Click on the column once again to invert the order. You can also use the list in the Sort command on the pop-up menu.

Displaying To-Do tips

To-Do tips are displayed in a help balloon. If the text you entered to describe the item's action is too long, for example, the entire text will be displayed in the help balloon.

  1. Open the To-Do List pop-up menu.

  2. Enable the option Show Tooltips when Clipped.

To view tips, move your mouse to a To-Do. The help balloon will appear within about one second.

To-Do List

Adding a To-Do to the general To-Do List

You can enter characters in several of the dialog box fields. In some case, the entire text may not be visible in the To-Do List. In such a case, enable the option ToolTips to display a help balloon.

  1. Display the To-Do list.
    The title bar gives the name of the To-Do list. The To-Do file has a .todo extension.

  2. Make sure you are working on the right To-Do list. If necessary, open the pop-up menu in the window and select General List or Project List.

  3. Open the pop-up menu in the window and click on the option Add.
    The dialog box Add To-Do Item opens.

  4. Specify the action to be taken in the Text zone. This information is displayed in the Action Item column of the To-Do List. You can enter as much information (text) as you like.

  5. Specify the task's priority level in the field Priority. You can enter a number in the field, or use the up and down arrows. Priority levels from 1 to 100 can be selected , the highest priority being level 1.

  6. Enter the name of the person responsible for doing the task in question in the field Owner. Once a name is entered, you can access it from the dropdown list when adding other To-Do items.

  7. Enter a word that will help you classify the task in question in the field Category. Once a category is entered, you can access it from the dropdown list when adding other To-Do items.

  8. Indicate the path of the object corresponding to the To-Do item in the field Module. You can use the Open button to browse on your workstation.

  9. If necessary, check the box Done to indicate that this To-Do item has been completed.

  10. Click on OK to return to the To-Do List.

Modifying a To-Do Item

  1. Select the item you wish to modify.

  2. Open the pop-up menu for the item selected and click on the option Edit.
    You can also double-click on the item to modify or press F2 (See list of shortcut keys).The dialog box Edit To-Do Item opens.

  3. Modify the information as needed, referring to the procedure for Adding a To-Do item.

Adding a To-Do item to a project To-Do List

  1. Open the project for which you want to create a To-Do List.

  2. Display the list of To-Do items.

  3. Open the pop-up menu and click on the option Project List.

  4. The title bar gives the name of the project To-Do file. The file has a .todo extension.

  5. Add items as indicated in the previous section.

Indicating when a To-Do item has been completed

  1. Open the To-Do List window.

  2. Check the box corresponding to the completed To-Do item.
    he text in the item line is automatically underlined. This indicates that a task is completed.

You can also indicate that an item has been completed when you create or modify it. You can apply filters so that only current items are displayed in the To-Do window.

To-Do List display filters

Filters for displaying information

If your General and Project lists contain many items, you may wish to limit the information displayed. You could, for example, only show those items that pertain to your specific tasks.

  1. Display the list of applicable To-Do items.

  2. Open the pop-up menu in the window and click on the option Filter.

  3. In the list displayed, select the column to which the filter must apply.

  4. The dialog box Filter To-Do List opens.

  5. Check the information you want displayed in the list. The text you do not check will remain hidden.

  6. Click on OK to return to the To-Do List.

  7. The list has now been modified and only the requested information will be displayed.

You can apply several filter levels to specify display criteria more precisely.

Displaying current items

  1. Open the To-Do List pop-up menu.

  2. Disable the option Show Completed Items.

When this option is enabled, all items, both current and completed, are displayed.

Recovering the To-Do List

You can copy of print the To-Do List in two formats:

  • Text: the list, in .txt format, is displayed as a table, with column names indicated.

  • HTML: the list, in .txt format, is displayed with the HTML tags used to create the table.

Copying or printing the To-Do List

  1. Open the To-Do List pop-up menu.

  2. Click on the desired command: Copy or Print.

  3. Choose the format by clicking on the appropriate option.

If you select copy, the text will be sent to the Windows clipboard. Once in a document, you can recover it by clicking Paste, offered in all Windows applications (shortcut key CTRL+V).

If you select print, the printing job is automatically sent to your workstation's default printer.


Undo

This command allows you to reverse the last actions made. The first time you select this option, AceHTML will reverse the last action you performed. If you select this option again, AceHTML will reverse the action before that, and so forth.

  • In the Edit menu, select Undo.
    or

  • On the Edit toolbar, click on the Undo icon.

You can also use a shortcut by simultaneously pressing on the keys CTRL+Z (Refer to list of shortcuts).


Redo

This command allows you to redo the last actions you have undone. The first time you select this option, AceHTML will redo the last action you have undone. If you select this option again, AceHTML will redo the next to last option you have undone, and so forth.

  • From the Edit menu, select Redo.
    Or

  • On the Edit toolbar, click on the button Redo.

You can also use a shortcut by simultaneously pressing on the keys SHIFT+CTRL+Z (Refer to list of shortcuts).


Repeat Last Command

This command allows you to repeat the last command you performed.

  • From the Edit menu, select Repeat last command.

You can also use a shortcut by simultaneously pressing on the keys SHIFT+CTRL+Y (Refer to list of shortcuts).


Cut

This command is used to remove text or graphics from a document and place them on the Clipboard. Afterwards, the text or graphics can be reinserted in another location by means of the Paste command.

  1. From the Edit menu, select Cut
    or
    On the Edit toolbar, click on the Cut icon.

You can also use a shortcut by simultaneously pressing on the keys CTRL+X (Refer to list of shortcuts).


Copy

This command is used to copy text or graphics from a document and place them on the Clipboard. Afterwards, the text or graphics can be reinserted in another location by means of the Paste command.

  1. From the Edit menu, select Copy
    or
    On the Edit toolbar, click on the Copy icon.

You can also use a shortcut by simultaneously pressing on the keys CTRL+C (Refer to list of shortcuts).


Paste

This command is used to insert the contents of the Clipboard into the current document. Since the information remains in the Clipboard's memory, you can reuse the Paste command many times.

  • From the Edit menu, select Paste
    or

  • on the Edit toolbar, click on the Paste icon.

You can also use a shortcut by simultaneously pressing on the keys CTRL+V (Refer to list of shortcuts).


Paste as HTML

This command can help you import text into an HTML document. Apart from the text, it copies the formatting of the contents of the Clipboard and associates the HTML commands and attributes. Since the information remains in the Clipboard's memory, you can reuse the Paste as HTML command many times.

  • Copy the formatted text from the source application.

  • Switch to AceHTML.

  • From the Edit menu, select Paste as HTML.


Delete

This command is used to erase permanently text or graphics from a document. As such, it is similar to the Cut command, with the exception that the cut contents are not placed in the Clipboard's memory.

  1. Select the text or graphics to be cleared.

  2. From the Edit menu, select Clear.

You can also use a shortcut by using the DELETE key. (Refer to list of shortcuts).


Select all

This command is used to select the entire contents of the current document.

  • From the Edit menu, click on the Select All option.

You can also use a shortcut by simultaneously pressing on the keys CTRL+A (Refer to list of shortcuts).


Find

This command lets you search for text in a document. You can enter one or more words in the search field, and AceHTML will identify the location of the first such string of similar characters in the document.

  1. In the Edit menu, click on Find.
    or
    In the Edit toolbar, click on Find.
    You can also use a shortcut, by pressing CTRL + F (See the List of Shortcut Keys).

  2. Enter the text you are looking for in the zone Text to find and click on Find.

The "Search for" dialog box has the following options:

Text to find

Enter the character string you are looking for here. The dropdown list indicates the last searches you did.

Find

Click on this button to find the first occurrence of the character string indicated in the field Text to find.

Replace

This button toggles to the Replace function, which lets you replace, one at time, the text found in the document by a specified character string.

From cursor

This option lets you begin the search from the cursor position, and continue to the end of the document. The section of the document prior to the cursor position will only be searched at the end.

From the beginning

This option lets you begin the search at the very start of the document, and search to the end.

Direction - Forward and Backward

This option lets you begin the search at the cursor position, and to move either forward or backward.

Whole word only

This option limits the search to a specified character string or sequence. For example, if you are searching for the word note in a document, the word notation will not be displayed, given that they are not identical.

Case sensitive

This option lets you include uppercase or lowercase letters in the specified character strings. For example, if you are searching for the word note in a document, the word Note will not be displayed.

Scope

This option lets you limit the scope of the search:

  • Global, to search the entire document.

  • Selected text, to limit the search to the text previously selected.

Directory to search tab

This tab lets you search all the files open in the Editor, or only current project files.

Type of search: Indicate the type of files you wish to search. You can only search in files that are open.

If necessary, indicate case and whole word options when searching in several files.


Find Next

This option allows you to repeat automatically the last search you performed. It lets you find the word you are searching for quickly.

  • From the Edit menu, select Find Next.

You can also use a shortcut by pressing on the key F3 (Refer to list of shortcuts).


Replace

This command lets you search for text in a document and replace it with another character sequence. You can enter one or more words in the search field, and AceHTML will identify the location of the first such string of similar characters. You can then replace it with another character sequence.

  1. In the Edit menu, click on Replace.
    You can also use a shortcut, by pressing CTRL + R (See the List of Shortcut Keys).

  2. Enter the text you are looking for in the zone Text to find.

  3. Enter the text you want to have replace it in the zone Text to replace.

  4. Click on Replace.

Replace window options

Text to find

Enter the character string you are looking for here. The dropdown list indicates the last searches you did.

Find

Click on this button to find the next occurrence of the character string indicated in the field Text to find.

Text to replace

Enter the text you want to have replace the text you are searching for in the document. To erase the text entered in the Text to find field, the Text to replace field must be blank. The list lets you choose a replacement text that you already used.

Replace

Click on this button to replace the occurrence found by the text indicated in the field Text to replace.

Replace all

This button is displayed once you have toggled to the Replace command. It lets you replace all of the text found in the document by the specified character sequence, without confirming each change.

From cursor

This option lets you begin the search from the cursor position, and continue to the end of the document. The section of the document prior to the cursor position will only be searched at the end.

From the beginning

This option lets you begin the search at the very start of the document, and search to the end.

Direction - Forward and Backward

This option lets you begin the search at the cursor position, and to move either forward or backward.

Case sensitive

This option lets you include uppercase or lowercase letters in the specified character strings. For example, if you are searching for the word note in a document, you will find note, but not Note.

Whole word only

This option limits the search to a specified character string or sequence. For example, if you are searching for the word note in a document, the word notation will not be displayed, given that they are not identical.

Scope

This option lets you limit the scope of the search:

  • Global: to search the entire document.

  • Selected text: to limit the search to the text previously selected.


Extended search and replace

With this command you can search for a block of text and replace it in an extended manner. Text can be searched and replaced across many different documents found in the same directory or belonging to the same project.

You can enter one or more words in the "Text to find box" and AceHTML will show you where the first match of characters is found in the document as well as the name of the document where the search is being done. You can then replace them with another string.

To replace text by blocks:

  1. From the Edit menu, click on Replace by.
    Or
    In the Standard toolbar, click on the Replace by icon. You can also use the shortcut SHIFT+CTRL+X (Refer to list of shortcuts).

  2. Enter the text you are looking for in the Text to find box.
    You can also use the copy/paste method to insert text in this box.

  3. Enter the text that is going to replace the text you are looking for in the Text to replace box.

  4. Click on the Add button if you have chosen the Specified files option and select the files in which you want to perform the replacement
    or
    Click on the Browser button if you have chosen the Search in directories and select the directories.

  5. Click on the Start button to begin replacing.

To stop the current search, click on the Stop button.

The "Replace by" dialog box has the following options:

Case sensitive | If this option is selected, the search will find only those occurrences with the exact combination of uppercase and lowercase letters specified in the "Text to find" box. For example, if you search for the word Editor, you will find the word Editor but not the word editor.
Backup modified file | If this option is selected, the modified file will be saved with the same file name and the specified extension name. By default, AceHTML uses the .bak extension for backup files.
Extension name | Specifies the extension name for the backup file.
Specified files | If selected, this option allows you to replace the "text to find" by the text indicated in the Text to replace box only in those files specified for the search.
Search all files in project | If selected, this option allows you to replace the "text to find" by the text indicated in the Text to replace box in all the files in the project. The files must be opened before performing the text search and replace. This option is not available if the file does not belong to any project.
Search in directories | If selected, this option allows you to replace the "text to find" with the text indicated in the Text to replace in all the files found in the directory selected for the search.
Include subdirectories | If selected, this option allows you to replace the "text to find" with the text indicated in the Text to replace area in all the files found in the subdirectories belonging to the directory selected for the search.


Characters used in extended searches

^ | Caret (circumflex). When the string you are looking for is found at the beginning of a line.
$ | Dollars. When the string you are looking for is found at the end of a line.
. | Dot. When searching for any character. You must place the dot in the location where the character you are looking for should be found. Ex. : ba. = bat bas bap
* | Asterisk. At the end of a string of characters to search for any string of characters. Ex. : ba* = bat battre basse
+ | Plus. At the location where the character you are searching for is repeated. Ex. : co+ = coo or co++ = cooo
[ ] | Straight brackets. When searching for any specific character, excluding others. Ex. : [123] = 1 or 2 or 3
[^] | Caret between straight brackets. When searching for characters excluding those specified between the brackets. Ex. : ba[^s] = bat but not bas
[-] | Minus sign between straight brackets. To specify a sequence of possible characters. Ex. : ba[d-u] = bas or bat but not bac
{ } | Curly brackets. To search for groups of embedded operators.
\ | Back slash. If the string of characters contains a symbol that is used as an operator, you must insert the back slash before the character so that the search engine does not mistake the symbol for an operator.


Special characters

This command allows you to insert special characters in your document.

  1. Place the cursor in the desired position to insert the special character.

  2. In the Specialized tab, click on the icon Special characters.

  3. Double click on the desired character or select the character and press on the check mark on the bottom of the window.

  4. Click on the window's closure box to hide the toolbar.

AceHTML adds the character code in your document.

If this command is used, the toolbar is superimposed on the edit window. You can also display the Special Characters toolbar fixed to the top part of your edit window.


Go to Line Number

This command allows you to move around quickly in your HTML document without having to use the arrow keys on your keyboard to go to a specific line.

  1. From the Edit menu, click on the Go to Line Number option.

  2. Type the line number where you want to go. You can also use a shortcut by simultaneously pressing on the keys ALT+G (Refer to list of shortcuts).

The corresponding line numbers are those shown on the right margin. If they are not displayed, select display margin.


Code Completion

The Code Completion tool is particularly helpful in completing HTML and PHP code lines.

  1. Click on the Code Completion button on the vertical toolbar.

Using the Code Completion tool

Leaving the Code Completion tool activated will not hinder you in your work. To use it:

  1. Begin at the tag where you have code left to insert.

  2. Press on the shortcut key CTRL + Escape.
    A dropdown list is displayed at the insertion point. Your position in the list corresponds to the first letters of the code.
    To display the entire list, insert only one bracket in the Edit Window.

  3. View list contents with the scroll bar.

  4. Double-click on the desired tag to insert it. The entire code composition is inserted.

  5. Enable the option Show Tooltips when Clipped.

You can set the display delay in the General Preferences.


Code Tooltips

The ToolTips function is designed to help you edit codes. When this function is enabled, a help balloon is displayed when tags are entered in the Edit Window. The help balloon displays properties or attributes that can be associated to the code being edited.

1. Click on the Code Tooltips button on the vertical toolbar.

To view tips, move your mouse to a To-Do. The help balloon will appear within about one second.

You can set the display delay in the General Preferences.


Shift to Edit Window

If you are working with a docked desktop, you will find it easy to shift between the Inspector window and the edit window: a simple click on the mouse on the window will alternate windows. However, if you are working on overlapping windows, this could be a problem.

  • From the View menu, click on the Shift to Edit Window to go from one window to another.


Resources window

The Resources window is displayed in the left section of the main AceHTML window. By default, five tabs are included:

Code Inspector

Code Explorer

Visual Explorer

File Explorer

Code Snippets Library

The F11 key lets you toggle between the Resources window and Editor window, and vice versa (See List of Shortcut Keys).

This window can be moved anywhere on your screen, as you would a toolbar (See Toolbars).

The Resources window was designed to include other displays, for example, File Manager or the list of HTML commands. Click on the title bar of the display you wish to dock, and drag it on the Inspector section. The docked windows are represented by tabs.

Moving a tab

Each Resources window tab can be independently manipulated.

  1. Click on the tab for the resource you want to move.

  2. Keeping your left mouse button pressed down, drag the tab to the desired location.

To bring the sheet back to its original location, drag it to the window title bar.

You can command automatic display of the window in the View menu. Once the window is open, you can define its disposition on the display with the options in the pop-up menu (right click).


Code inspector

Code Inspector is displayed in the Resources window. It lets you check and modify HTML code properties, events, styles and values.

The Code Inspector uses Meta tags defined in the Reference editor. If you want the Code Inspector to process new Meta tags, you will need to add them to the existing references in the Reference editor.

Inspecting a code

  1. Select the start tag for the code you want to inspect.
    The window now displays all of the properties, events and styles of the selected code.
    You can also select the ode for which you want to consult the properties in the dropdown list at the top of the Code Inspector window.

  2. Click on the tab corresponding to the type of information to modify:

Properties | This tab contains all of the properties and their associated values. If a property is used by the selected code, its value is given in the second column. For example, the page background color <BODY>, the character size <FONT>.
Events | This tab contains all of the events that can be executed. If an event is used by the selected code, its value is displayed in the second column. For example, cursor actions.
Styles | This tab contains all of the styles corresponding to a CSS rule. If a style is used, its value is given in the second column.

Modifying a code

  1. To modify the value of a property, even or style, click on its name. The field corresponding to the second column is activated.

  2. In the corresponding field, define the desired value, according to the choices offered:

When the field is as such, you have two options:

  • Click on the button [image] to open the dialog box corresponding to the function. This can be the dialog box for opening files, for the color palette, or yet still, an Edit Window for entering the necessary information.

  • Click on the button [image] to open the list of choices corresponding to the active element.

As soon as a value is specified, you can see the new codes entered in the Edit Window.

When the field is as such, it represents an option box. This leaves you with only two options:

  • Check the box to activate the option;

  • Remove the check to disable the option.

Option boxes represent choices expressed as values:

True or False – Yes or No – Fixed or None

As soon as a value is specified, you can see the new codes entered in the Edit Window.

When the field is as such, this represents plus or minus increments, for example, to determine the size of a character or table.

  • Click on the arrows to increase or decrease the size.

As soon as a value is specified, you can see the new codes entered in the Edit Window.

When the field is as such, it represents a dropdown list that allows you to access the various values of the selected item.

  1. Click on the arrow to access the list.

  2. Click on the desired value.

As soon as a value is selected, you can see the new codes entered in the Edit Window.

When the field is a such, it means that text information must be added. For example, the item identification number (ID).

  • Enter the information directly in the appropriate field.

As soon as a value is specified, you can see the new codes entered in the Edit window.


Code Explorer

Code Explorer is displayed in the Resources window. It is displayed as a tree with internal and external links, source files linked to the document (images or other), and the JavaScript and VB script functions in the HTML document. It lets you easily finds items in your document.

To make finding information easier, Code Explorer uses icons to identify Sheets and file simulations to identify Nodes.

You can create your own sheets or nodes.

For example:

This tree presents a list of all internal links and external links contained on the page.

This tree presents a list of all the image files linked to the page.

This tree presents a list of all the JavaScript files linked to the page.

If the reference repeats itself, the number of repetitions will be given in parentheses.

Example:

The image bullet.gif occurs five times. Note that the image name in Code Explorer includes its relative address. The link color.htm#code occurs in two places. The color.htm#hexa, however, only occurs once, as there is no number attached to it.

You can customize Code Explorer by adding nodes to identify specific items. Any changes you make will be saved, and the parameters can be used again in all your HTML documents.

Moving a Sheet

Each sheet in this window can be manipulated independently.

  1. Click on the tab of the sheet you want to move.

  2. Keeping your left mouse button pressed down, drag the sheet to the desired location.

To bring the sheet back to its original location, drag it to the window title bar.

You can command automatic display of the window in the View menu. Once the window is open, you can define its disposition on the display with the options in the pop-up menu (right click).

You can also use SHIFT + F4 to display Code Explorer (See the List of Shortcut Keys).


Working with code

To access a code’s location in an edit window:

  • On the Code Explorer, double click on the code to search for.
    You can likewise use the Go to command of the context menu.

If the element you are trying to obtain is found in several places, click as many times as necessary until the appropriate line is reached.

The edit window area scrolls until the code line is found.

To refresh the Code Explorer:

This command is useful if you have made many changes in your document and you want to be assured that the Code Explorer correctly reflects changes.

  1. In the Code Explorer window, click on the right mouse button.

  2. In context menu, click on the Update option.

To rename a sheet:

The sheet represents an element of the document, for example, the name of an internal link or of an image. If you rename this element within the Code Explorer window, this change will be reflected inside the edit window.

Therefore, if you change an internal link in the Code Explorer window, all the elements of the document being edited will reflect such a change. Always be careful when verifying changes: if the internal address (in the case of this example) does not exist, the link will not be valid. Likewise, if you change the name of an image, make sure that the name of the reference folder is also renamed in the File Manager.

  1. In the Code Explorer window, click the right mouse button on the sheet to be renamed.

  2. In the context menu list, click on the Rename option. The name of the sheet will be highlighted.

  3. Make the desired correction.
    All the lines in the edit window containing this reference will be changed.

To modify a node in one sheet:

  1. Open the context menu on the Code Explorer window.

  2. In the menu list, click the Objects Editor option.

  3. The Objects editor window will appear. It proposes the following options:

New node | This button lets you create a new node.
Delete node | This button is used to permanently delete the node that you previously selected.
Node properties | This button allows you to change the node properties.
Add leaf | This button lets you associate a leaf (representing an element in your document) to the node that you had previously selected.
Leaf properties | This button lets you change the properties of an existing leaf.
Delete leaf | This button permanently deletes a leaf.
Reset | This button lets you restore the default values proposed by AceHTML.

To save the contents of the Code Explorer for a specific document:

You can save to a file any information that the Code Explorer provides concerning an HTML document.

  1. Display the document whose contents you want to save.

  2. Drop the context menu on the Code Explorer window.

  3. In the menu list, click on the Save contents option. The Save file window will appear. AceHTML proposes that you save the contents in .txt format under the same name that the HTML document has.

  4. Save document.

You can retrieve the information by double-clicking the folder’s icon or by using a word processor.


The Objects Editor

The Code Explorer graphically displays the elements contained in your HTML page: the external scripts such as .class (Java Applet) files, .css (Style sheets) or .js (external JavaScripts) as well as the internal elements such as the anchored objects (images), or the hyperlinks about other documents.

Once you analyze your document, it could be that you need to identify an element which has not been contemplated by AceHTML – for example, level 2 headings (H2) to which you have attributed a specific class (CLASS) (see the style sheets ).

You can create a new node so as to visualize all the elements corresponding to a given criteria with the Code Explorer.

To edit an object:

  1. Open the context menu on the Code Explorer window.

  2. In the menu list, click on the Objects Editor option. The Objects editor window appears.

  3. Click on New node button. The dialog box Object properties appears.

  4. In the Node name field, type the name to identify the node that you wish to add.

  5. In the Tree leaf field, choose an icon that would represent the element you want to identify.

  6. In the Graph side field, place the check mark that corresponds to the direction selected.

  7. Click on the OK button to go back to the Objects editor.
    To identify the elements to be displayed under the node, you must now add a leaf. If you do not associate the leaf, the node that you have just created will not be displayed.

  8. In the Objects editor, select the node that you have just created.

  9. Click on the Add a leaf sheet. The dialog box Tag and attribute appears.

  10. In the Element field, drop the list to select the element (HTML tag) that you want represented.
    Type the first letter of the tag to scroll down the list more rapidly.

  11. In the Attribute field, open the list to select the attribute to be associated to the element.
    Type the first letter of the attribute to scroll down the list more rapidly.

  12. If the attribute requires a value, the field is activated. You can specify the value to be represented. This option is not mandatory.

  13. In the Sheet area, enter a name to identify the sheet you are editing.

  14. Click on the OK button.

  15. If needed, add other leaves to the element.

  16. Once you have finished, click on the Close button.

If you return to our initial example, you must create a Heading node, to which you will associate a leaf using the H2 tag and the CLASS attribute. This will give you a result similar to the one previously mentioned.


Visual Explorer

Visual Explorer is displayed in the Resources window. It visually displays your HTML document's internal and external links (with image files, sound files, other HTML documents or to internal destinations).

  • Valid links are represented as blue lines.

  • Broken links are represented by red lines.

  • References are identified with their respective icons.

  • The active document is in the center of the display.

Visual Explorer also lets you manipulate certain elements.


Working with the Visual Explorer

The Visual Explorer lets you have quick access to specific places in a document. On the other hand, if you work with many open documents, the explorer lets you shift between one document and the other after checking each one.

To shift between one document and another in the Visual Explorer window:

  • To bring back one of the documents consulted prior to the active document, click on the Forward button.
    You can also use the command Forward of the context menu.

  • To go to a document you had consulted after using the active document, click on the Backward button.
    You can also use the Backward button of the context menu.

To access a code position in the edit window:

  • On the Visual Explorer, double click on the code to search for.
    You can also use the Go to command of the context menu.

If the reference is repetitive, its name is displayed in parenthesis. Click as many times as necessary until the appropriate line is reached.

The edit window area scrolls until the code line is found.

To refresh the display of the Visual Explorer:

This command is useful if you have made many changes in your document and you want to be assured that the Code Explorer correctly displays changes.

  1. In the Visual Explorer window, click on the right mouse button.

  2. In the context menu, click on the Update option.

To print a document:

You can print HTML documents directly from the Visual Explorer.

  1. In the Visual Explorer window, click on the active document.

  2. Click on the Print option of the context menu. The Print dialog box will appear.


Editing links

The Visual Explorer lets you edit links in three ways:

  • by deleting the link and the source file,

  • by renaming a link,

  • by editing the nodes which will be displayed in the Code Explorer.

To delete a link:

  1. In the Visual Explorer window, click on the link to be deleted with the right mouse button.

  2. With the right mouse button click on the Delete option. The dialog box Confirm deletion of reference will appear. It proposes four choices.

Delete links | This option lets you delete the selected link without affecting the referenced file.
Delete file | This option lets you delete a file without deleting the link. When deleting a folder, AceHTML will ask you to confirm the deletion. Please note that this option could create a broken link in your document.
Delete links and file | This option lets you delete the link and reference file at the same time. When deleting a folder, AceHTML will ask you to confirm the delete action.
Cancel | This option lets you cancel the ongoing operation.

To rename a reference:

If you rename a reference within the Visual Explorer window, this change will be reflected in the edit window.

Therefore, if you change an internal link in the Visual Explorer window, all the elements of the document being edited will reflect such a change. Always be careful when verifying changes: if the internal address (in the case of this example) does not exist, the link will not be valid. Likewise, if you change the name of an image, make sure that the name of the source folder is also renamed in the Files Manager.

  1. In the Visual Explorer window, click the right mouse button on the leaf to be renamed.

  2. In the context menu list, click on the Rename option.

  3. The name of the leaf will be highlighted. Make the desired correction in the field.

All the lines in the edit window containing this reference will be changed.

To edit nodes:

  1. With the right mouse button, click In the Visual Explorer window.

  2. In the context menu list, click on the Edit node.

  3. Make the desired changes.


Checking dead links

Using Visual Explorer you can evaluate the integrity of links and if necessary, delete them.

  1. Click on the right mouse button on the Visual Explorer window.

  2. Click on Display Dead Links. The Display Dead Links window is displayed.

  3. You can select the links you want to remove from the list of dead links.

When you delete a link from this window, every reference to it in the document is deleted.

The Display Dead Links window has the following buttons to select and delete dead links:

Select All | Select all the links displayed in the list.
Unselect All | Cancel the selection of all links previously selected.
Delete | Delete the links selected. The selected links are identified by a check mark in the adjacent box. A message is displayed requesting confirmation.
Delete All | Delete all the dead link found on the list, whether or not they are selected. A message is displayed requesting confirmation.
Print | Displays the Print dialog box so that you can print the list of broken links..
Close | Close the Display Dead Links window.


Code Snippets Library

The Code Snippets Library is displayed in the Resources window. This function lets you create a personalized code list that you can insert in your document. Personal codes can be classified by category, programming language, etc.

  1. Select the command Display|Display Code Snippets Library.
    You can also use the shortcut key SHIFT + F8. (See the List of Shortcut Keys).

Displaying the Code Snippets Library

The element Library Code Snippets displays a tree, containing the list of all folders and subfolders you have created and their codes.

Creating a folder

  1. Select the folder in which you want to create a subfolder.

  2. Enter the folder name in the dialog box New Folder.

Adding a code to the library

  1. Place your cursor on the file, or class the code, then click on the button Add an Item.
    The dialog box Item Properties opens.

  2. Enter a name in the dialog box Item Name.

  3. In the zone Text to Insert before Selection, enter the text you want displayed in front of the selected content in the Edit Window (at the start). E.g.: for HTML or XML code, enter the start tag.

  4. In the zone Text to Insert after Selection, enter the text you want displayed following the selected content in the Edit window (at the end).
    E.g.: for HTML or XML code, enter the end tag.

  5. Check the box Do Not Overwrite Selected Text, to ensure the selected content is not deleted once you insert code.

  6. Click on OK to save the code.

Inserting a Library Code in the document

  1. In the Edit window, select the text you want inserted within the code.

  2. In the Code Snippets Library window, select the code to insert.

  3. Click on the Insert in Document button.
    The text is now inserted within the text preceding and following the selection.

Deleting and editing a library code

  1. Select the code to be modified.

  • Click on Delete to delete the code.

  • Click on the Properties button to modify the code.

  • Move the code by dragging it to another folder.


Reference Editor

The Reference Editor allows you to edit the tags and rules most frequently used in the creation of an HTML document easily: the HTML tags, the rules governing Cascading Style Sheets (CSS), XML objects, WML tags, JavaScript, SSI, as well as the Active Server Page (ASP) scripts.

Not only can you modify reference properties with the Reference Editor, you can also add and delete them. The markers defined here are used by the Code Inspector.

To display the Reference Editor:

  • From the Syntax menu, select Reference Editor.

The Reference Editor window appears. With its toolbar and menu bar, the Reference Editor works like an autonomous application.


Reference Editor Menu Bars

File | With this command you can Open and Save or Restore reference files.
Edit | With this command you can edit an object (a new reference)and its attributes, and manage their properties
Types | With this command you can modify the type of reference
Options | With this command you can modify the display colors
Help | Gives you access to the Help topics related to the Reference Editor.


Toolbar

Open | Allows you to open a reference file. The arrow gives you access to the type of reference files available.
Save | Allows you to save changes made to a given section.
 | Allows you to save all changes made to all the sections.
 | Allows you to add an attribute to the selected reference.
 | Allows you to delete a reference row.
 | Displays a new section on the extreme right of the Reference Editor window, allowing you to consult and modify properties.
 | Opens the reference type so you can make changes.
 | Displays the New Type Wizard that will assist you in the creation of a new reference type.
 | Displays the reference type list and related properties.


Using the display

The Reference Editor display classifies references by section. Codes are presented in a tree structure that, once unfolded, displays the list of attributes. Each reference section is identified by a specific color.

  • Click on the + (plus) sign to display the contents of that section or reference code.

  • Click on the – (minus) sign to hide the contents of that section or reference code.

You can then modify the reference type or compatibility directly on the grill by clicking on the desired information. An arrow will appear at the extreme right of the cell to display the list of possible choices.

You can also modify the display colors.


Colored Sections

The Reference Editor displays the table sections by color to make it easier to identify the information quickly.

  • From the Tools menu, select Colored Sections.

If you remove the check mark corresponding to this option, display colors will be disabled. At this point, the sections are displayed in gray.


Reset Reference Files

Resetting the reference files means restoring the references' default values.

  • From the File menu, select Revert.

A confirmation message is displayed. Click on Yes to restore files. If you click on No, no changes are made.


Open Reference Files

This option allows you to open a specific reference file.

  1. Display the Reference Editor.

  2. From the File menu, select Open to display the list of available references.
    or
    Click on the Open icon on the Standard toolbar on the Reference Editor to display the list of available references.

  3. Click on the desired reference. The Open dialog box appears.

  4. Select the desired file and click on the Open button.

In the File Type area, you can choose All reference files to select another type of file.


Saving Reference Files

You have two options for saving the changes you made to the reference files:

  • Save changes for a single selection.

  • Save changes for all selections at the same time.

To save the changes made to a section:

  1. From the File menu, select Save to display the list of available sections
    or
    Click on the Save icon on the Standard toolbar.

  2. Click on the desired reference.

To save the changes made to all sections:

  • From the File menu, select Save All (You can also use the keyboard shortcut CTRL+ALT+F5 – refer to list of shortcuts).

To save the changes to the reference file under another name:

  1. From the File menu, select the option Save as.

  2. From the list of file types, select the type you want.
    The Save as dialog box is displayed.
    By default, AceHTML displays the same name of the original reference file.

  3. In the Name area, enter a new name.

  4. Click on the Save button.


Editing Code

This option allows you to add an object to any of the sections.

Objects are named according to their function in their respective sections:

  • ASP, CSS, HTML, JavaScript, PHP, SSI, WML, XML.

  1. Display the Reference Editor.

  2. From the Edit menu, select Add to display the list of choices.
    You can add an HTML or WML tag, a CSS rule, an SSI commando, an XML object or a JavaScript function.

  3. Click on the type of reference to be modified.
    The Add dialog box is displayed.

  4. Enter a name to identify the object you want to create in the text box.
    If you add an HTML tag, you must indicate the opening and closing tag (optional or mandatory).

  5. Click on the OK button.
    A line is automatically added for the type of object you created. The list is displayed according to the alphabetical order of objects. A first line is available to add an attribute.

You can now add an attribute to the new element and modify its properties.


Add attributes to an object

This option allows you to make changes to a reference code's supplementary attribute.

  1. Display the Reference Editor.

  2. Select the desired section and tag.
    The new attribute is added on the row above the cursor's position.

  3. Click on the row which will follow the new attribute.

  4. From the Edit menu, select Add Attribute
    Or
    Click on the     Add attribute icon on the Reference Editor toolbar. (You can also use the keyboard shortcut SHIFT+CTRL+A. Refer to the list of shortcuts).

  5. In the Attributes column, enter the attribute you want to add.

  6. In the Type column, click on the cell to display the arrow which gives you access to the list of choices. Select the desired type.

  7. In the Compatibility column, enter the organization which recognizes this attribute. If you are uncertain, or if it's a customized code or attribute, click on the N/A option.

You can now modify the reference properties.


Delete Attribute

This option allows you to delete an attribute.

  1. Click on the line that contains the attribute you want to delete.

  2. Select the desired section and tag.

  3. From the Edit menu, select Delete.
    Or
    Click on the Delete icon on the Reference Editor toolbar. (You can use the keyboard shortcut SHIFT+CTRL+D. Refer to the list of shortcuts).

  4. A confirmation message appears. Click on the Yes button to delete.

If it’s a unique attribute, deleting it may imply deleting the associated object.


Reference's properties

This option adds a section to the HTML Syntax editor display on the window's extreme right when you work on the HTML and WML tag section, ASP commands and XML objects.

Once the Properties command is run, the properties windows is permanently displayed. If it is not, it means that no property can be associated to the selected object. When you select an object that can contain a property, then the window automatically reappears.

  • Tag properties of HTML, WML and XML documents

  • Attribute properties of HTML, WML and XML documents

  • Operator properties of ASP, JavaScript, PHP scripts

  • Operand properties of ASP, JavaScript, PHP

To modify a tag’s properties (HTML, WML and XML):

  1. Click on the row which contains the attribute you wish to check or modify.

  2. From the Edit menu, select Tag Properties.
    or
    Click on the Tag properties icon on the Standard toolbar. (You can also use the keyboard shortcut CTRL+P. Refer to the list of shortcuts).

  3. Indicate the attribute's properties.

Attribute properties:

Tag name | Name of the HTML tag being edited.
Mandatory opening tag | If checked, this option is used to allow the start tag to be optional. This option is only available if the end tag is also optional.
Closing tag | Mandatory: if you want the closing tag to be mandatory. Optional: if you want the closing tag to be optional. Forbidden: if you do not want a closing tag.
Compatibility | Define the level of compatibility of the tag and the standard properties.
Open tags in the tag must be closed inside the tag | Indicate the order of closing tags.
Do not indicate the text inside the tags | Indicate the interpretation mode of text.
Structure elements | List of elements that define the structure of a HTML document.
Parent elements | List of parent elements.
Equivalent elements | List of elements that are not parent elements.
Reset | Restores the default values for the attribute or the tag, whichever the case may be.

To modify the properties of an HTML tag:

  1. Click on the row which contains the tag which you want to consult or modify.

  2. From the Edit menu, select Display Properties
    or
    Click on the Tag properties icon on the Standard toolbar. (You can also use the keyboard shortcut CTRL+P. Refer to the list of shortcuts).

  3. Specify the tag's properties.

Attribute properties (HTML, WML and XML) :

The attribute is mandatory | This option allows you to specify that the attribute is mandatory.
The attribute is an URL address | This option indicates that the attribute is a URL. For example: SRC for an image. Loaded with document allows you to automatically load the document to which the URL refers to.
URL Base attribute | Identifies the attribute's base code.
Anchor attribute | Allows you to specify that the attribute is anchored inside the document.
Reset | Restores the default values for the attribute or the tag, whichever the case may be.
Defining several tags | Click on this button to modify the values of an attribute and associate these changes to several tags. The list of HTML is displayed. Add or remove the checkmark from a tag to modify the association.

To modify the operator properties (ASP, JavaScript, PHP) :

  1. Click on the line containing the operator that you want to change.

  2. From the Edit menu, select Tag Properties
    or
    Click on the button Tag properties from the Standard toolbar. (You can also use the shortcut CTRL+P.
    Refer to list of shortcuts).

  3. Indicate the tag properties.

The properties of the ASP, JavaScript and PHP operators are:

Name | Name of the operator being edited.
Description | Description of the object being edited. This is merely information.
Template | Libraries of definitions (classes) associated to the operator being edited.
Folder | Folder with classes that contains the Template.
Restore | Restore tag attributes default values accordingly.

To modify the properties of operands (ASP, JavaScript, PHP):

  1. Click on the line containing the attribute that you want to check or change.

  2. In the Edit menu, click on Tag Properties.
    or
    Click on the button Tag properties on the Standard toolbar. (You can also use the shortcut CTRL+P. Refer to list of shortcuts).

  3. Indicate the attribute properties.

Properties of the ASP, JavaScript, and PHP operands:

The operand is optional | This option allows you to specify that the attribute is mandatory. When you check this box, the two adjacent fields are enabled. Indicate the Prefix and the Suffix.
Text box | Enter the operand’s value.
Restore | Restore the tag or attribute’s default values accordingly.


Compatibility editor

To make the reference syntax verification easier, it is important to define the level of compatibility with the browsers.

The available options are the following:

HTML Standard | Unmodified HTML code is generally interpreted by the most commonly used browsers such as Internet Explorer and Netscape.
Microsoft Internet Explorer | References interpreted by Internet Explorer without problems.
Netscape Navigator | References interpreted by Netscape without problems.
HTML W3C 4.01 Specifications | References for which the Web standard has been determined by the Web Consortium (W3C). These references are usually interpreted by the two most popular browsers.
Obsolete | References no longer used by browsers.
W3C XHTML 1.0 | References for which the Web standard has been determined by the Web Consortium (W3C). These references are usually interpreted by the two most popular browsers.
WAPForum WML 1.0 | References related to programming for wireless services.

Modifying a reference's advanced compatibility properties:

  1. Display the Reference Editor.

  2. From the Edit menu, select Advanced compatibility.

The Compatibility Editor window is displayed in the form of an application window. A menu bar and a toolbar provides you quick access to the available commands.

File – Open | Allows you to open a Compatibility reference file. The file used by AceHTML is named compat.ref.
File – Save | Allows you to save the changes made to the compatibility file.
File - Save As | Allows you to save the changes made to the compatibility file under another name. This command is useful if you keep the original file in memory.
Edit - Add row | Allows you to add a new reference.
Edit - Delete row | Allows you to delete a reference.


Reference Type Editor

AceHTML's Reference Editor allows you to modify an existing reference or to create a new type.

To modify a reference type:

  1. Display the Reference Editor.

  2. Click on the row which contains the type you wish to modify.

  3. From the Type menu, select Edit Type
    or
    Click on the Edit type icon on the Standard toolbar. (You can use the keyboard shortcut CTRL+E. Refer to the list of shortcuts).

  4. The Properties dialog box appears. It displays the name of the type you selected previously.

The dialog box contains three tabs which allow you to define the properties for the types:

Type definition | In this tab you can select the data type used for checking.
Type Values | This tab changes according to the type being edited. It allows you to define the special parameters that refine the checking of data associated to the reference.
Dependent Types | This tab allows you to assign a dependent to a reference type.

To create a new reference type:

To create a new type, the Reference Editor suggests the use of the Type Editor Wizard.

  1. Display the Reference Editor.

  2. From the Type menu, select New Type.
    or
    Click on the New Type icon on the Editor's toolbar. (You can also use the keyboard shortcut CTRL+Ins. Refer to the list of shortcuts).

  3. The Wizard's first step appears. Indicate a name and a description for the new type you are creating.

  4. In the second step, the Wizard asks you to define a value for the new type. Depending on the selected value, the display for the third step will change to allow you to define the necessary parameters.

  5. In the Wizard's third step, complete the information required to define the behavior of the type.

  6. Click on the Finish button.

You can also edit a new reference type using the Reference Type display


Show Reference Types

The list of reference types is displayed in the form of an application window. From this display, you can browse the set of types which belong to the different categories.

To display the list of reference types:

  • In the Reference Editor toolbar, click on the Show Types icon. (You can use the keyboard shortcut CTRL+T. Refer to the list of shortcuts).

The List of Types display gives you the following options:

Save | File Menu-Save | This option allows you to save the new types which you have defined.
 | Edit-New Type | This option allows you to edit new reference types with the help of the Wizard.
 | Edit-Delete | This option allows you to delete a reference type.
 | Edit-Show Properties | This option allows you to modify the reference type properties .


Code Optimizer

This function lets you clean up documents, so that codes and scripts are clearer and work better. You can apply changes to a unique document or to several documents.

  1. In the Tools menu, click on the option Code Optimizer.
    The dialog box     Code Optimizer opens. A unique document is selected by default.

  • To apply changes to several documents, click on the tab Several documents.

The top part of the dialog box offers different options, depending on whether you are working on a unique document or several documents.

  2. Specify the optimization options you want to apply, according to the four tabs at the bottom:

  • Compression options: lets you clean up codes, deleting information that appears superfluous (e.g., comments).

  • Beauty options: lets you clean up the text, for e.g., by removing spaces or useless page breaks.

  • Special Characters: lets you convert the characters on your page into special characters, or vice versa.

  • File Conversions lets you convert the codes in your document.

3. Click on Start to display defined optimization options.
To stop this process, click on Stop. Note that any changes made to codes will remain.

4. Click on Close to close the dialog box.

Applying changes to a unique document

  1. Click on Unique document in the dialog box.

  2. Click on Open to select the document you want to modify.

  3. To make a backup copy, click on Save and rename the file.

  4. Specify the optimization options you want to apply, according to the four tabs at the bottom.

  5. Click on Start to begin the optimization process.

Applying changes to several documents

1. Click on Several documents in the dialog box.

2. Define file options with the following parameters:

Backup modified files | Activate this option to make backup copies of files before optimizing them. In this case, AceHTML generates as many files as there are optimizations, saving them with a .bak extension.
Apply first on open files | Check this box to give priority to open files. This option should be used to do a search on several files (for example, files in a directory or project).
Apply to: |
Specified files | This option lets you modify only the selected files. Activating this option will transform the dialog box. Click on Add to select the files you want to modify. Click on Restore to erase all previously selected files.
Search all files in project | This option lets you modify all the files in a project. The files must be open before you can start the optimization process. This option is only available if the file belongs to a project, and the latter is open.
Search in directories | This option lets you modify all the files in a specific directory.
Search Options | This zone is refreshed according to the type of search specified, thereby allowing you to select the appropriate files, projects and directories.
Directory to Search | This option is displayed when you choose the Search in directories option. In the field, select the directory containing the files to be modified.
Search in all documents opened | This option lets you modify only those files opened in AceHTML. When you select this option, the Search Options zone is disabled.
Include subdirectories | This option is displayed when you choose the Search in directories option. Checking this box will apply the changes to all files and subdirectories in the selected directory.
File masks | Select the type of file to which you want to apply a filter. Modifications will only be done on files corresponding to the selected mask.

  3. Specify the optimization options you want to apply, according to the four tabs at the bottom.

  4. Click on Start to begin the optimization process.

Compression options

This tab lets you define options that can clean up your document by deleting certain items that are not useful until you are at the page editing stage.

Compression options only apply to items in your Edit Window, and do not change how the browser displays your document.

Strip Carriage Returns (#10 and #13)

Check this box to delete all empty lines from the Edit Window. The sub-options are then activated:

  • All Carriage Returns: deletes all carriage returns in the Edit Window.

  • Extra Carriage Returns (more than 1): deletes only double returns.

Strip Tabs

Check this box to delete all indents from the Edit Window.

Strip HTML Comments

Check this box to delete all comment lines (preceded by the tag <- - comment - - >).

Strip Extra Spaces

Check this box to delete all space characters from the Edit Window, thereby leaving only one space between words and codes.

Strip Script Comments

Check this box to delete all comments on special scripts included in the document (preceded by the tag <!-- start of script and ending with // end of script -->).

Custom Remove

Check this box to delete code you have created. Example: to identify document sections.

Nearby zones are activated when this box is checked:

  • Start with: indicates the expression at the beginning of tags or codes to be deleted; to delete a style class, for example, enter <h1 class=" myclass" >.

  • End with: indicates the expression at the end of tags or codes to be deleted; as indicated above, enter <h1 >.

Skip ASP/PHP tags

Check this box to skip document sections created with ASP or PHP scripts.

Strip HTML tags

Check this box to delete all HTML tags in the document. This function is useful when you want to ensure there are no HTML tags in a document in a language other than HTML (JS, ASP, PHP).

Skip HTML tags

Skips HTML tags. This function is useful when the optimized document was created using several languages.

Beauty options

This tab lets you define options to improve the esthetics of your document in the Editor window. Having a clean, well laid out document at the editing phase will make it easier for you to find information.

Strip Carriage Returns more than:

To ensure all paragraphs in the document are evenly spaced, check this box and indicate how many carriage returns (or line returns) you want. All extra carriage returns will be deleted.

Strip Spaces more than:

To ensure consistency as to spaces between words, check this box and indicate how many spaces you want. All extra spaces will be deleted.

Strip Spaces after EOL

Check this box to delete all extra spaces at the end of text lines.

Align Code with Tabs

Check this box to ensure visual balance of the document, through tabs in front of line blocks. Nearby zones are activated when this box is checked:

  • Use Spaces: check this box to use spaces rather than tabs.

  • Tab Value: indicate the desired indent value (as a number of characters).

Convert HTML to XHTML

Check this box to convert all document tags and codes to XHTML. Checking this box will activate the adjacent box:

  • Wrap scripts: check this box to convert JavaScript codes.

  • Skip ASP/PHP tags: activate this option to skip these tags.

Tags in lowercase

Check this box to convert the case of characters in tags. All recognized tags with characters in upper or mixed case (upper and lower) will be transformed into lower case.

Attributes in lowercase

Check this box to convert the case of characters in attributes. All recognized tag attributes with characters in upper or mixed case (upper and lower) will be transformed into lower case.

Quote attribute values

Check this box to add quotation marks to all attribute values.

Special Characters

This command lets you convert all special characters (é, à, î, etc.) in the HTML code document. This command is particularly useful for Web designers creating sites for use on older browser versions. For more recent versions (as of versions 4 of Internet Explorer or Netscape), this command is not necessary.

Conversion of special characters | If your Edit Window includes special characters, check this box to convert normal characters into special characters.
Return to normal characters | If your Edit Window includes special characters, check this box to convert to convert them into normal characters.
Special characters in decimal numbers | This option lets you display all special characters in decimals. Example: The character é = &eacute, a special character, becomes &#233, a special character in decimals.

Text in comments will not be affected by this conversion.

Example of normal characters converted into special characters

This special character tab lets you enter the characters directly in the Editor window.

File conversions

This tab lets you modify the case of certain document codes, as well as modify the direction of separators.

Convert to lower case

Convert to upper case

The case modification is applied to the identification accompanying a tag attribute. For example, all of a document's align="center" attributes can be automatically converted: align="CENTER".

Activate the option corresponding to the conversion you want to do.

Separator Conversion

All separator conversion options are disabled by default. You can command the automatic conversion of all separators in your document, according to whether your site will be on a local network or server.

  • Convert separator from '\' to '/': used for relative addresses, for example, for working on a local network.

  • Convert separator from '/' to '\': used for absolute addresses, for example, for working on a remote server.

None of these conversions modify the document itself.

Attributes to check

lets you select the attributes to be converted.

  • Add: click on this button to add an attribute. The dialog box Add an Attribute opens. Enter the name of the attribute to modify in the Attribute field (example, align).

  • Remove: click on this button to delete the attribute previously selected from the list Attributes to check, and ensure it is not converted.

  • Restore: click on this button to revert to AceHTML's default values. By default, AceHTML only converts the attributes href and src.


Indent Right

With this command you can move a line of text or HTML code to the right. Adding indents makes it easier to view lines of text and tags of HTML documents in the edit window. This command does not have any effect on how the page will be displayed in browsers on the Internet.

  1. Select the line (or lines) of text or HTML code that you want to indent to the right ;

  2. On the Edition toolbar, click on the Indent right option
    or
    From the Edit menu, select Indent Right. You can also use the shortcut CTRL+TAB (Refer to list of shortcuts).


Indent Left

With this command you can move a line of text or HTML code to the left. This move can only be made on a line of text or HTML code already indented to the right, or to move one or more tabs to the left. The result is displayed in AceHTML's edit window, but it has no effect on how the page will be displayed in browsers on the Internet.

To indent a line (or lines) of text or HTML code to the left:

  1. Select the line (or lines) of text that you want to move to the left ;

  2. On the Edition toolbar, click on the Indent Left option
    Or
    From the Edit menu, select Indent Left. You can also use the shortcut SHIFT+CTRL+TAB (Refer to list of shortcuts).


Tag properties

Looking up the properties of the tag is the same as editing the tag to carry out modifications since it calls up the dialogue box used to create the command line.

  1. Place your cursor at the beginning of the tag you want to look at.

  2. Click the right mouse button to display the context menu.

  3. Click Tag properties.

The dialogue box that corresponds to the tag being modified will appear. Modify the options.

  • You can also use the Alt+Enter keyboard shortcut (See the list of keyboard shortcuts).


Select a Tag

To select a tag, you must include in your selection the start tag and the end tag as well as all the information they contain. With certain code, this can be tedious work.

AceHTML has a command which allows you to quickly select the entire contents of an HTML command.

  1. Place the cursor on the start tag of the command that you wish to select.

  2. From the Edit menu, select the command Select tag.
    or
    Select the command Select tag from the context menu.

AceHTML highlights the corresponding start and end tags as well as the content.


Clear tags

This command is used to automatically delete the tags found in the selected text. You can also delete one tag only.

  1. Select the text.

  2. Then, from the Edit menu, select the command Clear Tags.

If you haven't selected any text and you select the option Clear Tags from the Edit menu, a message will appear: "Do you want to clear the tags in the whole document? (Otherwise select the text) ".

To clear the Clear Tags command, simply press the Cancel from the Edit menu.


Delete Tag

To clean up a document, it's possible you may have to delete HTML tags included in it. You can delete all tags included in a document. At this point, you have to restart from the beginning. It is also possible to delete just one particular tag.

  1. Select the command Code Optimizer from the menu Tools.

  2. Select the check box Apply to current document.

  3. In Custome remove, enter the Start and End tags to delete. If you want to delete all tags, select < as the start and > as the end tags.

  4. Press on button Start.


External Interpreters

If you want to use an external interpreter with AceHTML, you need to download and install one of these interpreters:

  • Interpreters for PHP language

  • Interpreters for PERL language

  1. In General Preferences | External Interpreters, enter the path to the PHP or PERL external interpreter or press on the button to browse to its folder.

  2. You can also specify specific parameters that you want to pass to the parser.

  3. Close the General Preferences and open your PHP or PERL file.

  4. In the menu Tools, launch the PHP or PERL external interpreter.


Check Online Links

The check and evaluation commands for documents and projects let you do complete tests on your pages. To ensure that your documents are in working order, you can check the integrity of links with the command Check Online Links.

All of the links are checked: to image files and external script files (JavaScript, CSS, …), external hyperlinks (internal to your site, or external to Internet).

  1. In the Syntax menu, click on the option Check Online Links or click on the button Check Online Links in the Standard toolbar.
    When you execute a command by clicking directly on the option, the option checked in the list (with arrows) is the one that will be executed     (namely the last one to have been executed). You have three options:

Check Online Links | Displays the dialog box Link Validator, which lets you select the documents you want to check.
Check Online Links in Document | This command is only available if at least one document is open. The local address of the current document is automatically selected, and displayed in the dialog box Link Validator. You can also add files to be checked.
Check Online Links in Project | This command is only available if a project is active. Local addresses for project documents are automatically selected and displayed in the dialog box Link Validator. You can also add or remove files to be checked.

  • To execute a specific command, click on it, using the arrows.

  2. Add the URL files you want to check.

  3. You can modify the check preferences at any time by clicking on Options.

  4. Start the check by clicking on Check.
    The dialog box is extended downwards, to display the list of checked files and results.

Link Validator dialog box options

Add File(s)

Click on this button to add files to be checked. The Add File(s) dialog box opens.

Add URL

Click on this button to add a Web address to be checked. The dialog box Web Address opens. Enter the address to be checked in the URL zone, and click on OK to start the check.

Up and Down arrows

Documents are checked in the same order in which they appear in the list in the Document zone. Use the up and down arrows to change the order.

Select a document in the Document zone, then click on an arrow, depending on whether you want to move it up or down.

Remove

Click on this button to remove a document from the list. Select the document you want to remove from the list in the Document zone, then click on the button Remove to remove it from the list of documents to check.

Summary

This zone is informative. The data displayed provides information on the checks for all documents and URLs listed in the Document zone.

Check

Click on this button to start the check. The check results are displayed in the bottom section of the dialog box.

Stop

Click on this button to stop a check in progress. If a check is stopped, the button will be labeled Resume. Click on it to continue with the check.

Report

Click this button to obtain a report on the completed check.

A new window will open, containing the check report. You can save the report as a .txt file and print it.

Options

Displays the dialog box Checking Options, which lets you change the parameters for checking links.

Check results

When the check process starts, the dialog box Link Validator extends downwards, to display the results of each check done.

You can also access additional functions with the pop-up menu in the results zone.

A number of columns in the results zone offer information on the check:

URL | The name of the item (image, script) or URL that was checked.
Document | The address of the document containing the item or URL checked.
Line | The line number where a broken link is located.
Answer (ms) | Response time, in milliseconds.
Pass | The number of connection attempts before the check can be completed.
? | Results displayed as icons. Four icons are used: indicates that the link is good. indicates that the link is broken. indicates that the link could not be checked. indicates that the link could not be found with the time delay specified in the Checking Preferences.
Checked | The date on which the check was done.

Results List

The pop-up menu lets you manipulate the list of results. The following commands are available:

Open Link | Displays the selected link in the browser window. You can also double-click on a line to display the document.
Retest Links | Do a new check on a selected link.
Save Content | Lets you save the results in a text file. The dialog box Save File opens.
Copy to Clipboard | Copies the address of a selected link to the Windows clipboard.

Checking Preferences

You can change the parameters applied by AceHTML when checking links, among these the response time for an Internet connection.

To access the options:

  • Once the dialog box Link Validator is open, click on Options.

The Checking Preferences dialog box opens. You can change the following parameters:

Time to wait for response

In this field, indicate what you feel is a reasonable time during which AceHTML should continue trying to obtain a response. The delay must be indicated in seconds.

Number of passes on failure

In this field, indicate the number of times AceHTML is authorized to attempt to connect.

Delay between passes (ms)

In this field, indicate the time that must elapse before AceHTML can make another attempt. The maximum number of attempts is indicated in the field Number of passes on failure. The delay must be indicated in milliseconds.

Lazy threshold

In this field, indicate the time that must elapse before AceHTML receives a connection confirmation. The delay must be indicated in milliseconds.

Skip links checked last days

This amount of time is used to limit the days between checks. If the document listed has been checked within this time (in days), AceHTML will not do the check.

Maximum simultaneous checks

In this field, indicate the number of checks that AceHTML can do simultaneously. The greater the number of checks, the slower the process may be.

Mask

You can remove a certain file type from the check. In the dropdown list, select the file types for which you do not want the links to be checked.

Check relative links

Relative links point to a specific location. Check this box to include them in the check.

Move to next link on every trial

Check this box to check the next identified link if the number of attempts specified in the field Number of passes on failure is reached.

Attributes

You can add HTML attributes, to extend the check to other types of items.

Click on Add to open the dialog box Add an attribute, and enter the attribute to be added in the Attribute zone.

Click on Edit to modify an attribute selected in the list. The dialog box Add an Attribute opens, enabling you to make the desired changes. Click on Remove to remove a selected attribute from the list.

Restore

Click on this button to revert to AceHTML's default checking preferences values.

Close

Click on this button to close the dialog box and save all changes.


Check Document

This command allows you to check the HTML syntax of an HTML document.

  • Open the document you want to check.

  • From the Syntax menu, select Check Document. You can also use the shortcut CTRL+F9 (Refer to list of shortcuts).

The Syntax Checking dialog box appears. You will find the following information there: the current line number, the total number of warnings, the total number of lines in the document, and the total number of errors.

On the bottom of the edit window a small window appears which lists the errors and the warnings found during the syntax check. This window displays the name of the document, the line number and the description of the error or warning.

This icon is displayed when many errors are found in the document.

This icon indicates that an error was found in the identified document.

This icon indicates the presence of a warning message in the identified document

  • You can double click on the error or warning line in order to go directly to the line where the error is indicated in the document.

  • To close the error and warning message window, click on the X located on the left.


Check All Documents

This command allows you check the HTML syntax of the documents opened during an AceHTML session.

  • Open the documents you want to check.

  • From the Syntax menu, select Check All Documents.

The Syntax Check dialog box appears and displays the current line number, the total number of warnings, the total number of lines of all the open documents, and the total number of errors.

On the bottom of the edit window a smaller window appears which lists the errors and the warnings found during the syntax check. This window displays the name of the document, the line number and the description of the error or warning.

This icon is displayed when many errors are found in the document.

This icon indicates that an error was found in the identified document.

This icon indicates the presence of a warning message in the identified document

  • You can double click on the error or warning line in order to go directly to the line where the error is indicated in the document.

  • To close the error and warning message window, click on the X located on the left.


Check Project

This command allows you to check the HTML syntax of all the HTML documents that are part of the project.

  • Open the project on which you want to perform the syntax check.

  • From the Syntax menu, select Check Project.

  • The Syntax Checking dialog box appears and displays the current line number, the total number of warnings, the total number of lines of the project documents, and the total number of errors.

On the bottom of the edit window a smaller window appears which lists the errors and the warnings found during the syntax check. This window displays the name of the document, the line number and the description of the error or warning.

This icon is displayed when many errors are found in the document.

This icon indicates that an error was found in the identified document.

This icon indicates the presence of a warning message in the identified document

  • You can double click on the error or warning line in order to go directly to the line where the error is indicated in the document.

  • To close the error and warning message window, click on the X located on the left.


Evaluate Document

Document evaluation consists of evaluating its performance and indicating:

  • The weight of the HTML document,

  • The weight of the HTML document taking the links into account

  • Evaluation of the transfer speed taking into account the speed of different modems.

  • Inventory of the errors in the document and of non valid links. If there are errors and non valid links, it will be necessary to perform a document check to find out the details.

  1. Display the file to be evaluated.

  2. From the Syntax menu, select Evaluate Document. You can also use the shortcut CTRL+F6 (Refer to list of shortcuts).

The File Evaluation dialog box lists the total number of open files, the total size of the documents, the number of valid links, and the number of non valid links.

On the bottom of the edit window a small window appears which lists the errors and the warnings found during the check. This window displays the name of the document, the line number and the description of the error or warning.

This icon indicates that a problem was detected in the identified document.

This icon indicates that no problems were detected in the identified document.

  • You can double click on the error or warning line in order to go directly to the line where the error is indicated in the document.

  • To close the error and warning message window, click on the X located on the left.


Evaluate All Documents

Document evaluation consists of evaluating its performance and indicating:

  • The weight of the HTML document

  • The weight of the HTML document taking the links into account

  • Evaluation of the transfer speed taking into account the speed of different modems.

  • Inventory of the errors in the document and of non valid links. If there are errors and non valid links, it will be necessary to perform a document check to find out the details.

  1. From the Syntax menu, select Evaluate All Documents.

The Evaluating Files dialog box lists the total number of open files, the total size of the documents, the number of valid links, and the number of non valid links.

On the bottom of the edit window a smaller window appears which lists the errors and the warnings found during the check. This window displays the name of the document, the line number and the description of the error or warning.

This icon indicates that a problem was detected in the identified document.

This icon indicates that no problems were detected in the identified document.

  • You can double click on the error or warning line in order to go directly to the line where the error is indicated in the document.

  • To close the error and warning message window, click on the X located on the left.


Evaluate Project

Document evaluation consists of evaluating its performance and indicating:

  • The weight of the HTML document

  • The weight of the HTML document taking the links into account

  • Evaluation of the transfer speed taking into account the speed of different modems.

  • Inventory of the errors in the document and of non valid links. If there are errors and non valid links, it will be necessary to perform a project check to find out the details.

  1. Open a project.

  2. From the Syntax menu, select Evaluate Project.

This icon indicates that a problem was detected in the identified document.

This icon indicates that no problems were detected in the identified document.

  • You can double click on the error or warning line in order to go directly to the line where the error is indicated in the document.

  • To close the error and warning message window, click on the X located on the left.


Document header properties <META>

With this menu you can add a title and a description to your document and also indicate the author. The title is the text that appears in the title bar of the browser. By default AceHTML inserts the name to whom the program is registered, i.e. the user.

Most of the information is useful to identify the document with search engines and it complements other header information, specially the keywords necessary to make reference to your site, relation links which allow you to establish links between documents, and the documents’ base URL.

The command Meta associates your HTML document with header information that will be read by the http server. This information serves to identify the name of the document (NAME), the name of the author (AUTHOR), the content (CONTENT) and a directive HTTP-EQUIV. META is used in the header section (HEAD) of the document. This command is used by search and indexing engines.

This command allows you to define different options in the document header:

  • The title and the meta general information of the document (description and keywords)

  • Relation Links

  • The Site’s URL base

To indicate or modify the header properties of the document:

  1. On the Specialized tab, click on the button Header properties. You can also use the shortcut Shift+ALT+D (Refer to list of shortcuts).

  2. Click on the Title and Meta tab.

  3. Enter the necessary information.

AceHTML inserts in the header section of the document the following lines of code:

The Title and Meta tab requires the input of the following information:

Title

Document title. The title of your document is displayed on the browser’s title bar.
<title>

Description

Description of the contents of your document. This information is used by the search and robot engines.
<description>

Keywords

Keywords used to reference your document. Use commas (,) to separate keywords. A keyword can be made up of several words.
<keyword>

Author

Author of the document.
<author>

Other META

Additional META that you can select from the dropdown list.

  1. Select the META you want to add from the Other META dropdown list or enter the tag directly in the text box.

  2. If the META added is http-EQUIV, enable corresponding box.

  3. In the Content zone, enter the information that pertains to this META.

  4. Click on the button Add to add it to the list.

You can modify the META added by selecting it and clicking on the Modify button. You can also delete it by clicking on the Remove button.

The META command allows you to establish relation links between files. The LINK tab establishes a relation with another object.. LINK has two attributes: REL which specifies the relation between the document and the link and REV which indicates a reverse relation. LINK is used on the header section (HEAD) of the document.

To insert a relation link in your document:

  1. On the Specialized tab, click on the button Header properties. You can also use the shortcut SHIFT+ALT+D (Refer to list of shortcuts).

  2. Click on the Link tab.

  3. Enter the necessary information.

Enter the following information under the Link tab:

Link | Name of target file for the relation link. The list indicates the files most recently opened. You can also use the Open to look for the file in your work station.
Relation | Type of relation between the current document and the target file.
Reverse Relation | Type of relation between the target file and the current document.
Linked Style Sheets (CSS) | Check this box if the specified file is an external style sheet.

When you exit the dialog box, AceHTML displays a message requesting confirmation to insert the new information under the header section of the document (<HEAD>).

AceHTML inserts the following lines of code in the document:

The Meta command allows you to save a base URL address on the document. This address is usually the address of your Web site. In this way you can establish a relative address for the group of files found on a site which are identified using this command. This command is useful to avoid broken links between documents. BASE is placed in the header section (HEAD) of the document.

To specify a base URL in your document:

  1. On the Specialized tab, click on the button Header properties. You can also use the shortcut SHIFT+ALT+D (Refer to list of shortcuts).

  2. Click on the Base tab.

  3. Enter the necessary information.

Enter the following information under the Base tab:

URL | Address you want to use as a reference. You can click the Open button to specify an address of one of your HTML documents. If you specify an URL address found outside your site, remember to specify the communication protocol necessary (http, mailto, ftp, etc.)
Target (frame name) | Target of frame name (<FRAME>) that you defined.
Predefined target | Target or predefined frame in the HTML tags.

If you specify an address that is not found in your Web site, AceHTML displays a message so that you can confirm the address you entered.

When you exit the dialog box, AceHTML displays a message requesting confirmation to insert the new information under the header section of the document (<HEAD>).

AceHTML inserts the following lines of code in the document:


Document Body

With this command you can modify the attributes of the (BODY) of your document . You can insert an image in the (BACKGROUND), indicate a background color, and modify the color of text and links in your Web page.

  1. In the Specialized tab, click on the icon Body. You can also use the shortcut SHIFT+ALT+B (Refer to list of shortcuts).

  2. If you wish to insert a background wallpaper, enter the image file's directory and name in the Wallpaper text box. The image must be in GIF or JPG format.

  • You can also use the Open button to search for the image you want in your folders. In the Preview window, you will see the image you have chosen.

  3. In the Color Options window, select the desired color for the different available options by pressing the Color button. The color selected will appear on the button.

AceHTML will ask you to confirm the changes to the current BODY tag. To apply the new parameters, click on the Yes button.

These tag properties can be modified.

Following is a description of the different options in the text box:

Background | This attribute allows you to change the color of the background. The default color depends on the browser being used. Example: <body bgcolor="#color">
Text | This attribute allows you to change the color of the text. The default color is black. Example: <body text="#color">
Link | This attribute allows you to change the color of the hypertext links. The default color is blue. Example: <body link="#color">
Active link | This attribute allows you to change the color of the active links; that is, the color of the link when you click on it. Example: <body alink="#color">
Visited link | This attribute allows you to change the color of the visited links. The default color is mauve. Example: <body vlink="#color">
Microsoft Internet Explorer Extensions | Microsoft's Internet Explorer allows you to add other options to the BODY command.
 | Fixed background If you place a check mark on this option, the background appears to be frozen. This option will add the attribute BGPROPERTIES=FIXED to the command BODY. Example: <body background="image" bgproperties="fixed">
 | Scroll bar visible Causes the scrolling bar to be displayed. Example: <body scroll="no">
Clear button | The Clear button allows you to reset the default values for the command BODY, depending on the browser you use.


Comment

This command inserts comment tags in your document. They are: <!-- and -->.

Comment tags are an integral part of the HTML document, but they are not displayed buy the browser. They are used to enter information concerning the design of the Web page and to insert key words in the document so that search engines can take them into account.

  1. To insert the text in your document that you want to place as a comment.

  2. Select the desired text.

  3. From the Common tab, select Comment. You can also use the shortcut ALT+M (Refer to list of shortcuts).

The selected text will be inserted between the tags <!-- and -->.


Color

This command allows you to change the color of Web page elements (text, background, borders, etc.). It provides access to a color palette from which you can choose a new color to apply. It also allows you to mix custom colors.

The color is inserted in your edit window as a hexadecimal value.

The color attribute can be associated to the BODY, FONT, BASEFONT, BGCOLOR, BACKGROUND HT or TABLE elements, to name but a few.

  1. In your document, select the element whose color you want to change.
    You can access the color palette from the dialog boxes which have the Color button next to an option.

  2. From the Common tab, click on the Color button.

  3. A preliminary color palette appears. More options are available:

Palette

This list provides you access to a selection of color palettes.

  • 216 colors. This is the default palette. It is also called the Web Palette. It represents those colors which can be interpreted by 256 color screen configurations without much risk that they will be altered.

  • 140 colors. This palette corresponds to the standard Windows palette.

  • 16 colors (W3C). This palette includes those colors defined in the W3C standards.

Custom colors

Displays those colors which you have defined.

Selected Color

Displays information concerning the selected color: an enlarged sample preview, its name and its hexadecimal value.

  • Click on the Add button to add the color shown here to your custom colors.

More >>>

Provides access to another portion of the dialog box which displays an area that allows you to make your own mixes.

Once the color is applied, the following attribute is added to the tag FONT:

To change a color:

  1. In your document, select the hexadecimal value of the color you want to modify.

  2. From the Common tab, click on the Color button.

  3. Make the desired change.

  4. Click on OK.

The color's hexadecimal value is changed.

To customize a color:

  1. In your document, select the text whose color you want to change.

  2. From the Common tab, click on the Color button.

  3. Click on the button More >>> to display another portion of the dialog box.

This section of the Select Color dialog has two areas in the top portion:

  • Click on the bigger one to select the desired tint of color

  • Click on the black triangle next to the narrow area and slide it to select the tone.

The values in the fields in the bottom area change as you do so. If you know them, you can enter the color's values directly in these fields.

  • Click on the Add button to add a new color to the list of custom colors.


Base font <BASEFONT>

This command is used to indicate basic font properties in the document, such as size, color and type. Once the BASEFONT command is inserted in your document, all subsequent fonts are displayed with the attributes you specified.

  1. In the Common tab, click on the Font button.

  2. Enable the Base Font box.

  3. To change the font size, change the value in the option box Size. The default value is 3 which is equivalent to 12 pixels.
    This option inserts the attribute SIZE in the BASEFONT command.

  4. To modify the font color, click on the Color button and select a color. The color selected will appear on the button. The default color is black.
    Changing the color inserts the COLOR attribute in the BASEFONT command.

  5. To change the base font, select the desired font in the Font Options area. In case that your platform does not have this font available, you may select more than one to ensure that one of them is accepted.
    Changing the font inserts the attribute FACE in the command BASEFONT.
    You can also add fonts from the list of selected fonts by using the Add button, or remove them using the Delete button. The arrows allow you to scroll through the list of fonts you have selected.

  6. Use the options in the Possible Attributes tab to complete the font's definition.

  7. Click the OK button.

AceHTML inserts the following lines of code in your document:


Font <FONT>

This command is used to indicate font properties in the document, such as size, color and type.

The Verdana font is used across platforms.

  1. Select the text you want to modify.

  2. In the Common tab, click on the Font button. You can also use the shortcut CTRL+W (Refer to list of shortcuts).

  3. Make the changes you want to the size, color, and type of font and then click OK.

To change the font size:

  • Change the selected value in the option box Size in the Font dialog box. The default value is 3. This will insert the attribute SIZE in the FONT command.

Example:

You can also change the font size by selecting the text and click on the arrow [image] located to the right of the Font button. AceHTML will display a sub-menu from which you can select the desired font size.

To change the font color:

  • In the Font dialog box, click on the Color button and select the desired color. The color selected will appear on the button. The default color is black.

Changing the color inserts the attribute COLOR in the FONT command.

Example:

You can also change the font color using the Color button found on the Common tab.

To determine the substitute font:

Fonts are not transferred with the HTML document, if the font you indicate is not available the browser will select one from the fonts available in the system. Sometimes the results can be surprising. Thus, it is important to select a font that is commonly available.

You can also design your page with a particular font, while at the same time selecting a substitute font in case the visitor to your Web page does not your visitor does have your main font installed in his/her computer.

You must take into account that the Available Fonts option is only available in Microsoft Internet Explorer [image] and Netscape [image] versions 3 or later.

  1. In the Font dialog box, click on the Available Fonts dialog box and press OK.

  2. If you want to preview another substitute font, click on the Add button after the first step to add the font selected first to the Selected Fonts area and select one or more additional fonts.

The fonts will be interpreted by the visitor's browser in the order in which they appear inside the HTML tag. For example:

The main font is Futura. If this font is not available, the browser will look for Arial in the system; if this font is not available either, the browser will look for Helvetica.

Note that it may be advantageous to select Helvetica as a substitute font because it is a universal font for MacIntosh while Arial is a universal font for PC users.

Additional font properties:

Click on the Possible Attributes tab in the Font window to select additional attributes. These attributes only make slight changes to the font. However, you must keep the following in mind: they are often exclusive to one of the browsers; if such is the case, it will be indicated on the Possible Attributes tab in the Font dialog box.


Bold <B>

This option specifies the text that will be displayed in bold.

  1. Select the text in the document you want to display in bold.

  2. In the Common tab, click on the Bold button. You can also use the shortcut CTRL+G (Refer to list of shortcuts).

The selected text will be inserted between the tags <b> and </b>.


Italic <I>

This option specifies the text that will be displayed in italic.

  1. Select the text in the document you want to display in italic.

  2. In the Common tab, click on the Italic button. You can also use the shortcut CTRL+I (Refer to list of shortcuts).

The selected text will be inserted between the tags <i> and </i>.


Underline <U>

This option specifies the text that will be underlined.

  1. Select the text you want to underline.

  2. In the Common tab, click on the Underline button. You can also use the shortcut CTRL+U (Refer to list of shortcuts).

The selected text will be inserted between the tags <u> and </u>.


Superscript <sup>

The Superscript button must be the added to the toolbar.

This command has the effect of displaying text approximately half a line higher and in smaller font.

  1. Select the text in the document you want to display in superscript.

  2. Click on the command Superscript

The selected text will be inserted between the tags <sup> and </sup>.


Subscript <sub>

The Index button must be added to the toolbar

This command has the effect of displaying text approximately half a line lower and in smaller font.

  1. Select the text in the document you want to display in subscript

  2. Click on the Subscript command

The selected text will be inserted between the tags <sub> and </sub>.


Blinking <blink>

This option makes text blink. This HTML tag is only interpreted by Netscape [image] .

  1. Select the text that you want to display blinking.

  2. Click on the Blink command.

The selected text will be inserted between the tags <blink> and </blink>.


Paragraph <P>

This command inserts a paragraph in your document.

  1. Place the cursor in the desired position in your document.

  2. From the Common tab, select Paragraph. You can also use a shortcut by simultaneously pressing CTRL+P (Refer to list of shortcuts).

AceHTML inserts the command <p></p> in the document.

If you click on the arrow [image] associated to the Paragraph button, AceHTML will display a submenu from which you can select the desired type of paragraph:

To the left (forced) button | This option inserts the attribute ALIGN to the command <P>. ALIGN will take the value LEFT. This forces text to be aligned to the left. This function only works with the Netscape browser. Example: p align="left"></p>
Center | This option inserts the attribute ALIGN to the command <P>. ALIGN will take the value CENTER. This attribute centers text with respect to the horizontal page margins. Example: p align="center"></p>¸
Align Right | This option inserts the attribute ALIGN to the command <P>. ALIGN will take the value RIGHT. This attribute allows you to align text to the right. Example: p align="right"></p>
Justify | This option inserts the attribute ALIGN to the command <p>. ALIGN will take the value JUSTIFY. This option aligns text at the left and right paragraph indent.


No Break Line <nobr>

This command prevents a line break in the browser display. It can be useful specially when you want to avoid separating a string of words. The use of this command avoids you having to use the command BR (line break) and also having to find orphan words on a line displayed by the browser.

  1. In your document, select the text you do not want to separate.

  2. From the Common tab, click on the arrow on the Line break button.

  3. Click on the No break line command.

The selected text will be inserted between the tags <NOBR> and </NOBR>.


Line Break <BR>

This command forces text to change lines before continuing. The difference between a line break and a paragraph is that with a line break there is no additional spacing before the new line.

  1. Place the cursor in the desired position in your document.

  2. In the Common tab, click on the Line break button. You can also use the shortcut CTRL+B (Refer to list of shortcuts).

AceHTML adds the <BR> command to the document.

if you click on the arrow [image] associated to the Line break button, AceHTML will display a submenu from which you can choose the desired type of line break:

At the next full right margin | This option inserts the attribute CLEAR to the command <BR>. CLEAR will take the value RIGHT. This aligns text to the right of an image. Example: <br clear="right">
At the next full left margin | This option inserts the attribute CLEAR to the command <BR>. CLEAR will take the value LEFT. This aligns text to the left of an image. Example: <br clear="left">
At the next full left and right margins | CLEAR will take the value ALL. This aligns text to the left and right of an image. Example: <br clear="all">
No Line Break | This option inserts the command NOBR. This command prevents line breaks. Example: <nobr> </nobr>


Heading Style 1 <H1><H2> … <H6>

This command is used to assign H1, H2, H3, H4, H5 or H6 heading styles to text. The first level (H1) formats text in a larger font and/or darker than normal text, while the sixth heading type (H6) displays it in smaller. With any of these tags, the titles or headings are automatically placed on a line of their own within the document.

  1. Select the text to be made into a title.

  2. In the Common tab, click on the Heading Style button.

  3. From the sub menu which appears, select the desired Heading Style.

You can use the shortcuts SHIFT+CTRL+1, SHIFT+CTRL+2, SHIFT+CTRL+3, … the number corresponds to the heading style level that you want to apply (see list of shortcuts).

The selected text will be surrounded by the <h1> and </h1> tags to the <h6> and </h6>.


Preformatted

Displays a text in fixed-width type without collapsing spaces. Spaces, new lines and tabulation are interpreted as in a text editor. Avoid using other HTML commands within sections defined by PRE.

  1. Select the text in the document you want preformatted.

  2. In the Common tab, click on the Preformatted button.

The selected text will be inserted between the tags <pre> and </pre>.

If you click on the arrow [image] located to the right of the Preformatted button, AceHTML will display a submenu from which you can choose the number of maximum characters per line. The default value is 80 columns. If you select a value of 40 or 132, the WIDTH attribute will be inserted in the PRE command.

Example: <pre width="40"> text </pre>


Example <xmp>

The Example button must be added to the toolbar.

This command is used to set apart quotations in a block of selected text by inserting indents both on the right and left margins to a selected block of text and change its font in order to give it the appearance of preformatted text. With the latest browser versions, this command has become obsolete. It is recommended that this command be replaced by the Preformatted <PRE>.

  1. Select the text in the document you want to display in bold.

  2. Click on the Example command.

The selected text will be inserted between the tags <xmp> and </xmp>.

If you apply an Example style to several words within a paragraph, the text will be displayed on a single line like an independent paragraph even if the end of paragraph or end of line tags are not present.


Blockquote <BLOCKQUOTE>

This command is used to set apart quotations in a block of selected text by inserting indents both on the right and left margins.

If you apply the function Block Quotation on a selection of words within a paragraph, the selected text only will be displayed on a line by itself like an independent paragraph, even if the end of paragraph or end of line tags are not present.

  1. Select the text you want to display as a block quotation.

  2. On the Common toolbar, click on the Block Quotation icon.
    Click on the button's arrow to select a fixed line width. By default, the block quotation is configured at 80 columns or, in other words, fixed width of 80 characters.

The selected text will be inserted between the tags <blockquote> and </blockquote>.


Align left <DIV ALIGN="LEFT">

This option aligns text to the left side of the document.

  1. Select the text in the document you want to align to the left.

  2. In the Common tab, click on the Align Left button. You can also use the shortcut SHIFT+CTRL+G (Refer to list of shortcuts).

The selected text will be inserted between the tags <div align="left"> and </div>.


Align Right <DIV ALIGN="RIGHT">

This option aligns text to the right side of the document.

  1. Select the text in the document you want to align to the right.

  2. In the Common tab, click on the Align Right button. You can also use the shortcut SHIFT+CTRL+D (Refer to list of shortcuts).

The selected text will be inserted between the tags <div align="right"> and </div>.


Center <DIV ALIGN="CENTER">

This option centers the text in a document.

  1. Select the text in the document you want to center.

  2. In the Common tab, click on the Center button. You can also use the shortcut CTRL+E (Refer to list of shortcuts).

The selected text will be inserted between the tags <div align="center"> and </div>.


Justify <DIV STYLE ="TEXT-ALIGN: JUSTIFY">

With this command text is justified to the right and left margins of the document.

  1. Select the text you want to justify.

  2. In the Common tab, click on the Justify button. You can also use the shortcut SHIFT+CTRL+J (Refer to list of shortcuts).

The selected text will be inserted between the tags <div style="text-align: justify"> and </div>


Example 1 |  | Example 2 |
Number of items:1 Start at: 1 (default) List type: 1, 2, 3, etc… | <ol> <li></li> </ol> | Number of items: 3 Start at: 5 List type: a, b, c, etc… | <ol type="a" start="5"> <li></li> <li></li> <li></li> </ol>

Ordered list <OL>

Ordered or numbered lists use the OL and LI tags:

  • OL defines the type of list

  • LI indicates an element in a list

It is used to create an ordered list in which the numbering increases automatically.

With AceHTML It is also possible to modify an existing list. To do so, select the list’s code and press on the Ordered list button.

These tag properties can be modified.

  1. Place the cursor in the desired location in your document.

  2. In the Tables, frames and lists tab, click on the icon Ordered list. The Ordered list dialog box is displayed, with Numbers selected by default.

  3. Choose the type of numbering.

  4. Indicate the number of items in the Items area. The List content window will display a line for each item indicated.

  5. You can choose the starting number of the list using the Start at box.
    For example, if you indicate 3 in this box, the list will begin numbering with 3 or c iii, depending on the list type you choose.

  6. You can enter directly in the List content window the contents of each item in the list. Use the TAB key to shift between items.
    If you want to enter the list information directly in the edit window, enter the text to the right of the <LI> tag.

  7. Press on the OK button.

AceHTML adds the following lines of code in the document, according to your specification:

To convert a list type:

You can convert an ordered list into an unordered list and vice versa.

  1. Select the set of data that contain the <OL> and </OL> tags making sure that you include the opening and closing tags of the selection.

  2. Click on the list button.

  3. Click on the tab corresponding to the list type you want to use.

  4. Indicate the list properties and click on the OK icon.


Unordered list <UL>

The unordered list is a bulleted list. This list uses the UL and LI tags:

  • UL defines the list type

  • LI indicates each item in the list.

With AceHTML it is also possible to modify an existing list. To do so, select the list’s code and press on the Ordered list button.

These tag properties can be modified.

  1. Place the cursor in the desired location in your document.

  2. In the Tables, frames and lists tab, click on the icon Unordered list. The Unordered list dialog box is displayed, with Bullets selected by default.

  3. Choose the type of bullets.

  4. Indicate the number of items in the Items area. The List content window will display a line for each item indicated.

  5. You can enter directly in the List content window the contents of each item in the list. Use the TAB key to shift between items.
    If you want to enter the list information directly in the edit window, enter the text to the right of the <LI> tag.

  6. To can reduce the space occupied by the list by checking the Compact form box. This option adds the attribute COMPACT to the <UL> tag. This is an option for Netscape only. .

  7. Press on the OK button.

AceHTML adds the following lines of code to your document according to what you chose:

To convert a list type:

You can convert an ordered list into an unordered list and vice versa.

  1. Select the set of data that contain the <OL> and </OL> tags making sure that you include the opening and closing tags of the selection.

  2. Click on the list button.

  3. Click on the tab corresponding to the list type you want to use.

  4. Indicate the list properties and click on the OK icon.


Definition List <DL>

Example

Results

<dl>
<dt>term1</dt>

<dd> definition of term1...</dd>
<dt>term2</dt>
<dd> definition of term2...</dd>
<dt>term3</dt>
<dd> definition of term2...</dd>

</dl>

List heading

Term1

Definition of term1...

Term2

Definition of term2...

Term3

Definition of term3...

Definition List <DL>

With the DL command you can have a list of terms with its definitions, that is, a list where each term is followed by a definition, like a glossary. The tags used are DL, DT and DD.

  • DL defines the type of list

  • DD is the term

  • DL is the definition of the term

With AceHTML it is also possible to modify an existing list. To do so, select the list’s code and press on the Ordered list button.

These tag properties can be modified.

  1. Place the cursor in the location where you want to insert the list.

  2. In the Tables, frames and lists tab, click on the icon List definition. The Definition list dialog box is displayed and the Hierarchical dialog box is selected by default.

  3. Indicate the number of elements in the Elements box. You will see in the List content window a line for each element in the list.

  4. You can enter directly in the List content window the contents of each item in the list. Use the TAB key to shift between items.
    If you want to enter the list information directly in the edit window, enter the text to the right of the <DT> and <DD> tags.

  5. To can reduce the space occupied by the list by checking the Compact form box. This option adds the attribute COMPACT to the <DL> tag. This is an option for Netscape only [image].

  6. Press on the OK button.

Example:


HTML Commands

This option displays all available HTML tags and the Netscape and Microsoft Internet Explorer extensions. These commands can be inserted directly into your document.

If you work with an anchored desktop, you can click and drag the HTML command window in order to anchor it on the Code Inspector window.

  1. Place the cursor in the desired position to insert the desired command.

  2. In the Specialized tab, click on the icon HTML Tags Summary.
    The HTML Tags Summary will appear.

  3. Select the desired command.
    The bottom portion of the window displays the description of the command you have selected.

  4. You can insert this command in your document by double clicking on it or by pressing on the Insert button.

  5. On the edit window, make the required changes to adapt the command line to your HTML document.

Options under the HTML Tags Summary:

The HTML Tags Summary is loaded with toolbars that are easy to use:

Alphabetical buttons | Similar to a glossary, the alphabetical buttons allow you to move quickly through the tags listed alphabetically.
Details | When you click the Details button, tips on the chosen tag are displayed. In this window you can check the attributes and properties that can be used with the HTML tag selected.
Help | When you click the Help button you will have access to the HTML reference system that is built into AceHTML.
Insert | Insert the selected tag at the point of insertion in the edit window.


ASP Commands

The ASP command (Active Server Page) is a script inserted inside an HTML document which contains lines of commands (script) meant to be executed on a Web server before the results page is sent back to the user.

For example:

You can customize the information contained in a Web page in terms of the identity of the visitors. ASP script are inserted on a menu item. When a user activates a link, the script is executed, consults a data base, and applies an information filter and does not submit results other than those which correspond to the identity (usually defined by a password) of the visitor. The result of the script's execution is displayed on the Web page.

The HTML page which contains the ASP script also includes the formatting which must be applied to the data.

Although ASP is a Microsoft technology, it can be interpreted by most of the other browsers because it is integrated in the document.

AceHTML allows you to create scripts by adding predefined ASP commands.

  1. On the edit window, position the pointer on the location where you want to insert the ASP/PHP command.

  2. In the Specialized tab, click on the icon Insert ASP command. The Script Generator window is displayed.

  3. In the text box Go to, display the list to select the type of script.
    You can use different types of scripts.
    To select a type of script, you can also use the bottom area of the window.

  4. The left area of the window is refreshed in terms of the type of script you select. The browser displays the following icons:

  • Double click on the icon [image] to open the file.

  • Double click on the icon [image] to display the contents of the parent directory.

  • Double click on the icon [image] to select the command.

The dialog box that appears allows you to identify the script being created.

  5. Click on the OK buttons to close the windows..

Once the command is completed, AceHTML inserts the command at the insertion point.


PHP Commands

PHP (Hypertext Preprocessor) is a script language used on the server side. As opposed to ASP, PHP is an open technology that is gaining popularity in e-commerce sites. The advantage of the PHP language over other languages it is capacity to quickly integrate databases, its IP connectivity, its LDAP and TCP support and its IMAP protocol.

  1. On the edit window, position the pointer on the location where you want to insert the ASP/PHP command.

  2. In the Specialized tab, click on the icon Insert PHP command. The Script Generator Window is displayed.

  3. In the text box Go to, display the list to select the type of script.
    You can use different types of scripts.
    To select a type of script, you can also use the bottom area of the window.

  4. The left area of the window is refreshed in terms of the type of script you select. The browser displays the following icons:

  • Double click on the icon [image] to open the file.

  • Double click on the icon [image] to display the contents of the parent directory.

  • Double click on the icon [image] to select the command.

When you double click on the [image] icon to choose a command, the line of code is automatically inserted; for example, for the header prologue, the Expressions Constructor dialog box is displayed. Depending on the command being edited, the window displays a different field numbers which allows you to define all the necessary parameters.

  5. You must supply information regarding identification, arguments and expressions used, return values, statements, etc…

  6. Click on the OK buttons to close the windows.

Once the command is completed, AceHTML inserts the command at the insertion point.


WML Commands

WML (Wireless Markup Language) is a language used to convert HTML documents in a pocket format that can be interpreted by WAP telephones. WAP documents are not very different to HTML documents, except in that they use WML language. WML documents have the .wml extension.

WML is mostly text. Tags and scripts that slow down transfers are not part of standard WML.. Tables and images are kept to a minimum. Since WML is an XML application, all the tags are case sensitive and must contain opening as well as closing tags.

  1. On the edit window, position the pointer on the location where you want to insert the command.

  2. In the Specialized tab, click on the icon Insert a command. The Script Generator Window is displayed.

  3. In the text box Go to, display the list to select the type of script.
    You can use different types of scripts.
    To select a type of script, you can also use the bottom area of the window. The left area of the window is refreshed in terms of the type of script you select. The browser displays the following icons:

  • Double click on the icon [image] to open the file.

  • Double click on the icon [image] to display the contents of the parent directory.

  • Double click on the icon [image] to select the command.

When you double click on the [image] icon to choose a command, the line of code is automatically inserted; for example, for the header prologue, the Expressions Constructor dialog box is displayed. Depending on the command being edited, the window displays a different field numbers which allows you to define all the necessary parameters.

  4. You must supply information regarding identification, access keys and the properties and attributes of the tags you use.

  5. Click on the OK buttons to close the windows.

Once the command is completed, AceHTML inserts the command at the insertion point.


The Script Generator Window

The Script Generator window is used to insert WML tags, ASP scripts and PHP scripts.

The Up One Level button is used to move one level up the folder structure.

This command allows you to create a new custom tag. The dialog box that is displayed when the command is executed allows you to define more parameters:

  • In the text box this is new, indicate whether you want to create a command or a category folder.

  • In the text box Path, indicate the location where you want to store this script or folder. By default, the display shows the location where you were located before
    the command was executed.

  • In the following text boxes, enter the information which will allow you to identify your script later.

A script is identified by the red color.

This command allows you to delete a command. It is only enabled when a script is selected in the bottom portion of the window.

You can only delete custom scripts and tags.

These commands allow you to modify the display of the bottom area of the window.

When the button is pressed, the <% %> tags are inserted around the ASP commands or the <? ?> tags are inserted around the PHP commands inserted in the text.

If the button is not enabled, AceHTML inserts the command:

Application.Contents( <Key name> )

When the button is enabled, AceHTML inserts the following for an ASP command:

<% Application.Contents( <Key name> )%>

or when the button is enabled, AceHTML inserts the following for a PHP command:

<? variableName = 45; ?>

The Folders button displays the structure of folders, in a similar fashion as in Windows File Explorer.

Reset

This command allows you to reset the default values for the script/tag directories. This command deletes the scripts and tags which you customized.


Definition of a JavaScript function

With this command you can define a JavaScript function. This is the first step to define a JavaScript function.

  1. In the JavaScript tab, click on the Define a script button.

  2. In the text box Function name, type the name of the JavaScript function.

  3. In the text box File Source, define the file you want to use.
    The file has the .ja extension.

  4. From the Language dropdown list, select the appropriate script version.

  5. Please note that the Insertion of the functions in the document header is active, or the JavaScript command will not be valid.

  6. Click on the OK button.

AceHTML will insert the following lines of code in the header section of your document:

<script language="JavaScript">
<!-- begin script
 function aName() {

 }

// -->
</script>

Once you have indicated the JavaScript function, you can insert the function contents with the help of the menu JavaScript commands summary. For more information on each of the JavaScript commands, please refer to the JavaScript reference in AceHTML’s Help menu.


JavaScript commands summary

This option gives you a list of the JavaScript objects, methods and corresponding events.

  1. Place the cursor in the desired position in your document to insert the script.

  2. In the Specialized tab, click on the JavaScript Command Summary. You can also use the SHIFT+ALT+F9 shortcut (refer to the Shortcut list).

  3. Select the desired JavaScript version.

The window is divided in two parts:

  • The left side displays a numbered list of available objects. This is a tree type list. Click on the object to open the tree to view the sub-objects or properties.

  • The right side displays the events or methods corresponding to each object.

To define a method or an event:

  1. On the left side of the JavaScript Objects, methods and events window, click on the desired event.

  2. Click on the Methods or Events button, to display the list on the left side of the window. The methods corresponding to the JavaScript version selected will be displayed on the right side of the window.

  3. Click on the method or event that you want to add to he script and click on the Insert button.
    You can also double-click on the method or event.

To obtain more information on each of the JavaScript commands, you can refer to the JavaScript reference found in AceHTML’s Help menu.


Image <IMG SRC=" ">

This command lets you insert an image in a document.

  1. Place your cursor at the spot where you want to insert the image.

  2. In the Images tab, click on the Insert an Image button.
    You can also use SHIFT + ALT + I (See the List of Shortcut Keys).

  3. In the Image zone, enter the name and access path of the image file. The file must be in GIF or JPG format.

  • You can also use the Open button to search AceHTML Explorer or your image folders for an image to insert in the document. Or, choose an image in GOgraph by clicking on the button Insert an Image with GOgraph.

  • You can view the selected image in the Sketch window.

  4. Define the image properties and attributes.

  5. Click on OK.

Inserting an image from the Windows desktop

1. Click on the image to insert.
The image file can be on the Windows desktop or in a Windows Explorer window.

2. Drag the file to the desired spot in the Edit window.

This tag's properties can be modified.

Image dialog box options

Alternative

You can enter text describing the image in this zone. If the browser cannot display the image, or the transfer is interrupted, this text will appear. This attribute can also be used to display a help balloon (when the mouse cursor is positioned over the spot in question). This option lets you add the attribute ALT to the element IMG.

Alignment

At the bottom, in the middle, or at the top

The button lets you determine how the image will be aligned.

You can change the alignment, opting for either the top or bottom. The default value is the bottom.

This will add the attribute ALIGN="TOP" or "MIDDLE" to the element IMG.

Alignment options are found in the second section of the dropdown list.

  • Left Align lets you align your image to the left of the page.

  • Right Align Lets you align your image to the right.

These options will add the attribute ALIGN="LEFT" or "RIGHT" to the element IMG.

  • Texttop lets you align the image with the topmost text in the text line.

  • Baseline lets you align the image with the lowest text.

These options will add the attribute ALIGN="TEXTTOP" or "BASELINE" to the element IMG.

  • ABS Middle and ABS Bottom let you modify the image's alignment so that it is in the middle or at the bottom of the text line.

These options will add the attribute ALIGN="ABSMIDDLE" or "ABSBOTTOM" to the element IMG.

Image Properties

Border

This attribute lets you add or remove a border. The default value, in pixels, is 0. This option lets you add the attribute BORDER to the element IMG.

Width

This attribute lets you change the width of the image, as it will appear in your document. Its value is expressed in pixels. This option modifies the value of the attribute WIDTH.

Height

This attribute lets you change the height of the image, as it will appear in your document. Its value is expressed in pixels. This option modifies the value of the attribute HEIGHT.

Proportioned

Check this box to obtain a proportioned image.

VSpace

This attribute lets you add a vertical margin around the image. Its value is expressed in pixels. This option lets you add the attribute VSPACE to the element IMG.

HSpace

This attribute lets you add an horizontal margin around the image. Its value is expressed in pixels. This option lets you add the attribute HSPACE to the element IMG.

Extension

The button Video and VRML extensions let you insert a video sequence (AVI format) or VRML file in your document. Clicking on the button will open the Video and VRML extensions menu.

Internet Link

Lets you immediately attribute a hyperlink to the image.


Insert an image with GOgraph

No. The GOgraph search engine is not case sensitive. You can enter words in uppercase or lowercase.

No, enter keywords in the singular form.

For personal purposes, you may use the images found on GOgraph’s website and include a limited number of those image(s) on a personal, non-commercial website. However, excepting these limited uses, you may not reproduce, distribute, transmit, print or transfer these images on any tangible medium, or otherwise exploit them in any way. In particular, you may not include such images in any other publication or product or on any computer network and under no circumstances shall you add these copyrighted images in any collection or compilation, including one distributed through the Internet or on CD-ROM.
For professional or commercial use, you must either (a) purchase a non-exclusive licence of use for the image (and respect the terms and conditions of the End User Licence Agreement) or (b) directly contact the graphic artist to negotiate terms and conditions for such use.
If any image has the wrong copyright notice or has erroneously or mistakenly been placed on our website, please let us know right away and we will do what is necessary as soon as possible.
By using the GOgraph website, you agree that neither Visicom Media Inc., its directors, its officers, its employees, its partners, its licensors or agents will be responsible or liable to you for any direct, incidental, consequential, indirect, or punitive damages that result from your access to or use of the images from our site.
This agreement is governed by the laws applicable within the Province of Quebec, Canada and any action based thereon will be venued in the judicial District of Montréal, in the Province of Quebec, Canada, to which you submit for such purpose.

  1. On the HTML document, place the cursor on the desired location for the image.

  2. On the Specialized tab, click on the button Insert an Image with GOgraph

  3. In the search text box, enter the name for the graphic you want to find.

  4. Click on the graph you want to insert. A preview of the image is displayed.

  5. Click on the Insert button. AceHTML will require you to specify the folder on your hard disk where you want to download the image.

  6. The image will be downloaded on the specified folder and inserted in your document.

Insert an image with GOgraph

GOgraph is your Ultimate Source of Web Graphics!

To find an image, choose from two search methods: enter keywords, or browse the site by category.

Searching by Keywords:

  1. Enter keywords in the search text box. A search is carried out in the database, returning only those images containing the keywords you enter. You can enter as many words as you like. Remember to leave a space between them.

  2. Select a category. By default, a search is carried out on all categories. However, you can select a specific category, such as Animated GIFs, Photos, Icons, or Clip Art.

  3. Click on the GO button.

Frequently Asked Questions about GOgraph:

Is it necessary to enter uppercase letters?

Is it necessary to enter plural keywords?

Are the graphics on GOgraph free of royalties?

How can I download a graphic from your site?


Horizontal Line

This command inserts a horizontal line in your document. You can edit the HTML code by clicking on the Horizontal Line icon.

  1. In the Specialized tab, click on the Horizontal Line icon. You can also use the shortcut SHIFT+ALT+H (Refer to list of shortcuts).

  2. Click on the OK button.

AceHTML inserts the command <HR> in your document.

The default values are:

  • Dimension in pixels,

  • 100% width,

  • 3D Effect,

  • Alignment in the center of the document.

You can make changes to the horizontal lines by changing the attributes of the command <HR>. To change the references of a horizontal line, you can use tag recapture.


Spacer <SPACER>

With this command you can enter a block of empty space in your document. This command is useful to format the page contents of your HTML document. SPACER is a Netscape 3.0 [image] extension.

  1. Place the cursor in the desired position to insert a spacer block.

  2. In the Specialized tab, click on the icon Spacer.

  3. In the text box Width, you can enter the horizontal space for your block. This value must be in pixels.

  4. In the text box Height, you can enter the vertical space for your block. This value must be in pixels.

  5. In the Alignment text box, select the block's alignment in terms of the content around the block.

  6. You can visualize the effect in the Preview portion of the window.

  7. Press on the OK button.


Extensions Video and VRML

Microsoft Internet Explorer Extension.

  1. Place the cursor at the position where you want to insert the image..

  2. In the Images tab, click on the Image button. You can also use the SHIFT+ALT+I shortcut (Refer to the List of shortcuts).

  3. In the Image area, enter the path and name of the image file. The file must be GIF or JPG format. It is important to choose an image source that is compatible with browsers that do not support video extensions or VRML.

  4. Click on the Extensions button. The Video extensions and VRML dialog box is displayed.

  5. Enter the path and file name in the Source area and make sure you indicate the file’s extension. If necessary, use the Open button to look for the file in your work station.

  6. When you place a check mark on the box Visible Control panel, the control panel will appear underneath the VRML or video sequence.

  7. In the Loop box, enter the number of times you want it to play.

  8. In the Delay box, enter the delay - in milliseconds - in order to adjust the speed at which the text scrolls through the box. The smaller the value, the higher the speed. In the preview area, below the menu, you can preview the result.

  9. In the Start Event box, you can indicate whether you want the file to begin playing as soon as the page is loaded or when you move the pointer over the image.

  10. Press on the OK button.

AceHTML adds the following attributes to the command IMG:

DYNSRC | Indicates the source file.
LOOP | Indicates the number of times the file will play.
CONTROLS | Displays the control panel.
START=MOUSEOVER | Indicates the file will begin to play when the user moves the pointer over the video sequence.

If you want to enlarge or reduce the area where the video application will play, you must indicate the size using the Width and Height fields; that is, the WIDTH and HEIGHT attributes.


Insert a script

The scripts included with AceHTML are kindly supplied by Visicom Media Inc. and independent authors. According to agreements made with the latter, you are free to use the scripts in your HTML documents. However, the notice on the authors rights that appear on some scripts, must be kept.

JavaScripts as well as Dynamic HTML, or DHTML, allows adding dynamic elements to a page. This tool integrates the use of JavaScript and HTML code and thereby provides a particular behavior for each element in a Web page. Sometimes DHTML uses style rules for greater uniformity and higher effectiveness to use special effects provided by style sheets and HTML code.

  1. On the Scripts tab click on the button of the script you want to insert. A definition window is displayed.

From this window you can also display scripts belonging to a different category.

The definition window is divided in two panels and has two tabs:

Scripts tab

The right panel displays a list of files or available scripts.

  • When a script is selected in the right panel, the left panel displays the related parameters. Text has already been inserted and all you need to do is change it.

  • The lower part of the window has a field that changes according to the type of parameter. This field is used to change the parameter’s value.

Some of the DHTML effects are Internet Explorer extensions and will only be displayed in that browser.

Preview tab

Here you can preview the effect of the script you have selected.

You can change categories by clicking on the icon of the main folder.

To insert a script:

  1. Regardless of the script that you choose, the procedure to insert it is the same.

  2. Display the script’s definition window.

  3. In the right side window, select the desired effect. The left side window now displays the parameters associated related to the selected effect.

  4. In the left window, select the parameter you want to change. An icon to the left indicates the type of value that can be added. An example of this value is displayed in the corresponding column and at the bottom of the display.

  5. Make the necessary changes:

text | Enter text directly in the entry field at the bottom of the window.
Number | Enter the corresponding number in the entry field at the bottom of the window.
Image Link to file URL to the Web | Click on the Open Files icon at the bottom of the window to select a file from your drive, or enter the URL in the text box.
Color | Click on the Color button on the right side window in order to display the color palette and choose a color.
Add item | When this button appears at the bottom of a list of parameters, this indicates that an item can be added, removed or modified.
Delete item | When this button appears at the bottom of a list of parameters, this indicates that an item can be added, removed or modified. The Delete button is only active for parameters that you have defined yourself.

  6. When you have finished making changes to the parameters, click on OK to return to the edit window.

  7. The script is inserted at the location where you placed the cursor before performing the above steps.


Insert Java Applet

<applet codebase="http://asite"
 code="afile" alt="atext" name="aname" align="analignement"
 width="avalue" height= "avalue">
<param name="applicationattribute1" value= "avalue">
<param name="applicationattribute2" value= "avalue">

  <param name="applicationattribute3" value= "avalue">
</applet>

<param name="home" value="index.html">

Or

<param name="fontsize" value="18">

Insert Java Applet

A Java Applet is a mini-application (that is how it gets its name) which allows for the execution of a particular effect inside an HTML document. Many of the scrolling menus that you see in the Web are generated by a Java Applet.

This small program is external to the HTML page and bears the .class extension.

There may be other external Files, for example an HTML page used by the program or images.

This command lets you insert in your document a predefined Java Applet from AceHTML or an external Java Applet.

AceHTML lets you insert an external Applet.

The following is an example of a Java Applet.

First you must copy the necessary files in your site’s directory.

  1. Save your HTML document.

  2. From the Specialized tab, click on the button Insert a Java Applet.

  3. In the Code, area, enter the name of the file that contains the applet. This file must have a relative address. The address cannot be absolute.

  4. In the Code Base URL, you can enter the path for the folder counting the Java Applet. This is not necessary if the .class file is found in the same folder. If this attribute is not indicated, the current document’s URL will be used.

  5. In the Alternative text area you can insert a message that will be displayed before the applet is loaded or if the browser the visitor is using cannot display it. This is an optional attribute.

  6. In the Name area, you can enter the name of the applet. This allows the applet to communicate with other scripts found on the same page. This is an optional attribute.

  7. In the Alignment area, indicates the Applet’s alignment. This option is mandatory. By default, the alignment is centered.

  8. If the MayScript (JavaScript Access) option is enabled, the applet has access to JavaScripts found on the same HTML document. This option is exclusive to Netscape.

  9. In the Width and Height area, indicate the size in pixels for the Applet. These values are mandatory.

  10. In the Vertical Space and Horizontal Space you can indicate the space between text and the applet. This value is optional.

  11. Click on the Parameters tab to modify the parameters and enter their corresponding values.

  12. You can click on the Preview button to obtain a preview of the applet.

  13. Click on OK.

The properties of an applet can be changed.

Java Applet parameters

The Java Applet parameters are constituted by two HTML tags: PARAM NAME and VALUE, the first being the parameter named, for example the positioning of an item within a menu or the font used, the second is its value, for example the wording of an item in a menu or the font size.

For example:

To add a new parameter:

  1. Edit the Applet’s tag.

  2. In the dialog box Predefined Applets, click on the Parameters tab.

  3. In the text box Name, type the name of the parameter to be changed.
    You can refer to the list of parameters listed to see the names of the parameters you can use.

  4. In the text box Value, define the value for the parameter.
    You can refer again to the parameters list to see the corresponding values.
    Once the preceding elements are defined (parameter and value), the Add button will be activated.

  5. Click on the Add button to add the new parameter to the list.
    The new parameter will be added to the bottom of the list. You can reorganize the order of the parameters by using the keys.

To change an existing parameter:

  1. Edit the Applet’s tag.

  2. In the dialog box Predefined Applets, click on the Parameters tab.

  3. Select the parameter to be changed in the list.

  4. Click on the Edit button.
    You can also use the context menu or double click on the parameter to be changed.

  5. Select the option which is appropriate to the type of change:

  • Text editor: to modify a value,

  • Edit color: to access the color palette,

  • Open a file: to open the dialog box Open File(s) and select a reference file.

  6. Click on OK.


Marquee <MARQUEE>

The Marquee button must be added to the toolbar.

With this command you can make text scroll from left to right or right to left in a scroll box.

The MARQUEE tag is a Microsoft Internet Explorer extension.

  1. Enter the text which will be displayed in the scroll box.

  2. Click on the arrow on the extreme border of the Specialized tab, and add the Marquee button.

  3. Click on the button you just added. The Marquee dialog box is displayed.

  4. Define the properties and attributes of the Marquee object.

  5. Click on the OK button. AceHTML inserts the following command in your document:
    <    marquee> text </marquee>

  6. Between the opening and closing tags enter the text you want to display in the Marquee.

You can add attributes to the command MARQUEE in order to adjust it to your preferences.

These tag properties can be modified.


Embedded Module

This command is used to execute programs external to the Netscape browser. These programs may be of the type: audio, visual, VRML, etc.

For the Internet Explorer browser, it's necessary to integrate objects using an ActiveX control.

You can insert objects of different formats:

  • The usual modules which are supported by most versions of the browsers.

  • The Flash supports which are only supported by the more recent versions of the browsers.

  1. In the Specialized tab, click on the icon Embedded module.

  2. In the text box Source, enter the access path and the file name which contains the program. The file must be in WAV or MID format.
    If you use the Open button, a dialog box allows you to search for your document. In this dialog box, you can also test the file by pressing the Test button. The Stop button allows you to stop playback of the sound file.

  3. In the text box Alignment, select the desired alignment for the program in terms of the text found on the same line. This option is mandatory.

  4. Click on the OK button.

AceHTML inserts the following command:

These tag properties can be modified.

You can add options to the EMBED command:

Flash Support | If this option is selected, you can insert a Flash Object in the document. If this option is selected, the other sections and options in the dialog box will be updated.
Repeat infinitely | If you insert a check mark in this box, the file will play as long as the page is open. This option adds the attribute LOOP=TRUE.
Automatic start | If this option is selected, the object will be executed automatically as soon as the page is loaded. This option adds the attribute AUTOSTART=TRUE.
Hide control panel | If this option is selected, the control panel will not be displayed. This option adds the attribute HIDDEN=TRUE.
Reduced control panel | If this option is selected, the control panel will be displayed. This option adds the attribute CONTROLS=SMALLCONSOLE.
Alignment | Indicate the control panel’s alignment with respect to the text found on the page.
Border | If a value is inserted in this box, a border will appear around the area where the object is inserted. This option adds the attribute BORDER="".
Volume | The value that is entered here determines the sound file's initial volume. The user can adjust the volume. The attribute VOLUME= value will be added to your document.
Width/Height | The dimensions entered here determine the object's surface area. To define the dimension as a percentage, place a check mark on the % box. These options add the attributes WIDTH and HEIGHT.


Background sound <BGSOUND>

This command allows playing music or sounds in the background of your Web page. This command is a Microsoft Internet Explorer Extension.

  1. In the Specialized tab, click on the icon Background sound.

  2. In the text box Source, enter the access path and the name of the file to play. You can also search for the file by pressing the Open button. The file must be in WAV, AU or MID format.

  3. Indicate the number of times the file will be played by indicating a value in the Loop box . The default value is 1.
    If you enter the value -1, the file will play as long as the page is open.

  4. Click on the OK button.

AceHTML inserts the following command in your document:

You can test the sound file by pressing the Test button. When you are in the Open File(s) dialog box.

The Stop button allows you to stop playback of the sound file.

These tag properties can be modified.


Active X <OBJECT>

With this command you can insert objects in an HTML document. These objects may be ActiveX controls or other types of media, such as an image, a video sequence or a Java application.

ActiveX controls are a Microsoft Internet Explorer extension.

  1. In the Specialized tab, click on the icon Active X.

  2. Indicate the class identification in the Class ID text box.

  3. Specify the other attributes as needed.

  4. Click on the Parameters tab and insert the parameters.

  5. Click on the OK button.

Example:

These tag properties can be modified.

To add a parameter:

  1. Enter the name of the parameter in the Name text box.

  2. Enter the value in the Value option box.

  3. Click on the button Add.

The list displays the following line of code:

To modify the value of an existing parameter:

  1. Click on the parameter to be modified from the list

  2. Click on the Edit button.

  3. Enter the new value in the option box.

  4. Click on the OK button.

To delete a parameter:

  1. Click on the parameter to be deleted from the list.

  2. Click on the button Delete or press the Delete key on your keyboard.

To reorganize the list of parameters:

  1. Click on the parameter to be moved in order to select it.

  2. Click as many times as necessary on the arrow which corresponds to the direction where you want to move.


Description of the ActiveX Command

FIELDS |  | DESCRIPTION
CodeBase (URL) | CODEBASE | Access path which indicates where the control is found, when it is not found on the same directory as the HTML document.
Code Type | CODETYPE | Type of media for the code.
Media Type | TYPE | MIME type for the corresponding scripts.
Class ID | CLASSEID | Control class identity.
Standby | STANDBY | Standby message while the control is transferred.
Alignment | ALIGN | Control's alignment.
Name | NAME | Name used to make reference to the control using JavaScript or VBScript code.
Data | DATA | Access path to the control's data.
Add Flash Parameters |  | Add a set of parameters to the Parameters List that can be associated to a Flash object.
Width | WIDTH | Height of the surface occupied by the ActiveX control.
Height | HEIGHT | Width of the surface occupied by the ActiveX control.
Horizontal space | HSPACE | Space, expressed in pixels, which separates the horizontal border of the control and the text around it.
Vertical space | VSPACE | Space, expressed in pixels, which separates the vertical border of the control and the text around it.
Border | BORDER | Width of the control's border.
Tab index | TABINDEX | Index of tabs.
No Tab | NOTAB | Excludes tab index from the control.
Declare Object | DECLARE | If the object must be used as another object's parameter.


Flash Support Parameters

<embed src="moviename.swf" width="100" height="100" play="true"

loop="true" quality="high"

pluginspage="http://www.macromedia.com/shockwave/download/

index.cgi/P1_Prod_Version=ShockwaveFlash">

</embed>

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="100"

height="100" codebase="http://active.macromedia.com/flash4/cabs/

swflash.cab#version=4,0,0,0">

<param name="movie" value="moviename.swf">

<param name="play" value="true">

<param name="loop" value="true">

<param name="quality" value="high">

</object>

<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="100" height="100" codebase="http://active.macromedia.com/flash4/cabs/

swflash.cab#version=4,0,0,0">

<param name="movie" value="moviename.swf">

<param name="play" value="true">

<param name="loop" value="true">

<param name="quality" value="high">

<embed src="moviename.swf" width="100" height="100" play="true"

loop="true" quality="high"

pluginspage="http://www.macromedia.com/shockwave/download/index.cgi/p1_prod_version=shockwaveflash">

</embed>

</object>

<embed src="afile" type="application/x-shockwave-flash">

Flash Support Parameters

A Flash support is a multimedia object inserted in an HTML document. Although it can be applied to the entire Web site, the Flash support is usually applied for special effects, often spectacular, in a home page.

A Flash is designed using specialized software and can be read with a module associated to "Shockwave" browsers.

The Flash support inserts the EMBED [image] and OBJECT button [image] tags, each with its own parameters. The tag choice is in terms of the browser; you can always use both tags inside the same page:

Netscape uses the EMBED tag. You have access to these options when you insert an embedded module. To EMBED, all the attributes must be inside the tag marks.

For example:

Internet Explorer uses the OBJECT tag. You have access to these options when you insert an ActiveX control. To use OBJECT, the main parameters must be inside the tag marks and the others in different tags.

For example:

To insert a Flash animation that can be displayed by the two main browsers:

  1. First of all, insert the ActiveX control and define its parameters and values.

  2. On the edit window, place the pointer in front of the </OBJECT> end tag.

  3. Insert the embedded module for the animation.

To insert a Flash Animation that can be displayed by Internet Explorer

  1. Place the cursor at the location where you want to insert the animation.

  2. Click on the button Active X Control and define its parameters and values.

  3. Enter a checkmark in the box Add Flash Parameters. The list of parameters found under the Parameters tab displays the Flash Object Parameters.

  4. You can add a parameter:

  • In the Name field under the Parameters tab, indicate the name of the parameter you want to add.

  • In the Value field, indicate a value for the parameter.

  • Click on the button Add to add it to the list.

You can also modify the value of a parameter. Select the parameters from the list and click on the button Edit. In the Edit a value, dialog box, specify a new value and click on the button OK. To delete a parameter, select it from the list and click on the button Remove.

You can change the order in which the parameters are listed by clicking on the corresponding arrow to move it up or down.

  5. Click on OK.

For example:

To insert a Flash Animation that can be displayed by Netscape Communicator

  1. Open the Specialized tab, click on the button Hidden module.

  2. Enable the Support Flash box. The areas in the dialog box are enabled.

  3. In the Source text box. Meter the path and file name of the program. The file must have the SWF format.

  4. Define the properties of the Flash Object.

  5. Click on OK.

AceHTML inserts the following command:

You can add options to the EMBED command.

Repeat infinitely

If you insert a check mark in this box, the file will play as long as the page is open. This option adds the attribute loop="true".

Live Connection

If enabled, this option allows Java to start automatically when the FLASH animation is loaded when there is a link with a JavaScript in the document. The default value for this option is false. This option is not mandatory. This option adds the attribute srcswliveconnect="true".

Menu

This option defines the type of context menu (right mouse button) that is displayed for the animation. If this option is enabled, MENU takes the value true, and displays the entire menu; if this option is disabled (default), MENU takes the value false, and only displays the item which makes reference to FLASH. This option adds the attribute menu="value".

Plugins

The Plugins text box allows you to indicate the location from where the FLASH module must be loaded for its execution. This module must be transferred by visitors that do not have the necessary technology to read your page. This option is mandatory. This option adds the attribute pluginspage="http://www.domain.com".

Alignment

This list allows you to define the animation's alignment relative to the text. This option adds the attribute salign.

Quality

The list available in this section allows you to indicate the element's quality level. You select this level in terms of the performance (speed) / graphic quality relationship that you want to attribute to the object. The higher the quality level, the slower the animation start time.

  • Auto high: gives equal weight to speed of execution and
    quality of animation.

  • High: favors quality of animation. This is the default option.

  • Auto low: favors execution speed and does not take quality of animation into account unless it's possible.

  • Low: favors execution speed.

This option adds the attribute quality="autohigh".

Scale

This option determines whether the animation will be scaled automatically
when it is displayed.

  • Show all: (default) This option displays the entire area of
    the animation keeping its original size. This option may cause scroll bars to appear.

  • No Border: This option automatically resizes the animation area in terms of the available display space while conserving the original proportions.

  • Exact fit: This option resizes the
    animation area in terms of the defined space. The image may be distorted.

This option adds the attribute scale="noborder".

Background Color

This button allows you to define the object's background color. This option adds the attribute bgcolor="#008000".

Width/Height

The dimensions entered here determine the object's surface area. To define the dimension as a percentage, place a check mark on the % box. These options add the attributes Width and Height.


Flash Objects

  1. In the Specialized tab, click on the icon Embedded module.

  2. In the text box Source, enter the access path for the file which contains the program. The file must be in SWF format.

  3. Enable the Flash Support box. The sections of the dialog box change to present the following options.

  4. Click on the OK button.

AceHTML inserts the following command:

You can add options to the EMBED command:

Repeat infinitely

If you insert a check mark in this box, the file will play as long as the page is open. This option adds the attribute loop="true".

Live Connection

If enabled, this option allows Java to start automatically when the FLASH animation is loaded when there is a link with a JavaScript in the document. The default value for this option is false. This option is not mandatory. This option adds the attribute srcswliveconnect="true".

Menu

This option defines the type of context menu (right mouse button) that is displayed for the animation. If this option is enabled, MENU takes the value true, and displays the entire menu; if this option is disabled (default), MENU takes the value false, and only displays the item which makes reference to FLASH. This option adds the attribute menu="value".

Plugins

The Plugins text box allows you to indicate the location from where the FLASH module must be loaded for its execution. This module must be transferred by visitors that do not have the necessary technology to read your page. This option is mandatory. This option adds the attribute pluginspage="http://www.domain.com".

Alignment

This list allows you to define the animation's alignment relative to the text. This option adds the attribute salign="t".

Quality

The list available in this section allows you to indicate the element's quality level. You select this level in terms of the performance (speed) / graphic quality relationship that you want to attribute to the object. The higher the quality level, the slower the animation start time.

  • Auto high: gives equal weight to speed of execution and
    quality of animation.

  • High: favors quality of animation. This is the default option.

  • Auto low: favors execution speed and does not take quality of animation into account unless it's possible.

  • Low: favors execution speed.

This option adds the attribute quality="autohigh".

Scale

This option determines whether the animation will be scaled automatically
when it is displayed.

  • Show all: (default) This option displays the entire area of
    the animation keeping its original size. This option may cause scroll bars to appear.

  • No border: This option automatically resizes the animation area in terms of the available display space while conserving the original proportions.

  • Exact fit: This option resizes the
    animation area in terms of the defined space. The image may be distorted.

This option adds the attribute scale="noborder".

Background color

This button allows you to define the object's background color. This option adds the attribute bgcolor="#008000".

Width/Height

The dimensions entered here determine the object's surface area. To define the dimension as a percentage, place a check mark on the % box. This option adds the attributes WIDTH and HEIGHT.


FLASH Parameters

The following parameters and attributes apply to a flash animation inside an HTML document:

Tag

Value

Example

Description

SRC

File name

src=filename.swf"

Flash file name

MOVIE

File name

movie="filename.swf"

FLASH file name

CLASSID

Identification code

classid="clsid:d27cdb6e-

ae6d-11cf-96b8-

444553540000"

Control identifier for the browser

WIDTH

Pixels or %

width="100" or width="25%"

Width of the animation area. This value may be expressed as a percentage or in pixels.

HEIGHT

Pixels or %

height="100" or height="25%"

Height of the animation area. This value may be expressed as a percentage or in pixels.

CODEBASE

URL

http://active.macromedia.com/ flash4/cabs/swflash.cab

#version="4,0,0,0"

Location of the downloadable Active X control.

PLUGINSPAGE

URL

http://www.macromedia.com/ shockwave/download/

Location of the downloadable Shockwave module.

SWLIVECONNECT

True
False

srcswliveconnect="true".

Auto Start Java (true) or not
(false) when animation
is loaded

PLAY

True
False

play="true"

<param name="play" value="true">

Automatic Start of animation (true), or not
(false), when page
is loaded.

LOOP

True
False

loop="true"

<param name="loop" value="true">

Repeat infinitely (true)
or only once (false).

QUALITY

Low, high, autolow, autohigh, best

quality="high"

<param name="quality" value="high">

The animation's antialias quality level.

BGCOLOR

RGB
hexadecimal value

bgcolor="#ff0000"

<param name="bgcolor" value="ff0000">

Animation's background color.

SCALE

Showall, noborder, exactfit

scale="noborder"

<param name="scale" value="noborder">

Animation's resizing
definition.

ALIGN

L (left) R (right)
T (top) B (border)

align="r"

<param name="align" value="r">

Animation's placement on display.

SALIGN

L (left) R (right)
T (top) B (border)
or a combination
TL - TR - BL – BR

salign="tl"

<param name="salign" value="tl">

Animation's placement on display.

BASE

URL

<param name="base" value="url">

Name of directory where the animation
is located. With Netscape, this directory is defined with the SRC command.

MENU

True
False

menu="true"

<param name="menu" value=" true ">

Type of context menu over the animation.

WMODE

Window, opage, transparent

<param name="wmode" value="window">

Establishes whether the objects that accompany the Flash animation are visible.


Image map

This command allows you to make reference to different zones in an image that link each of them to an internal or external destination.

To insert an image map in your document:

  1. In the Specialized tab, click on the icon Image map. You can also use the shortcut SHIFT+ALT+M (Refer to list of shortcuts).

  2. In the text box Identifier Name of the Image Map, enter a name for the image.
    In the case of an image map, the Identifier Name of the Image Map is mandatory because it is used as an image reference (USEMAP) when defining the areas.

  3. Click on the button Insert Image (located to the left of the preview area). The Insert image window will appear. You can enter the image's address or you can search for it using the button Open a graphic file.
    Once an image is selected, you can see it in the Preview.

  4. Click on the OK button to return to the Image map dialog box.

  5. Choose the shape you want to use to designate a hotspot zone by pressing on the Type of shape (to the left of the Preview window).
    You can manually adjust the size of your first hotspot zone using the arrows located next to the letters X, Y, or the words Width, Height, or Rayon or by tracing the shaping yourself.

  6. Once the first hotspot zone is defined, press on the button Add zone to indicate the reference.
    You can choose between an external link , an internal link or no link at all. The last option is useful if you want to define one region as a dead zone in your image.

The hotspot zone coordinates are displayed on the window above the preview. Proceed in the same manner to define the next reference regions.

The context menu (accessed with the right mouse button) displayed in the coordinates area of the dialog box gives you access to different commands.

If you want to erase one of the hotspot zones you defined, you must select it from the list box above the Preview window, and press the right mouse button. Select the Erase zone option from the context menu

To delete all the hotspot zones you have defined for an image, click on the Reset button. It resets all fields to their default values.

These tag properties can be modified.


Hotspot zone on an image map

The Type of Shape button on the Preview window toolbar allows you to trace hotspot zones on an image map.

This is how they are used:

Circle

A circle is traced from its center:

  1. Click on the center of the area which will constitute the hotspot.

  2. While holding the mouse button depressed, drag the mouse until the circle reaches the desired size.

Rectangle

A rectangle is traced starting from one of its corners:

  1. Click on a point on the image that represents one of the corners of the hotspot zone.

  2. While holding the mouse button depressed, drag it to the opposite corner until the rectangle reaches the desired size.

Polygon

This option allows you to trace irregular shapes. A polygon is traced in several steps:

  1. Click on a point on the perimeter of the hotspot.

  2. Release the mouse button and drag the pointer to another point.

  3. Click once to stop the line.

  4. Repeat steps 2 and 3 for as many segments as needed. Make sure the shape is completely closed.

To move a shape:

  1. Click on the shape you want to move.

  2. Holding the left mouse button depressed, drag it to the desired location.


Internal link <A HREF = "# ">

This command allows you to insert an internal hypertext link in your document. The hyperlink references the current document. Inserting an internal link inside a document creates a "target "; that is, a target destination.

The document's target list is found on the Existing destination(s) tab on the command Internal link.

  1. Select the element that will act as the hyperlink.

  2. In the Specialized tab, click on the Internal link icon. You can also use the shortcut SHIFT+ALT+I (Refer to list of shortcuts).

  3. If the destination for the hyperlink was not previously identified:

  • Select the New destination tab.

  • In the text box Name of the new link, enter a name for the link. The Choose the destination line of the link window will appear.

  • Select the location of the reference by clicking on the line which contains the target.

  4. If the destination for the hyperlink was already identified:

  • Select the tab Existing Destination. In the text box Existing Destination window, select the desired destination for the link by clicking on the name of the reference.

In your document, the following commands will appear:

To edit the references to a hyperlink, you can use tag recapture.


External Link <A HREF=" ">

This command allows you to insert an external hypertext link in your document; that is a link to another HTML document, image, or even an external reference to your site (to a Web page or to an e-mail address, for example). The hyperlink can be text or an image.

  1. Select the text or image that will act as the hyperlink.

  2. In the Specialized tab, click on the icon External link. You can also use the shortcut SHIFT+ALT+X (Refer to list of shortcuts).

  3. In the text box Reference to an external link, enter the access path and the file name. You can also search for the file in your folders by using the Open button.
    (It is important to note that the referred file name cannot contain special characters nor spaces in its name. Some browsers do not accept these options.)

  • If you refer to a document in one of your folders, the Link Content window appears below the dialog box. It allows you to view the contents of the link you have chosen.

  4. Select the type of external link from the following options:

  • None (direct link): direct link to another document (../../section/page.html).

  • HTTP link: link to an HTTP address (http://www.domain.com/).

  • FTP link: link to an FTP address (ftp://username:password@ftp.domain.com/).

  • e-mail: link to an e-mail address (mailto:email@address.com).

  • Newsgroup: link to a newsgroup (news:alt.groupname).

  5. If necessary, define an internal destination using the options found under Existing destination(s) if they already exist. If the internal destination has not been created, select the target in the Document content area and click on the Destination button. In the Insert an Internal Link dialog box that is displayed, indicate a name for the target and click on the OK button.

  6. Click on OK.

The following command will appear in your document:

To insert a link from the Windows desktop:

  1. Click on the file you want to link to your AceHTML document. Your file may be located on the Windows desktop or in one of the other Windows explorer windows.

  2. Drag the file to the desired location on the edit window.

The following command will appear in your document:

To edit the references to a hyperlink, you can use tag recapture.

Two other tabs allow you to define the link's target:

Existing destination(s)

This tab allows you to indicate a specific location inside a document where you want the link to point to. This location must have been defined previously with the command Internal link.

This option adds the # suffix to the hyperlink: <a href="Path/FileName#location">

Frame targets

Use this tab to indicate a target window (FRAME). This command is particularly useful if you work with frames (FRAME) or to make an additional browser window appear.

This option adds the TARGET attribute to the command HREF: <a href="AccessPath/FileName" target="LinkName">


Existing Internal Destination

The Existing internal destination, in the Specialized tab, provides you direct access to the current Existing destination when you insert internal links or external links. Internal destinations allow you to indicate the precise location in your document where the hyperlinks must refer to. For the targets to be displayed on this tab, the internal destinations must have been defined previously.

  1. Select the text or the image where you want to define an external link to an existing destination inside your HTML document.

  2. In the Specialized tab, click on the icon Existing internal destination.

  3. The tab Existing Destination(s) in the Internal link inside a document dialog box will appear.

  4. From the list, select the keyword which represents the link's target.

  5. Click on the OK button.

This option adds a bookmark (#) to the URL address:

To modify a hyperlink's references, you can use tag recapture.


Tables <TABLE>

When creating HTML documents, tables are particularly useful for defining the layout of a page. Tables make it easier to arrange text and images in columns. HTML code allows Embedded tables, that is, placing a table inside another table.

When you insert a table, AceHTML displays a window so that you can enter the table parameters. On the other hand, if you prefer to enter the HTML code directly in the edit window, then you can use the Quick table command.

  1. Position your cursor at the desired place in the table.

  2. In the Tables, frames and lists tab, click on the icon Insert a table. You can use the shortcut SHIFT+ALT+T (Refer to Shortcuts list).

  3. In the Insert a table window, indicate the number of columns and rows for the table in the appropriate boxes.

  4. Press on the OK button. The Table window is displayed.

  5. In the Preview window at the bottom of the screen, place the pointer before the code &nbsp; and enter manually the contents for each cell in the table.

  6. Press on the OK button.

To quickly change the size of cells in a table:

  1. Once the Table window is displayed, place the cursor on the line separating two cells or columns.
    The cursor changes to crosshairs pointing horizontally or vertically, depending where you placed the cursor.

  2. Keep the left mouse button pressed and drag the crosshair in the desired direction (left, right, top or bottom).

To modify a table in the table window:

  • Select one or more cells and then click on the icon to the right of the mouse.

  • Use the commands found in the Table window menu bar.

To insert HTML tags in the table:

  1. When the Table window is displayed, place the cursor at the desired location in the table.

  2. Click on the right mouse button to open the context menu.

  3. Click on the Tags option.

  4. Choose the tag you want to use from the list.

The following are optional options found in the <TABLE> command:

Width | You can adjust the width of the table by changing the Width. This value can be entered as a percentage or in pixels. To enter it as a percentage, check the box for "%". If this box is not checked, the value will be in pixels. By default the table is adjusted to 100% the size of the display. This option adds the attribute WIDTH to the TABLE tag: <table width="50%">…</table>
Height | You can adjust the width of the table by changing the Height. This value can be entered as a percentage or in pixels. To enter it as a percentage, check the box for "%". If this box is not checked, the value will be in pixels. By default the table is adjusted to 100% the size of the display. This option adds the attribute HEIGHT to the TABLE tag: <table height="50%">…</table>
Border | You can add a border to the table by indicating its width in the Border box. This value is expressed in pixels and the default value is 0. The higher the number, the thicker the border. This option adds the attribute BORDER to the TABLE tag: <table border="2">…</table>
Space in cells | You can adjust the space between cells and the border of a table by specifying a measurement in the Space in cells box. This value is expressed in pixels and the default value is 0. The higher the number, the larger the space between the contents in the cell and the border width. This option adds the attribute CELLPADDING to the TABLE tag: <table border="2" cellpadding="10">…</table>
Space between cells | You can adjust the space between cells in a table by specifying a measurement in the Space between cells box. This value is expressed in pixels and the default value is 0. The higher the number, the more space in between the cells and the larger the border (if there is one). This option adds the attribute CELLSPACING to the TABLE tag: <table cellspacing="10">…</table>
Background | You can add a background color to the table. Click on the Color button and select a color. This option adds the attribute BGCOLOR to the TABLE tag: <table border="0" bgcolor="#0000ff">
Horizontal Alignment | you can select the alignment of the table which is left by default, and center or place it to the right of your Web page. This option adds the attribute ALIGN to the TABLE tag: <table align="right">…</table>


Insert a Quick Table

This command is used to insert a table quickly. It inserts the table codes directly in the edit window. If you prefer to work in the Table window to define all the parameters of the table, use the Table command.

  1. From the Tables, frames and lists tab, click on the icon Insert a quick table.

  2. A grid made up columns and rows is displayed.

  3. Using the mouse, select the number of rows and columns for the table. To select, hold the mouse button depressed and drag it over the rows and columns.

You can also edit your table in order to modify it by selecting the HTML code and pressing the Table button.


Embedded tables

HTML code allows placing tables inside cells of other tables.

To insert a table inside another cell, you must be working in the edit window.

  1. Placed the cursor inside the tags belonging to the cell where you want to insert another table.
    A cell is defined by the <TD> <\TD> tags.

  2. Insert a table.


Editing Embedded Tables

Editing and modifying embedded tables can prove to be a bit difficult. The Edit Embedded Tables command makes this task easier.

You can also modify a table directly on the edit window. You must pay special attention to where you position the cursor to edit the contents of a cell or a row of cells. If done incorrectly, the TABLE tags could cause problems that would display the page incorrectly.

To verify the tags’ integrity, you can verify your document before you place it online in your site.

  1. Select the TABLE opening and closing tags of the main table

  2. Click on Insert table. The Table window is displayed.

  3. Inside the cell where the embedded table is found, you will see the TABLE tag. Place the cursor inside this cell.

  4. From the Table menu, select Edit table in cell or select the command from the context menu. A second table window is opened over the first one.
    The Edit table in cell command is not available if no embedded table is found on the selected cell. You can edit the different levels of the embedded table.

  5. Make the desired changes and click on OK to go back to the first window.


Modifying additional table properties

The properties that you indicate will be applied to a set of cells in the table.

  1. In the Table window, select the Table menu.

  2. Click on the Additional table properties item.

This window has two tabs: General and Advanced.

The General Tab:

Table title | When the mouse is moved over the table, the title specified in this box will be displayed at the bottom of the table in the Preview window. The TITLE="" code will be placed in the HTML document.
Browser Extensions | In this menu you choose a browser. There are two browsers to choose from, Netscape and Microsoft Internet Explorer. If you choose the option that is checked by default, Netscape Extensions, you will be choosing the options that will be viewed by both browsers. If you choose Microsoft Extensions, you will have additional options that will only be displayed by Microsoft Internet Explorer. These options refer to the horizontal alignment of a table.
Vertical alignment | This option is used to specify the table’s alignment with respect to the Web page.
Table Caption | This option is used together with other HTML commands. The table title is not displayed when the page is displayed in the browser window. <caption> name </caption> is inserted in the HTML document.
Table summary | In order to identify the contents of each table in the HTML document, you can enter a summary for each table. This information is useful for the author of the Web page and is not displayed by the browser. The code <table summary="explanation"> is inserted in the HTML document.

The Advanced Tab:

These commands apply to Microsoft Internet Explorer only.

Background Image

You can add a background image for the table. Click on the Open and select the desired image.

External borders

You can indicate the type of borders you want to place on the table.
The external border types are:

  • All: The whole table will have external borders, that is left, right, bottom and top.

  • Top: A border will be added to the top of the table. AceHTML will insert FRAME="ABOVE" in the TABLE tag.

  • Bottom: A border will be added to the bottom of the table. AceHTML will insert FRAME="BELOW" in the TABLE tag.

  • Left: A border will be added to the left of the table. AceHTML will insert FRAME="LHS" in the TABLE tag.

  • Right: A border will be added to the right of the table. AceHTML will insert FRAME="RHS" in the TABLE tag.

You can also select two options at the same time. If you select Top and Bottom, AceHTML will insert FRAME="HSIDES". The table will display external horizontal borders in the top and bottom sides of the table. If you select Left and Right, AceHTML will insert FRAME="VSIDES". The table will display external vertical borders on the right and left sides of the table.

Dark border

You can change the color of the table’s borders so that they appear darker. Click on the Color button and select the desired color.

Light border

You can change the color of the table’s borders so that they appear lighter. Click on the Color button and select the desired color.

Internal borders

You can display the internal borders of a table by selecting Activate all borders, which is the default option. you can also choose to deactivate this option. You can also display the horizontal borders between all rows or display the vertical borders between columns. If you choose Display borders between groups, you will only see the rows internal borders (if any) and the internal borders of grouped columns (if any).


File Menu of the Table Window

New Table | Select New Table from the File menu to create a new table in the HTML document.
Open Table | Used to open an existing file in a HTML document with the help of the Open File(s) window.
Save Table | Used to save the current table. You also use this command again to save changes made to a table already saved.
Save Table As | Used to save the active table under a new name. You can use this command to save an existing table under a new name when you want to keep both versions.
Close | Used to close the Table window in which you are working. You can also click on the window’s close box.


Edit Menu of the Table Menu Window

Undo | This command is used to undo the last steps taken while editing a table. When you select this option for the first time, AceHTML cancels the last editing step. If you select the option again, AceHTML cancels the step previous to the last step, and if you continue to press Undo, it keeps "undoing" the previous steps.
Redo | This command is used to redo the steps that you previously cancelled while editing the table. When you select this option for the first time, AceHTML re-does the last step that you previously cancelled. In the same was as the Undo command, this command "re-does" successively, the steps that you previously cancelled.
Cut | This command cuts the contents of a cell and places it in the Clipboard. You can then paste the contents in other cell, using Paste from the Edit menu.
Copy | This command copies the contents of a cell and places it in the Clipboard. You can then paste the contents in other cell, using Paste from the Edit menu.
Paste | This command inserts the contents of the Clipboard in the selected cell. Since the last information placed in the Clipboard is always available until it is erased by something new, you can paste the information it contains over and over again in different cells, simply by selecting Paste from the Edit menu.
Delete | This command is used to delete selected text.
Erase row | This command is used to delete the row selected.
Erase column | This command is used to delete the column selected.
Erase table | This command is used to delete the table selected.
Select rows | This command is used to select a complete row in a table by placing the cursor in the desired row. To deselect it, click in any place in the table
Select columns | This command is used to select a complete column in a table by placing the cursor in the desired column. To deselect it, click in any place in the table.
Select table | This command is used to select the table by placing the cursor at any location in the Preview window. To deselect it, click in any place in the table.

You can also select the elements in a table in the Table window by dragging the mouse pointer over the cells.


Options Menu of the Table Window

Show NoBreakSpace | This options allows you to view the &nbsp; code.
Force all attributes | This option inserts the table attributes and the cell attributes according to the format chosen in the edit window. This is useful when viewing the table code in the edit window. In this way you can differentiate the tags in the table from its attributes.
Always show cell borders | Always display borders on the Preview area of the Table Window.
Use named colors | This option places the name of colors instead of their hexadecimal value in the COLOR or BGCOLOR attribute.

Example of tags in uppercase and attributes in lower case:


Table Menu of the Table Window

This menu has several options to insert, delete and merge cells and rows. You can also modify the properties of each of the cells and columns in a table. The following are the different option in the Table menu:

  • Edit embedded table

  • Edit cell

  • Insert cells

  • Delete cells

  • Merge cells

  • Split cells

  • Insert columns

  • Delete columns

  • Merge columns

  • Insert rows

  • Delete rows

  • Merge rows

  • Cell properties

  • Row properties

  • Column properties

  • Additional table properties


Cell Properties

The properties you indicate will be applied to the selected cell, that is to the to the command TD or TH. This window has two tabs: General and Advanced.

  1. Select the cell or cells to be modified.

  2. In Table window, click on the Table menu.

  3. Click on the Cell properties option.

The General tab:

Horizontal Alignment

The horizontal alignment of text inside a cell can be set to the left (default), right, centered or justified. The ALIGN attribute is added to the TD tag. <td width="25" align="left">cell contents </td>

Vertical Alignment

The vertical alignment of text found in a cell could be set to the top, centered (default), bottom or on the cell’s baseline. The VALIGN attribute is added to the TD tag. <td width="25" valign="center">cell contents </td>

Width

The cell’s width can be expressed as a percentage or in pixels. To enter a percentage, the "%" box should be checked. If the box is not checked, then the value is set to pixels. The WIDTH attribute is added to the TD. <TD WIDTH="25">cell contents</TD>

Height

The cell’s height can be expressed as a percentage or in pixels. To enter a percentage, the "%" box should be checked. If the box is not checked, then the value is set to pixels.
The HEIGHT attribute is added to the TD tag. <td width="60%" height="20%">&nbsp;</td>

Color options

Background
you can change the background color of the cell. This option does not modify the table’s background color. click on the Color button and select the desired color. The BGCOLOR attribute is added to the TD tag. <td width="60%" bgcolor="#0000ff">&nbsp;</td>

Border
Only Microsoft Internet Explorer displays a cell’s border. Click on the button Color and select the desired color. <td width="60%" bordercolor="#0000ff">&nbsp;</td>

Header cells/
Data cells

Indicate if it’s a header cell (TH) or a data cell (TD). Header cells are generally used for the first row or column in a table. They differ from data cells because they are displayed in bold. <th width="25">&nbsp;</th>

No wrap

The no wrap option prevents word wrapping of text in the cell. It adds the NOWRAP attribute to the command TD or TH. <th width="25" nowrap>&nbsp;</th>

Advanced tab:

These commands apply to Microsoft Internet Explorer only.

Background image | With Microsoft Internet Explorer, you can add a background image to a cell. Click on the Open button and select the desired image.
Dark border | You can change the color of borders to make them appear darker. Click on the Color button and select the desired color.
Light border | You can change the color of borders to make them appear lighter. Click on the Color button and select the desired color.
Title | When the mouse pointer is placed over the cell, a title will be displayed at the bottom of the table in the Preview window. TITLE="" is inserted in the HTML page. <td title="cell">&nbsp;</td>


Insert cells

There are two ways you can insert one or more cells in the table:

  • From the Table window

  • Directly from the Edit window.

With the first method you can indicate the cell’s properties and attributes.

To insert a cell using the edit window:

  1. Place the cursor in the edit window in the location where you want to add a cell.

  2. From the Tables, Frames and Lists tab, click on the button Insert a cell.
    AceHTML inserts the tags <td></td>.

  3. Place the cursor inside the opening and closing tags and enter the contents for the cell:
    <td>    enter contents here</td>.

To insert a cell from the Table window:

  1. Select the TABLE opening and closing tags.

  2. Click on Insert a Table.

  3. From the Table window, select a cell

  4. From the Table menu, select Insert cells.

To insert more than one cell, first indicate the number of cells.

The new cell can be placed to the left or top of the selected cell:

Shift cells right | This option inserts a cell to the left, shifting the adjacent cells to the right and thus creating a new column to the left of the insertion point.
Shift cells bottom | This option inserts a cell at the top of the insertion point, shifting to the bottom the adjacent cells and thus creating a new row at the top of the point of insertion.
Insert whole row | This option creates a new row below the point of insertion.
Insert whole column | This option creates a new column to the left of the point of insertion.


Edit the Contents of a Cell

Editing the contents of a cell includes applying the text properties and attributes as well as inserting objects and dynamic elements. You can modify the contents of a cell directly on the edit window or using the Table window.

On the edit window, you must pay special attention to the location where you place the cursor in order to edit the contents of a cell or row of cells. If done incorrectly, the TD or TR tags could cause problems that would display the page incorrectly specially with the Netscape browser.

To verify the tags’ integrity, you can verify your document before you place it online in your site.

On the Table window, each table cell is separated by borders, which makes it easier to check the contents. However, if you have a lot of contents in the cells, you might not have enough space to display it all.

  1. Select the TABLE opening and closing tag.

  2. Click on Insert table. The Table window is displayed.

  3. Place the cursor inside the cell whose contents you want to change.

  4. From the Table menu, select Edit Cell
    or
    Select Edit Cell from the context menu.
    The Cell Content window is displayed.
    All the cell content is visible and you can use the scroll bar to scroll down. You can also enlarge the window using the Windows buttons found on the upper right corner of the window.
    Click on either of the two buttons Common and Specialized to access a set of the most frequent commands used with cells.

  5. To modify the cell:

  • Select the elements you want to change.

  • Click on either button and select the desired command.

  6. Click on OK to return to the Table window.

The context menu contains editing commands such as Cut, Copy and Paste.


Deleting cells

You can delete one or several cells in a table.

  1. In the Table window, select the cells you want to delete.

  2. From the Table menu, select the Delete cells option.

The new cell can be placed to the left or top of the selected cell.

Shift cells right | This option is used to shift other cells in a row, leaving an empty cell at the end.
Shift cells to the bottom | This option is used to shift the other cells in the column to the top, leaving an empty cell at the bottom of the column.
Delete whole rows | This option is used to delete all the cells in a row.
Delete whole columns | This option is used to delete all the cells in a column.

It is strongly suggested that a thorough verification of the document is done before making any changes.


Merging Cells

In a table, cells can be merged horizontally or vertically.

  1. Select the cells that you wish to merge.
    These must be adjacent cells.

  2. From the Table menu of the Table window, click on the option Merge cells.

If you merge cells found on the same row, AceHTML adds the COLSPAN to that row’s TD command.

If you merge cells in the same column, AceHTML add the ROWSPAN to that column’s TD command.


Splitting cells

<tr>
<td colspan="2">&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td rowspan="2">&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>

COLSPAN="2": indicates that the cell is divided in 2 columns.

ROWSPAN="2": indicates that the cell is divided in 2 rows.

Splitting cells

You can split a cell in any number of columns and rows.

  1. Select the cell you want to split;

  2. From the Table menu, select the Split cells option;

  3. Determine the number of columns and rows in which you want to split the cell;

  4. Click on OK.

If you split a cell, AceHTML adds the COLSPAN attribute to the rows’ TD command.


Column Properties

<col align="center">

or

<colgroup align="center">

<col valign="center">

or

<colgroup valign="center">

<Col Width="31%">

<col title="column 2">

Column Properties

The properties indicated will be applied to all the cells in the selected column.

When you define properties that must be applied to a column in a table, the COL or COLGROUP tag is added to the table definition while the Group is active

  1. Select the column or columns that you want to change.

  2. In the Table window, click on the Table menu.

  3. Click on the Column properties option.

This window has a General tab:

Horizontal Alignment | The horizontal alignment of text inside all the cells in a column can be set to the left (default), right, centered or justified. he following HTML tags are inserted: <COL ALIGN> or <COLGROUP ALIGN>
Alignment vertical | The vertical alignment of text inside all the cells in a column can be set to the top, bottom, centered (default) or on the cell’s baseline. The VALIGN attribute is added to the TD tag.
Background color | You can change the background color of the cells in a column. This option does not modify the table’s background color. Click on the button Color button and select the desired color.
Width | The width of cells in a column can be expressed as a percentage or in pixels. To indicate the width as a percentage, place a check mark in the "%" box. If this box is not checked, the value is set to pixels. The WIDTH attribute is added to the COL tag.
Group | This option is used to define a group; the COLGROUP code is inserted in the HTML page.
Title | When the mouse pointer is moved over any of the cells in a column, the title indicated here will be displayed at the bottom of the table in the Preview window. TITLE="" is inserted in the HTML page.


Insert columns

You can insert one or more columns in the table.

  1. In the Table window, select a column.

  2. From the menu Table, click on the Insert column option.
    A dialog box is displayed.

  3. Select the insertion point where you want to insert your table.

Insert a column as first | Insert a column at the beginning of the table.
Insert a column before | Insert a column before the column that precedes the point of insertion.
Insert a column after | Insert a column after the column that follows the point of insertion.
Insert a column as last | Insert a column at the end of a table.

To insert more than one column at a time, first select the corresponding number of columns.


Delete columns

You can delete one ore more columns from the table.

  1. In the Table window, select the columns to be deleted.

  2. From the Table menu, click on the Delete columns option.

If you delete a cell directly from the edit window, pay special attention to the cells integrity. It is strongly suggested that you verify your document.


Merge columns

You can merge one or more columns in a table.

  1. In the Table window, select adjacent columns that you want to merge.

  2. From the Table menu, click on the Merge columns option.


Row properties

The properties you indicate will be applied to all the cells in the selected row.

When you define properties that must be applied to a row in a table, the TD tag is changed to TR or TBODY while the Group is active.

  1. Select the row or rows that you want to change.

  2. In the Table window, click on the Table menu.

  3. Click on the Row properties option.

Horizontal Alignment | The horizontal alignment of text inside all the cells in a row can be set to the left (default), right, centered or justified. The following HTML tags are inserted: <TR ALIGN> or <TBODY ALIGN>.
Vertical Alignment | The vertical alignment of text inside all the cells in a row can be set to the top, bottom, centered (default) or on the cell’s baseline. The HTML code inserted is <TR VALIGN> or <TBODY VALIGN>.
Background color | You can change the background color of a row of cells. This option does not modify the table’s background color. Click on the button Color button and select the desired color.
Border color | You can change the color of the borders of a row of cells so that appear in a darker color. Click on the Color button and select the desired color.
Group | This option is used to define a group; TBODY is inserted in the HTML document.
Title | When the mouse pointer is moved over the row, the title inserted in this option will be displayed at the bottom of the table in the Preview window. TITLE="" is inserted in the HTML document.


Insert rows

There are two methods to insert one or more rows of cells in the table:

  • From the Table window

  • Directly in the edit window.

With the first method you can indicate the cell’s properties and attributes.

To insert a row using the edit window:

  1. Place the cursor in the edit window in the location where you want to add a row.

  2. From the Tables, Frames and Lists tab, click on the button Add a row.
    AceHTML inserts the tags <tr></tr>.

  3. Place the cursor inside the opening and closing tags and enter the contents for the cell:
    <tr>    enter contents here</tr>.

To insert a row using the Table window:

  1. Select the TABLE opening and closing tags.

  2. Click on Insert a Table.

  3. In the Table window, select a row.

  4. From the Table menu, select the Insert row option.
    A dialog box is displayed.

  5. Select the insertion point where you want to insert your table.

Insert a row first | Insert a row at the beginning of the table.
Insert a row before | Insert a row before the row that precedes the point of insertion.
Insert a row after | Insert a row after the row that follows the point of insertion.
Insert a row as last | Insert a row at the end of a table.

To insert more than one row at a time, first select a corresponding number of rows.


Delete rows

You can delete one or more rows in a table.

  1. In the Table window, select the row or rows to delete.

  2. From the Table menu, select the Delete rows option.

If you delete a row directly from the edit window, pay special attention to the cells integrity. It is strongly suggested that you verify your document.


Merge rows

You can merge two or more rows in a table.

  1. In the Table window, select the adjacent rows you want to merge.

  2. From the Table menu, click on the Merge rows option.

You cannot merge all the rows in a table. If you select all the rows in a table, you will notice that the Merge rows option in the Table menu is grayed out.


Frames <FRAMESET>

Frames allow you to divide a page into several windows, each of them displaying a different HTML document. The HTML document containing the frames does not include the BODY command nor any other HTML commands. If any are present they are simply ignored. The frames page uses the main <FRAMESET> tag.

To insert frames in your document:

  1. In the Table, Frames and Lists tab, click on the Insert Frames. You can use the shortcut SHIFT+ALT+F (Refer to Shortcuts list).
    The Insert frames window is displayed.

  2. Divide the window as you like and define the properties of each frame.

  3. As needed, defines the properties of the frame page.

AceHTML inserts the following command in your document:

You can modify a frame definition with the help of the Tag capture method.

The Insert frames window

This windows displays a preview area where you can view your page as you design it. To the left of the window there is a series of buttons which you can use to define the parameters of each frame.

You can also use the context menu (right mouse button) to access commands. First you must place the cursor inside the frame you want to define.

This button is used to split the page vertically into several frames.

This button is used to split the page horizontally into several frames.

This button is used to open the Properties of selected frame dialog box.

This button is used to delete a frame selected.

This button is used to open the dialog box Properties that apply to the HTML page that contains the frames.

This button is used to delete all the frames that you have defined in the window.

Once frames have been created, you can resize them manually:

  1. Place the mouse pointer on one of the division bars.

  2. Click and drag the division bar in order to resize the frame.


Create a single frame <IFRAME>

Single frames can only be used with Microsoft Internet Explorer. Follow the steps below to create a single frame:

  1. Click on Insert frames.

  2. Indicate the properties and source file for the frame by clicking on the Frame properties Frame properties button (you can also use the context menu by clicking on the mouse's right button).

  3. Specify the source HTML file in the File source; as needed, use the Open File(s) button.

  4. Enter the identifier name for the frame.

  5. Specify the type of scrolling.

  6. Indicate the top and left margins inside the frame.

You can indicate additional frame properties by doing the following:

  1. In the dialog box Frame properties, click on the Other properties tab.

  2. Specify the frame alignment.

  3. If necessary, indicate the frame size in the Width and Height boxes.

  4. Indicate if you want to place a border around the frame by checking the box Frame border.


Frame properties

The frame properties that you modify with this command only apply to that frame in particular.

  1. In the Insert frames window, place the pointer on the frame you want to modify.

  2. Click on the Frame properties button.

This window contains two tabs: General and Other Properties.

The General tab:

With the menu on this tab you can assign properties and indicate the HTML source file for the frame.

File source

In the Source file text box, write the path and the name of the reference HTML file for the selected frame. You can also find it by pressing the Open button.

Frame Name

In the Frame name text box, you must give a name to your frame. This option will add the NAME attribute to the <FRAME SRC="..."> command. The NAME attribute is useful when you use the TARGET attribute in a hypertext link. If you want a hypertext link to reference a particular frame, you must add the TARGET="FrameName" attribute to your hypertext link. This attribute is also useful when you work with JavaScripts.

Always suggest a name to the frame

If this option is checked, the program will suggest a name for the frame. The suggested name corresponds to the name of the HTML file which you have referenced as the source document without the .html extension. Let’s assume that you have specified link.html in the Source file text box as the name of the file to be referenced for the selected frame; the name suggested by the program will simply be link.

Scrolling

You can also include or forbid scroll bars in your frame. The automatic option will display the bars if the content of the frame is wider or longer than the space provided. This option is activated by default.

  • By selecting the Yes option, the scroll bars will be added to the frame. This option will add the SCROLLING="YES" attribute to the <FRAME> command.

  • By selecting the No option, the scroll bars will be forbidden even if the content of the frame is wider or longer than the space provided. This option will add the SCROLLING="NO" attribute to the <FRAME> command.

Margins

In this area you can modify the height and the width of the document which appears inside the frame. You must enter the values in pixels in the corresponding boxes. The smallest accepted value is 1 pixel. This option will add the MARGINHEIGHT and MARGINWIDTH attributes to the command <FRAME>.

No resize

You can prevent visitors from resizing frames. This option adds the attribute NORESIZE to the command <FRAME>. NORESIZE is optional. All frames can be resized by default.

The Other Properties tab:

Border color button

The Netscape 3.0 browser allows you to add a color to the borders of the frame.

  • Click on the Color button.The default color is gray.

This option adds the attribute BORDERCOLOR to the command <FRAME>.

Frame size in pixels

This option allows you to indicate the exact height and width of a frame in pixels.

Border around the frame

This option allows you to decide whether your frames will have a border or not. If you leave the check mark inside the box, there will be a border around the frame. If you remove the check mark from the box, there won't be a border and the FRAMEBORDER="0" attribute will be added to the <FRAMESET> command. This option does not remove the border but simply frees the space that it usually takes. To remove the space, you need to make changes in the Properties of the frame page.


Properties of the Frame Page

The frame properties that you modify using this command are applied to the HTML document that contains the frames.

  1. In the Insert frames window, place the cursor on the frame you want to modify.

  2. Click on the button Frame properties.

Space between frames button [image] button | These two options are used to adjust the width of the frame borders. Microsoft Internet Explorer and Netscape do not use the same attributes. Microsoft Internet Explorer add the FRAMESPACING attribute to the command <FRAMESET>, while Netscape adds the BORDER attribute to the same command. These two attributes have the same effect. Values are expressed in pixels.
Border Color | Netscape 3.0 allows you to add a color to frame borders. To add a color to borders, you can select a color from the Color button. The default color is gray. This option adds the attribute BORDERCOLOR to the command <FRAMESET>.
Frame border | This attribute is used to keep spacing or not between frames. The default option is the use of a border. If you disable this option, the border will be removed. This option adds the attribute FRAMEBORDER="0" to the command <FRAMESET>.


Additional frame properties

General frame properties

Property

Description

HTML tags

Source File

The document appears in the frame.

SRC="fileName.html"

Identifier name

Name that identifies the frame.

NAME="Frame Name "

Scroll

  • automatic: the browser will scroll the page as needed

  • yes: scroll bars are added

  • no: no scrolling of page is allowed

Automatic is the default SCROLLING="Yes|No"

Margins

Indicates the size in pixels of the current frame margins.

MARGINWIDTH=number
MARGINHEIGHT=number

No resize

When this box is checked, the user cannot resize the frame.

The default allows resizing NORESIZE (no resizing)

Additional frame properties

Property

Description

HTML tags

Border color

Indicate the color of the frame border (only displayed by Netscape).

BORDERCOLOR="#hexadecimal code "

Frame size in pixels

Indicates the fixed width and/or height of the frame in pixels.

COLS="nb pixels|%, nb pixels|%"
ROWS="nb pixels|%, nb pixels|%"

Frame border

Indicates whether the frame has a border.

FRAMEBORDER="Yes|No"

Properties of the set of frames

Property

Description

HTML tags

Space between frames

Specify the space in pixels between frames.

FRAMESPACING=number (Netscape)
BORDER=number (Explorer)

Border color

Indicate the color of the border (Netscape only).

BORDERCOLOR="#hexadecimal code "

Frame border

Specify if the frame contain a border or not.

FRAMEBORDER="Yes|No"

Properties of a single frame
Property | Description | HTML tags
Alignment | indicates the alignment of a single frame. | ALIGN="top|bottom|left|right|middle"
Vertical space | vertical spacing between frames and surrounding text. | VSPACE=number
Horizontal space | horizontal spacing between frames and surrounding text. | HSPACE=number


Frame target

<html>
<head>
<title>Welcome to my page </title>
<meta name="Generator" content="AceHTML">
<base target="_blank">
</head>

<body>
. . .
</body>
</html>

Frame target

The frame target corresponds to the window in which the target for the hypertext link will appear. By default, browsers display the target of a link in the same window. You can specify where the link will appear by defining the frame target in your page frame, or in another browser window.

You indicate the frame target when you create hypertext external links.

The frame target is identified by the TARGET attribute which is added to the A HREF command:

<A HREF="home.html" TARGET="b">Home</A>

Defining a frame target

You can define a frame target for each of the hypertext links that you add to a Web page. You can also define a default frame target for all the links indicated in the page.

  1. On the Specialized tab, click on the External Link button. The External link dialog box is displayed.

  2. In the External link dialog box click on the Frame targets tab.

  3. In the text box Target (frame name) enter the name of the frame target if you already defined it.
    If it is not a custom frame, click on the corresponding option of the type of destination frame you want which brings up the definition table.

  • Select identification names for the frames with the help of the NAME attribute In the HTML document that contains the frame code.

To define a default frame target for all the links in the document:

The definition of a frame target will apply to all the links in a page, except those links that indicate a different target. This information should be entered directly on the edit window:

  1. In the edit window, place the cursor inside the <HEAD> and </HEAD> tags and enter the following command: <BASE TARGET ="target_frame">.
    For example:


Frame target names

Besides the frames that you name personally, HTML code has defines four types of frame targets:

The name you assign to a frame | When the user clicks on a link, the page will appear on the frame you have defined in a frame page. <A HREF="page.html" TARGET="bas">Link</A>
_top | When the user clicks on a link, the contents will replace the contents of the active page frame. <A HREF="page.html" TARGET="_top">Link</A>
_blank | When the user clicks on a link, the contents will appear in a new browser window. <A HREF="page.html" TARGET="_blank">Link</A>
_self | When the user clicks on a link, the contents will replace the current frame. <A HREF="page.html" TARGET="_self">Link</A> "_self" is the default option used by browsers.
_parent | When the user clicks on a link, the contents will appear in the first parent frame. <A HREF="page.html" TARGET="_parent">Link</A>
_search | When the user clicks on a link, the contents will appear in a frame at the left of the screen. <A HREF="page.html" TARGET="_search">Link</A>


Style sheets <STYLE>

Style sheets allow the authors of Web pages to use very sophisticated formatting. They allow, among other things, paragraph indenting, changing header styles and even spacing between paragraphs. In this way, Style sheets provide a better control of the layout of a Web page.

Style sheets are also used in combination with JavaScript, which incorporates DHTML codes.

With all the new languages being used today, you will find it very advantageous to use style sheets.

Version of style sheets

The use of style sheets in AceHTML refers to the CSS2 version. W3C at http://www.w3.org/ style/ provides a number of resources for authors who want to use style sheets. The links also allow obtaining information concerning CSS versions in particular: CSS1, CSS2.

The specifications of each version are important and must be considered according to the browser version which you use as a standard for your Web page.

The types of style sheets

AceHTML allows using three types of style sheets:

Inline style sheets | The styles are used on selected text in a similar way as HTML tags.
Internal style sheets | The styles are defined within the header section of the document. (<HEAD>).
External style sheets | The styles are defined in a separate file which has a .css extension, making it easier to maintain and format styles.


The Style Sheets Wizard options

The Wizard helps you define the following properties and values:

Left side of the window

List of properties of a CSS element, the attributes of an element as well as the expression of the value of the attribute. This list is presented in the form of a tree: the + plus sign indicates that there is a sub-list available.

  • Choose the property that you want to modify before continuing with the editing the style.

The name that identifies the right side of the window displays the property or value chosen.

Upper right corner of the window

This area is modified according to the main property selected in the left side of the window. They type of input field (input text field, drop-down list, single choice drop-down list) indicates the type of information you should enter here. When you have finished defining the style, brackets appear around the property or the selected value in the left side of the window.

Selector

Style rules are made up of a selector and a statement. The selector represents the element (tag, class, ID, pseudo-element) on which the defined styles will be applied. When a tag is selected in the HTML tag area, it is automatically displayed as a selector.

Class name

The CLASS selector allows applying the same styles to many HTML tags at the same time. And conversely, many styles can be applied to the same tag. The CLASS selector is very useful to group HTML tags that have similar properties. In this way you can easily modify the statement for a class thereby modifying all the styles of tags it groups.

HTML tag

The drop-down list is used to access HTML tags that can be used as selectors. The style definition is applied only to the chosen HTML tag. It is also possible to combine an HTML tag and a class at the same in order to apply more than one style definition for the selected tag.

Pseudo-element

The CSS1 norm allows two types of pseudo-elements: first-line and first-letter. These correspond to usual typographic effects you see everywhere. First-line is used to modify the style of the first line of a paragraph, while first-letter is used to change the appearance of the first letter in a sentence.

ID Selector

Contrary to the CLASS selector, the ID selector is only applied to one element only. It is used as an identifying element. In other words, all elements can use an ID selector, as long as the name of each one is different from the others.

Reset

When you click on this button, all the styles displayed are reset to their initial values, and the properties that you defined are erased.

Comments

Here you can type text to describe the use that you want to give to a certain style. This information might be useful in case different people are working on the same pages.

Once you quit the Wizard, you are returned to the main window of the module that allows you to design your own styles. The styles that you created are displayed in the list.


Creating internal style sheets

The internal style sheet is used to define the style rules in the header of an HTML document. The style sheet is inserted between HTML tags placed within a document.

  1. Click on the CSS tab.

  2. Click on the Edit document button.

The defined style sheets dialog box presents a menu bar to facilitate the maintaining and updating of styles. The window’s top area presents the list of previously defined styles. The bottom area displays the URL addresses of style rules you have already imported.

To create an internal style sheet:

  1. From the menu Style of the Defined style sheets window, click on the New option. The style sheet Wizard. The Wizard proposes several options.

  2. Select a property and, if needed, choose a value on the left side of the window.

  • The Plus sign indicates that there are sub-elements under the chosen element. Click on the symbol to display the list.
    A bracket will be added to the selected element once the parameters are defined.

  3. On the right side of the dialog box, define the properties and attributes and associate them with a style selector.

  4. Click on the OK button.

Inside the header of document <HEAD> </HEAD>, AceHTML adds the style sheet:

You can easily modify or remove a rule belonging to a style sheet.


Adding a contextual selector

The CSS rules authorize the creation of contextual styles, that is, rules that must be applied in a particular context.

  1. Once the style sheet Wizard is on screen, define the main style rule and choose the main selector defining the parent HTML tag.
    See options of the style sheet Wizard    .

  2. In the Selector text box, insert a space after or before the main selector and select the tag to be used in a contextual form.
    The two tag names are placed side by side in the selector area.

  3. Complete the required information to define the rule.

  4. Click on the OK button.


Modifying a style sheet

  1. In the Defined style sheets window select the style you wish to modify.

  2. From the Style menu, click on the Modified option.

  3. Make the desired changes.

To delete a style:

  1. In the Defined style sheets window select the style you wish to delete.

  2. From the File menu, click on the Delete option.

A warning message asks to confirm deletion. Be careful, this operation cannot be cancelled.


Managing URLs of Imported Style Sheets

You can also use the options of management of available links in the style sheets module. These options help you to efficiently manage the links between your documents and files.

  1. Display the Defined Style Sheets window.

  2. IN the UL menu, click on the New option.

  3. In the entry area, type the complete address of the URL.

Modify a URL:

  1. In the Defined Style Sheets window, select the address you want to change.

  2. In the URL menu, click on the Edit menu.

  3. Change the address.

Delete a URL:

  1. In the Defined Style Sheets window, select the address you want to delete.

  2. In the URL menu, click on the Delete option.

An alert message asks you to confirm the deletion. Be careful: this operation cannot be cancelled.


External style sheets

To make a link to a style sheet, you can use the relation link command of the document header properties.

  1. Click on the Edit links button on the CSS tab.
    A window is displayed in the preview window. The style sheets linked to the current document are displayed. If the area is empty, that means that no style sheet is attached to the document.

  2. Click on the Add button. The Open file(s) dialog box is displayed..

  3. Select the desired file and click on the Open button.
    Links to external style sheets     appears again. The selected file name appears in the field located to the left of the Open file(s) button.

  4. Click on the Add button to add it to the list.

  5. Click on the Ok button when you finish.

Inside the header of document <HEAD> </HEAD> AceHTML automatically inserts the following command line:

To modify an external style sheet:

  1. While the Links to external style sheets window is displayed, click on the style sheet to be modified to select it.
    The file .css name is copied in the bottom area of the display.

  2. Click on the Modified button
    The links to External style sheets window appears.

  3. Make the desired changes with the aid of the Style sheet Wizard.

To delete a link to an external style sheet:

  1. While links to External style sheets window is displayed, click on the style sheet to be modified to select it.
    The file .css name is copied to the bottom area of the display.

  2. Click on the Delete button.
    The corresponding file name disappears from the list and the related command in the edit window.

You can also erase the command line directly in the edit window.


Creating an inline style

The inline style is only applied to the text line for which the rule is defined. An inline style consists in inserting the style rule inside the same HTML tag. The defined style applies to that tag.

  1. Click on the CSS tab

  2. Click on the Edit inline STYLE button.

  3. The Style sheet Wizard appears.
    While you edit an inline style, you only have access to property or value attributes selected in the window’s right side.

  4. Select a property and, if needed, choose a value on the left side of the window.

  5. In the upper right corner of the window, define the element’s parameters that you have selected. Once the parameters are defined, brackets appear next to the property or value name.

  6. Click on the OK button.


Creating an external style sheets

External style sheets are independent files that have the .css extension. These are linked to the document through a relation link. The advantage of working with external style sheets is that you can use them for several documents. Working with external style sheet ensures a uniform formatting of your Web pages.

  1. Click on the CSS tab.

  2. Click on the Edit external file button. The External Style Sheet window is displayed.

  3. From the File menu, click on the option NEW CSS sheet. The window’s name changes to Defined Style Sheets.

  4. From the file menu which is now active, click on the option New CSS.
    The Style Sheet Wizard is displayed.

  5. Define the style rules you want to create.

  6. From the File menu on the Define style sheet window, click on the option Save CSS to save your style sheet.

  • If the style sheet already exists, the new definitions replace the olds ones without a confirmation box being displayed.

  • If it is a new style sheet the Save file dialog box is displayed. Specify the file name and the folder. Make sure the type of file is .css format.

You can easily modify or remove a rule belonging to a style sheet.

To save an external style sheet under a different name:

This command is useful when you want to use an existing style sheet as a template to create a new style sheet.

  1. Once you have made changes to the file, click on the Save CSS As from the File menu found on the Defined Style Sheets window.

  2. In the File Name text box from dialog box Save file, type a name to identify the file.

  3. Check the folder.

  4. In the Files of Type text box, make sure that the file’s extension is .css.

  5. Click on the Save button.

To open an existing style sheet:

  1. From the File menu of the Defined style sheets window, click on the Open CSS option.
    In the dialog box Open Files(s) appears.
    By default, AceHTML only displays files that have the .css extension.

  2. Select the desired CSS file.

  3. All rules contained in the document appear in the Defined style sheets window.


Using favorites

The option Favorites is useful to for keeping in memory the styles you use more frequently.

  1. Click on the CSS tab.

  2. Click on the Edit External File. The External Style Sheet window is displayed.

  3. In the Favorites menu, click on the option Organize favorites.

  4. In the text box, enter a name to identify the new entry.

  5. Click on the Add button.
    The Specify a name for the favorite dialog box is displayed.

  6. Identify the style sheet that you want to add and click on the OK button.
    The open file(s) dialog box is displayed.

  7. Select the desired style sheet and click on the Open button.

  8. The style sheet is displayed in the list, identified with the name you assigned to it.

  9. Click on the Close button.

You will note that the Favorite that you have added to the list is displayed at the bottom of the Favorites list.

Using the External Style Sheet you can do the following;

Add

Allows you to add an example to the list. When adding a favorite, you must specify a name to identify it. Open file(s) window appears next allowing you to locate the .css file that you wish to add.

Rename

This option allows you to give a new name to the favorite.

  1. Click on the favorite to be modified at the top of the window.

  2. Click on the Rename button.

  3. Type the new name in the input field.

Delete

This option allows you to delete a favorite.

  1. Click on the favorite to be deleted at the top of the window.

  2. Click on the Delete button.

A warning message asks to confirm deletion. Be careful, this operation cannot be cancelled.

To check a favorite:

  1. Click on the Edit External file button to display the Defined style sheets window.

  2. Click on the Favorites menu

  3. The menu is divided into two sections. At the bottom of the list you will see the favorites you added.

  4. Click on the style you want to check.

  5. The styles found on the external style sheet are displayed in the window. You can modify them by double clicking on the desire style to bring up the Wizard.


Form definition <FORM>

The Form command allows the user to transmit information to a server. It’s a graphic interface and uses push buttons, text boxes, list boxes, etc. Inside the <FORM> and </FORM> tags you can find the following commands:

INPUT, SELECT or TEXTAREA, all the other information directly related to the form must be inserted within these tags, including the text that accompanies each form field.

  1. In the Form tab, click on Form definition button.
    The form definition box appears.

  2. In the Action text box, type the address needed to complete the command’s execution. You can select the desired URL address type among the following options. Then, a syntax example appears in the input field.
    This address will be the recipient of the information entered in the form. If the Action is absent, the URL is the same as the current document.

  3. In the Send method button, select the method of submitting the form to a web server. There are two methods, GET and POST.
    The GET method directs information to go through a variable QUERY_STRING to interpret data. This method must be used when the purpose of the query is to obtain information on the server.
    On the other hand, the POST method is used to change or add information from the server. This method submits complete messages to the server.
    On the Frame Target tab, you can specify a destination frame if form data references a particular location in the file.
    Click on the OK button.

AceHTML inserts the following command in the document:


Check box <INPUT TYPE="CHECK BOX">

<input type="check box"
 name="region" value="Europe" checked> Europe<br>
<input type="check box" name="region" value="South
 America"> South America<br>
<input type="check box" name="region" value="Asia">
 Asia<br>
<input type="check box" name="region" value="West
 Africa"> West Africa<br>

The CHECKED attribute means that the check box is checked. CHECKED can be attributed to one or more values since they are check boxes.

Check box <INPUT TYPE="CHECK BOX">

Check boxes are grouped in areas of one form and they allow the user to select among several choices.

  1. Place the cursor in the edit window where you wish to insert check boxes. This location must be placed between <FORM> and </FORM> tags.

  2. In the Forms tag, click on the Check box button. The Form Elements dialog box appears.

  3. In the identifier name text box, enter a name. This one is used to identify the check boxes area.

  4. If you do not want to have a new line inserted to separate each box, remove the Insert a carriage return after every value box.

  5. In the Element values text box, type the first box value and press on the Add button.
    The inscription is transferred to the bottom window of the dialog box.

  6. Repeat the last stage for all the check boxes you wish to create.

  7. If you wish that a check box becomes activated by default, insert a checkmark on the Checked by default box before pressing on the Add button.
    You can also add the checkmark directly on the bottom of the window of the dialog box.

  8. To reorganize the order of added elements, click on one of them to select and move it with the aid of the up or down arrows on the right side of the preview window.

  9. Click on the OK button.

AceHTML inserts the following command in the document:

If you have not previously specified the type of form in which you wish to insert the checkmark boxes, AceHTML asks if you want to insert a Form in the document.


Radio boxes <INPUT TYPE="radio">

The radio boxes, also called options boxes, are grouped choices within a form text box from which the user must make an exclusive choice (unique choice).

  1. Place the cursor in the edit window where you wish to insert radio boxes. This location must be placed between <FORM> and </FORM> tags.

  2. In the Forms tag, click on the Radio box button. The Form Elements dialog box appears .

  3. In the identifier name text box, enter a name. This name identifies the radio box text box.

  4. If you don’t want to have a new line inserted after every radio button, remove the Insert a carriage return after each value box.

  5. In the Element values box, type the description for the first radio button and then press on the Add button. The inscription is transferred to the bottom window of the dialog box.

  6. Repeat the last stage for all the radio buttons you want to create

  7. If you want one of the radio buttons to have a default checkmark, then you must insert a checkmark in Checked by default box before pressing on the Add button.
    You can also insert a checkmark in the appropriate box in the bottom window of the dialog box.

  8. To reorganize the order of added elements, click on one of them to select and move it with the aid of the up or down arrows on the right side of the preview window.

  9. Click on the OK button.

AceHTML inserts the following command in the document:.

If you have not previously specified the type of form in which you wish to a radio button, AceHTML asks if you want to insert a Form in the document.

It is not possible to return to the Elements Form dialog box to make modifications. However, while you have not exited the dialog box, it is possible to:

  • Modify an element: select it in the preview window and click on the Edit button.

  • Delete an element: select it in the preview window and click on the Delete button.


List box <SELECT>

List boxes are grouped in areas of a form. The list can be a single or multiple choice one, depending on the parameters values set on the form.

  1. Place the cursor in the edit window where you wish to insert the group of check boxes. This location must be placed between <FORM> and </FORM> tags.

  2. In the Forms tag, click on the List box button. The Form Elements dialog box appears .

  3. In the identifier name text box, type a name. This name identifies the radio box text box.

  4. In the Visible lines text box, you can increase the number of visible elements in the menu inscribing the desired number of lines. The preview window adjusts itself to the number of lines. In this case, a scroll bar appears to allow you to view the set of elements of the list.

  5. In the Element values, inscribe the first box value, type the description for the first radio button and then press on the Add button. The inscription is transferred to the bottom text box of the dialog box.

  6. Repeat the last stage for all the list boxes you want to create.

  7. By default, the list box only allows one choice. If you want the user to select several options of the list, activate the Multiple selection list box.

  8. To reorganize the order of added elements, click on one of them to select and move it with the aid of the Up or Down arrows on the right side of the preview window.

  9. Click on the OK button.

AceHTML inserts the following command in the document:

If you have not previously defined the type of form in which you want to insert a check box, AceHTML asks if you want to insert a Form in the document.

It is not possible to return to the Elements Form dialog box to make modifications. However, while you have not exited the dialog box , it is possible to:

  • Modify an element: select it in the preview window and click on the Edit button.

  • Delete an element: select it in the preview window and click on the Delete button.


Combo box <SELECT>

The Combo box is used to present the list of possible choices as a drop-down list box. Drop-down list boxes are used to allow the user to choose only one item from the menu (list).

  1. Place the cursor in the edit window where you wish to insert the group of combo boxes. This location must be placed between <FORM> and </FORM> tags.

  2. In the Forms tag, click on the Combo box button. The Form Elements dialog box appears .

  3. In the identifier name text box, type a name. This name identifies the Combo Box.

  4. In the Visible lines area, you can increase the number of elements listed in the menu by entering the number of desired lines. The preview area adjusts the size to display the number of lines selected. If necessary, a scroll bar is displayed to allow you to view all the elements in the list.

  5. In the Element values, type the description for the first option in the Combo Box and then press on the Add button. The description is transferred to the bottom text box of the dialog box.

  6. Repeat the last stage for all the radio boxes you wish to create.

  7. To reorganize the order of added elements, click on one of them to select and move it with the aid of the Up or Down arrows on the right side of the preview window.

  8. Click on the element to move and click on the corresponding arrow to move it in any direction.

  9. Click on the OK button.

AceHTML inserts the following command in your document:

If you have not previously specified the type of form in which you want to insert this element, AceHTML asks if you want to insert the Form in the document.


Text box <INPUT TYPE="text">

The text box allows the user to enter a line of text in a form. The number of characters accepted in the text box can be limited.

  1. Place the cursor in the edit window where you wish to insert the text boxes. This location must be placed between <FORM> and </FORM> tags.

  2. In the Forms tag, click on the Text box. The Form Elements dialog box appears.

  3. In the identifier name text box, type a name. This name identifies the Text box.

  4. In the Property menu, you can modify the size of the text box and modify the size of the text box by inserting a number in the Maximum length displayed box.
    This will not prevent the user to enter more text than the available space.

  5. You can also limit the size of the text that will be submitted with the form by inserting a number in the Maximum authorized length box.

  6. In the Elements value box, you can enter a message that will be displayed in the Form field when the Form is displayed.

  7. Click on the OK button.

AceHTML inserts the following command in the document:

If you have not previously specified the type of form in which you want to insert this element, AceHTML asks if you want to insert the Form in the document.


Text area box <TEXTAREA>

The text area box is used to create a rectangular box for the user to enter text with multiple lines. If in a text box there are more lines than available space for displaying it, a scrolling list will appear to allow moving up and down the box.

  1. Place the cursor in the edit window where you wish to insert text area boxes. This location must be placed between <FORM> and </FORM> tags.

  2. In the Forms tag, click on the Text area box. The Form elements box appears.

  3. In the identifier name text box, type a name. This name identifies the text box.

  4. In the Column and Row boxes, specify the size.
    The number of columns is equivalent to the maximum number of characters that you insert in a line; the number of rows is the number of lines.

  5. In the Line cut off box, select the option you want to apply to the field of the drop down list:

  • Deactivated, prevents the display of scroll bars.

  • Virtual, only in case the text is too long to show in the window.

  • Physical, which automatically displays scroll bars.

It is recommended to keep the Deactivated by default option. You will be sure that all browsers will interpret the command. In this case, the line cut off will be automatic, according to the box size and a scroll bar will appear to allow viewing all the text.
If you are using Netscape as your developing standard, you can select between the Virtual or Physical options.

  6. In the Preview window, you can enter a message that will appear in the text area box and will act as the default value.

  7. Click on the OK button.

AceHTML inserts the following command in the document:

If you have not previously specified the type of form in which you want to insert this element, AceHTML asks if you want to insert the Form in the document.


Button <INPUT TYPE="button">

This command inserts a simple push button that is used with JavaScript.

  1. Place the cursor in the edit window where you wish to insert a button. This location must be placed between <FORM> and </FORM> tags.

  2. In the Forms tag, click on the Button box. The Form elements dialog box appears.

  3. In the Text displayed on the button, type the text you want to appear in the button. In the Preview window, you can view the button.

  4. When you finish click on the OK button.

AceHTML inserts the following command in the document:

If you have not previously specified the type of form in which you want to insert this element, AceHTML asks if you want to insert the Form in the document.


Submit button <INPUT TYPE="submit">

This command inserts a push button in a form which is destined to submit information. The submit parameters are those defined during form definition creation . The VALUE attribute assigns a name to the button. The Submit button is usually accompanied with the Reset button.

  1. Place the cursor in the edit window where you wish to insert the submit button. This location must be placed between <FORM> and </FORM> tags.

  2. in the Forms tag, click on the Submit button. The Form elements dialog box appears.

  3. In the Text displayed on the button text box, type the text you want to appear ion the button. In the Preview window, you can view the button.

  4. When you finish, click on the OK button.

AceHTML inserts the following command in the document:

If you have not previously specified the type of form in which you want to insert this element, AceHTML asks if you want to insert the Form in the document.


Reset button<INPUT TYPE="reset">

This command inserts a push button in a form allowing to reset the form’s fields to their initial values. The Reset is usually accompanied with the Submit button.

  1. Place the cursor in the edit window where you wish to insert the reset button. This location must be placed between <FORM> and </FORM> tags.

  2. In the Forms tag, click on the Reset. The Form elements text box appears.

  3. In the Text displayed on the button text box, type the text you want to appear ion the button. . In the Preview window, you can view the button.

  4. When you finish, click on the OK button.

AceHTML inserts the following command in the document:

If you have not previously specified the type of form in which you want to insert this element, AceHTML asks if you want to insert the Form in the document.


Hidden entry <HIDDEN>

This command allows sending a value with the form. This value is not displayed to the user.

  1. Place the cursor in the edit window where you wish to insert the hidden entry. This location must be placed between <FORM> and </FORM> tags.

  2. In the Forms tag, click on the Hidden entry. The Form elements box appears. This box presents the same options used to insert an image.

  3. In the Identifier name text box, type a name. This name identifies the hidden entry.

  4. In the Associated hidden value, insert a value that represents the hidden text.

  5. Click on the OK button.

AceHTML inserts the following command in the document:

If you have not previously specified the type of form in which you want to insert this element, AceHTML asks if you want to insert the Form in the document.


Form Image <INPUT TYPE="image">

The Form Image command allows submitting the form contents in exactly the same way as the Submit button . When the user presses the image, the form is submitted.

  1. Place the cursor in the edit window where you wish to insert the group of check boxes. This location must be placed between <FORM> and </FORM> tags.

  2. In the Forms tag, click on the Form image button The Form elements text box appears. This box presents the same options of image insertion.

  • You can also insert an image from GOgraph by clicking on the button Insert an Image with GOgraph.

  3. Proceed in the same way as an image insertion.

AceHTML inserts the following command in the document:

If you have not previously specified the type of form in which you want to insert this element, AceHTML asks you if you want to insert the Form in the document.


Password <INPUT TYPE="password">

The password box is presented in a form field similar to a text box with the difference that this one is conceived to validate a password. In order to the field be functional, is always necessary to associate it with a script.

  1. Place the cursor in the edit window where you wish to insert the password boxes. This location must be placed between <FORM> and </FORM> tags.

  2. In the Forms tag, click on the Password text box The Form elements box appears.

  3. In the identifier name text box, type a name. This name identifies the Password box

  4. In the Property menu, you can modify the size of the text box and modify the size of the text box by inserting a number in the Maximum length displayed box

  5. You can also limit the size of the text that will be submitted with the form by inserting a number in the Maximum authorized length box

  6. In the Elements value box, you can enter a message that will be displayed in the Form field when the Form is displayed

  7. Click on the OK button.

AceHTML inserts the following command in the document:

If you have not previously specified the type of form in which you want to insert this element, AceHTML asks if you want to insert the Form in the document.


File attach <INPUT TYPE="FILE">

This command allows you to attach one or more files to a form.

  1. in the Forms tag, click on the File attach button The Form elements text box appears.

  2. In the identifier name text box, type a name. This name identifies the file to attach.

  3. In the File attach, type the name of the file you want to attach.

  4. Click on the OK button.

If you have not previously specified the type of form in which you want to insert this element, AceHTML asks if you want to insert the Form in the document.


Show/Hide Project Manager

In order to manage a set of HTML files which are part of the same project, it is recommended that you create a project. You can manage your project in two ways:

  • From the edit window, using the Project toolbar.

  • Using the Project Manager.

AceHTML automatically converts any projects you created using the previous versions of AceHTML.

  1. From the View menu, select Show/Hide Project Manager
    or
    Click on the Show/Hide Project Manager icon on the Standard toolbar. You can also use the shortcut CTRL+ALT+F11 (Refer to list of shortcuts).

You can also add a file to a project by using the Windows file manager (Windows Explorer). To do this, you only have to select the document in the Windows file manager and drag it to AceHTML's Project manager window.

If you ask to display the Project manager when using predefined desktop Anchored, the file manager will be displayed in the same window as the Visual and Code Explorers and the Code Inspector.

The Project Manager displays a toolbar with the following options:

Main File

Add file(s) To the Project

Remove File(s) From the Project

Open File(s)

Open All Files

Display all files in project

Up one level

View icons

New Project

Open project

Save Project

Save project on FTP

Archive project as backup

Close Project

View project comment

View project structure

To close the Project Manager:

  • Click on the X button found on the window's upper right corner.


Display Project Manager

To make it easier to consult project files, you can modify how Project Manager is displayed with the View icons button.

Project Manager is displayed as an overlay, by default, on the tab zone of the Edit Window. The pop-up menu on the tab includes functions for manipulating docking. You can undock Project Manager, and leave it permanently superimposed on the Edit Window.


Using comments in your project

Working with several files is easy thanks to AceHTML’s Project Manager. It helps you to keep in mind certain details when you work with your files. You can also place comments to avoid handling sheets of paper that might get lost.

Besides, you can use the To do list to remind you of things you need to do as you work on your project.

  1. Open the Project Manager and select the project on which you want to work.

  2. Click on the Display project comments button.
    A new area is displayed at the bottom of the Project Manager. If you have inserted any comments, these are displayed in this area.

  3. You can add, modify or erase comments by typing directly in the comments area.

  4. To hide the comments area, simply click on the Display project comments button again.


Archive a project

With AceHTML it’s easy to archive all the documents contained in a project while preserving the structure of folders.

AceHTML can save the file in the compression format of the software you use at your work station (WinZip, WinRar, etc.)

  1. Display the Project Manager and open the project you want to file.

  2. Click on the Archive Project as Backup button.
    You can also use the edit window’s menu, Project | Archive Project as Backup.
    The Save file dialog box is displayed. In the Type of file list, ZIP is available.

  3. Select the folder with the help of the explorer on the dialog box.

  4. In the File Name area, assign a name for the file.

  5. Click on the Save button to archive the project.


New project

This command allows you create a new project.

  • From the Project menu, select New Project
    or

  • From the Project Manager toolbar, click on the New Project icon.

The Project Manager window will appear on the screen. A toolbar bar provides access to all the commands that allow you to manage your projects and associated files.


Open project

This command allows you to open a project saved to disk. When you execute the command, the File Manager window will appear on the screen. This window displays the list of all the HTML documents belonging to the open project.

  1. From the Project menu, select Open Project.
    or
    In the Project Manager toolbar, click on the Open Project icon. You can also use the shortcut SHIFT+CTRL+O (Refer to list of shortcuts).

  2. Select the project to be opened. This file must have the .proj extension.

  3. Click on the OK button.

The Project Manager window has a toolbar that gives you access to all the commands necessary to manage your projects and associated documents.


Recall Last Projects

This option allows you to open a project which was recently closed.

  1. From the Project menu, click on the arrow which is next to the Open Project option
    or
    Click on the arrow to the right of the Open Project icon.
    The list of the last files edited is displayed.

  2. Click on the project you want to open. The Project Manager window will appear.

This list displays up to eight projects. You can define the exact number of projects to be kept in the File History by using the Editor tab from the dialog window that opens when you select General Preferences from the Tools menu.


Open project file(s)

This command allows you to open one or more files belonging to one project.

  1. Display the Project Manager.

  2. In the display area showing the list of project files, select the desired files:

  • Click on a file to select it,

  • Make a multiple selection to select more than one file.

  3. Click on the Open File(s) icon.


Open All Project Files

This command allows you to open all the files belonging to one project.

  1. From the Project menu, select Open All Project Files.
    Or
    Click on the Open All Files icon on the Project Manager toolbar.

  2. Select the project. This file must have the .proj extension.

  3. Click on the OK button.


Add file(s) to Project

You can add files to a project in two ways:

  • Using the Project Manager, in order to handle many files at the same time.

  • Using the Project toolbar, to add the active document.

In both cases, first make sure that the open project is the one that you want to modify.

To add one or more documents to the project using the Project Manager:

  1. From the Project menu, select the Add File(s) to Project option
    or
    Click on the Add File(s) to Project icon on the Project Manager toolbar. You can also use the shortcut SHIFT+F11 (Refer to list of shortcuts).
    The display is divided into two sections.

  2. In the left panel of the display, select the files that you want to add. Select the desired drive and main directory. You can select the entire contents of a directory by adding a check mark to the corresponding box.

  3. In the right panel of the display, select the folder or the file to be added to the project by adding a check mark to the corresponding box. You can activate more than one box in order to select more than one file or folder.

You can filter the files extensions you want displayed by using the Hide files dropdown list found at the bottom of the display.

To add a file using the Project toolbar:

  1. Display the Project toolbar.

  2. Make sure that the document you want to add to the current project is active.

  3. On the Project toolbar, click on the Add File(s) icon. The active HTML document is automatically added to the list of files belonging to the project.

You can also add a file to the project by using the Windows file manager (Windows Explorer). To do this, you only have to select the document in the Windows file manager and drag it to AceHTML's Project Manager window.


Remove File(s) From the Project

You can remove files from a project in two ways:

  • Using the Project Manager, in order to handle many files at the same time.

  • Using the Project toolbar, to handle the active document only.

In both cases, first make sure that the open project is the one that you want to modify.

To remove a file from a project using the Project Manager:

  1. In the Project Manager window, select the file to be removed. Make a multiple selection to select more than one file.

  2. Click on the Remove File(s) From the Project icon.

The documents removed from a project are no longer part of the list of documents belonging to the project. However, this command does not delete the documents in question from your folders.

To remove a file using the Project toolbar:

  1. Display the Project toolbar.

  2. Make sure that the document you want to add to the current project is active.

  3. On the Project toolbar, click on the Remove Current File From Project icon. The active HTML document is automatically removed from the project’s list.


Creating a Main File

A project's main file is its main document. When a project is opened, the main file will be displayed by default. This file calls the other HTML documents. Usually, it's the file that contains frames (index.html, default.html).

  1. Display the Project Manager.

  2. In the display area, click on the document you want to designate as the Main File.

  3. Click on the Main File icon.

From then on, the Project Manager will display this document in bold characters so that you can easily identify it.


Save Project

This command allows you to save the changes made to your project or to the associated HTML. documents. If the document has not been saved, this option will have the same effect as the Save project as command.

  • From the Project menu, select Save Project
    or

  • In the Project Manager toolbar, click on the Save Project icon. You can also use the shortcut SHIFT+CTRL+S (Refer to list of shortcuts).

If you wish to save an existing project under another name or in another location, use the Save Project As command.


Save a project as

The command Save Project As allows you to save a project that has not been saved before. This command can also be used to save an existing document under another name.

  1. From the Project menu, select Save Project As.

  2. Provide a name for the project and make sure you indicate the correct directory. Make sure you keep the .proj file extension.

  3. Click on the Save button.


Save Project on FTP

AceHTML lets you work directly in a host site or your preferred FTP site. Through the FTP Expert file transfer software association, you can modify your documents directly on the site and immediately save them.

You can save:

  • only a modified file;

  • a file that you have modified and renamed;

  • all project files.

Saving the project on FTP under another name

  1. Make sure you are connected to the Internet before beginning the transfer.

  2. In the Project menu, click on Save Project on FTP.
    or
    Click on the Save Project on FTP button on the Manager toolbar.
    The Transfer Options window is displayed.

  3. Select the desired options:

All Files | This option saves all files in the active project.
Modified since | Saves only those files modified after the specified date and time.
Use archive attributes | Saves an archived copy of the project in the project source directory.

  4. The Save on FTP window is displayed.
    It displays the tree for connecting to the FTP servers configured in File Manager.

  5. Select the server, and find the file you want to save.

  6. Click on OK to save the project files.


Close Project

This command allows you to close the Project Manager without exiting AceHTML. If the project has not been saved or if it has been modified since the last time it was saved, AceHTML will remind you to save it before closing it.

  • From the Project menu, select Close Project.
    Or

  • In the Project Manager, toolbar click on the Close Project icon. You can also use the shortcut SHIFT+CTRL+W (Refer to list of shortcuts).


Shortcuts list

In AceHTML you can change the settings of the shortcuts of all menu items. Refer to the section Customize the toolbar for more details.

File Manager |
Create a document | CTRL+N
Open a document | CTRL+O
Close a document | CTRL+W or CTRL+F4
Close all documents | CTRL+ALT+F4
Save a document | CTRL+S
Save all documents | CTRL+ALT+F5
Save on FTP | CTRL+ALT+F9
Preview of images | SHIFT+F2
Files manager | F2
Editing documents |
Display tag properties (for changes) | ALT+ENTER
Cancel an action | CTRL+Z
Redo an action | SHIFT+CTRL+Z
Repeat last command | SHIFT+CTRL+Y
Cut selected text | CTRL+X
Copy selected text | CTRL+C
Paste text to position of cursor | CTRL+V
Delete selected text | CTRL+DEL or DEL
Select all text | CTRL+A
Delete a line | CTRL+Y
Syntax checking | CTRL+F9
Evaluate size of document | CTRL+F6
Indent selected block to the right | Tab
Indent selected block to the left | SHIFT+Tab
Search text | CTRL+F
Replace text | CTRL+R
Repeat search or replace | F3
Extended Search and replace | SHIFT+CTRL+X
Go to line | ALT+G
Go to next tag | CTRL+=
Go to previous tag | CTRL+-
View commands |
Show/Hide Project manager | CTRL+ALT+F11
Display Code Explorer | SHIFT+F4
Display Visual Explorer | SHIFT+F5
Display Code Inspector | SHIFT+F6
Display Files Explorer | SHIFT+F7
Display Code Snippets Library | SHIFT+F8
Shift focus to edit window | F11
View internal browser | F10
Project manager |
Add file to project | SHIFT+F11
Open project | SHIFT+CTRL+O
Close project | SHIFT+CTRL+W
Save project | SHIFT+CTRL+S
Tools and configuration |
General Preferences | SHIFT+CTRL+F11
Editor preferences | SHIFT+CTRL+F12
Microsoft Internet Explorer | SHIFT+CTRL+E
Netscape | SHIFT+CTRL+N
Other browser | SHIFT+CTRL+A
Start internal browser | F12
Start external browser | CTRL+F12
Start spell checking | F5
Start AceFTP | F9
Start PHP External Interpreter | SHIFT+F8
Start Perl External Interpreter | SHIFT+F9
Documents |
List of Documents | ALT+O
Tools, help and references |
Help on line/help on command | F1
JavaScript Commands Summary | SHIFT+ALT+F9
Add the default shortcut keys of customized buttons | CTRL+0 to 9
Insert a code template | CTRL+J
Insert a bookmark | CTRL+ALT+J+0 to 9
Go to bookmark | CTRL+ALT+K+0 to 9
Word wrap | CTRL+L
Objects, Images and Links |
Insert table | SHIFT+ALT+T
Insert frames | SHIFT+ALT+F
Quick image | SHIFT+CTRL+I
Insert image | SHIFT+ALT+G
Insert image map | SHIFT+ALT+M
Insert external link | SHIFT+ALT+X
Insert internal link | SHIFT+ALT+I
Quick link | SHIFT+CTRL+H
Insert a comment <!-- --> | ALT+M
Formatting |
Format font | CTRL+D
Apply bold attribute | CTRL+B
Apply underline attribute | CTRL+U
Apply italics attribute | CTRL+I
Apply Heading 1 to 6 style | SHIFT+CTRL+1 to 6
Insert a blank space (&nbsp;) | SHIFT+CTRL+SPACE
Text alignment |
Align text to the left | SHIFT+CTRL+L
Center text | CTRL+E
Align text to the right | SHIFT+CTRL+R
Justify text | SHIFT+CTRL+J
Insert a paragraph <p></p> | CTRL+P
Insert line break <br> | CTRL+ENTER
Document and header properties |
Document Header properties | SHIFT+ALT+D
Body of document | SHIFT+ALT+B
Horizontal line | SHIFT+ALT+H
Style sheets | SHIFT+ALT+S
Special characters dialog box | SHIFT+ALT+F7
HTML summary dialog box | SHIFT+ALT+F8
Edit window |
Change letter case | SHIFT+F3
Delete one character to the left | BACKSPACE
Delete one word to the left | CTRL+BACKSPACE
Delete one character to the right | DELETE
Delete one word to the right | CTRL+DELETE
Windows and Dialog Boxes |
Shift to the following program | ALT+TAB
Shift to the preceding program | SHIFT+ALT+TAB
Display the Start Windows menu | CTRL+ESC
Shift to next tab in a dialog box | CTRL+TAB
Shift to previous tab in a dialog box | SHIFT|CTRL+TAB
Move to the next option or group of options | TAB
Move to the previous option or gorup of options | SHIFT+TAB
Select an option or enable or disaable the check box using the underline letter of the option name | ALT+letter
Open a drop-down box (when the box is selected) | ALT+DOWN
Execute the command indicated in a default button dialog box | ENTER
Cancel the command and close the dialog box | ESC
Text |
One character to the left | LEFT
One character to the right | RIGHT
One word to the left | CTRL+LEFT
One word to the right | CTRL+RIGHT
One paragraph up | CTRL+UP
One paragraph down | CTRL+DOWN
One line up | UP
One line down | DOWN
To the end of a line | END
To the beginning of a line | HOME
To the top of the window | ALT+CTRL+PgUp
To the bottom of the window | ALT+CTRL+PgDn
Top of the screen (scroll) | PgUp
Bottom of the screen (scroll) | PgDn
To the end of a document | CTRL+END
To the beginning of a document | CTRL+HOME
Move to the beginning of an entry | HOME (HOME)
Move to the end of an entry | END (END)
Move a character to the left or the right | LEFT/RIGHT
Move the cursor to the left or the right | CTRL+LEFT/RIGHT
Select from the point of insertion to the beginning of an entry | SHIFT+HOME
Select from the point of insertion to the end of an entry | SHIFT+END
Select or unselect one character to the left | SHIFT+LEFT
Select or unselect one character to the right | SHIFT+RIGHT
Select or unselect one word to the left | SHIFT+CTRL+LEFT
Select or unselect one word to the right | SHIFT+CTRL+RIGHT
References editor |
Add an attribute | CTRL+SHIFT+A
Delete an attribute | CTRL+SHIFT+D
Check properties | CTRL+P
Restore a preference | SHIFT+CTRL+R
Save all | SHIFT+CTRL+T
Exit the References editor | ALT+F4
Edit type | CTRL+E
Create a new type with the Wizard | CTRL+INS
Display list of types | CTRL+T


Frequently Asked Questions

Find answers for the most common questions at the following address:

http://softwares.visicommedia.com/en/.

Our Web site has a list of frequently asked questions which is constantly being updated to add the questions submitted by our clients so that everyone can readily find answers to common problems and questions.


Available Resources

To help you create attractive Web pages and transfer them to your server, you can use additional software that you can download from our Web site from the address shown below:

  • AceFTP: to transfer Web pages, images and other files.
    http://softwares.visicommedia.com/en/products/aceftp/

  • Gograph: to download images for your Web pages.
    http://www.gograph.com/

Additional tools:

Below you will find a list of additional available tools which you can download from our site at the following address: http://softwares.visicommedia.com/en/.

  1. AceHTML electronic manual.

  2. AceFTP electronic manual.

  3. AceHTML Tutorial (10 easy steps to create a Web Page using AceHTML).

  4. Over 150 site interfaces and graphic themes (for registered users only.)

  5. Over 30 web templates which include 5 different styles of HTML pages (for registered users only).


Explorateur de fichiers

File Manager

File Manager lets you identify links to FTP sites that will help you create Web pages. The File Manager tree is displayed by default in File Manager whenever you open or save a document.

1. Select the command Display|Display File Manager.
You can also use the shortcut key MAJ + F7. See the list of shortcut keys.

File Manager is part of the Resources window, which is displayed on the left side of your screen when you start Ace HTML. If the window is floating, click and drag the title bar towards the Code Inspector and Code Explorer tabs to dock it. Once the window is docked, use the pop-up menu commands to replace the superimposed window. Select the command Always on Top to keep File Manager displayed at all times.

Using File Manager

File Manager displays a tree containing the files you are working on. These are in two categories:

§ Desktop: access to all folders and files on your workstation.

§ FTP site: access to all FTP sites you have configured.

You can transfer files from Windows Explorer to File Manager and vice versa. You can also use File Manager to insert a hyperlink in your document, by clicking and dragging from an FTP site to the active document in the Editor window.

You can use the pop-up menu commands to copy or cut documents or folders, as you would in Windows Explorer.

The properties of folders and files on a server enable you to define the options for accessing scripts and modifying elements.
File Manager is fully integrated to Ace HTML. You can use FTP server directories defined in File Manager for all commands for opening documents, saving documents and saving projects.

Creating an FTP connection

1. Display the contents of the FTP site file in your File Manager window.

2. Select the command New FTP site from the pop-up menu. The New FTP site window is displayed. Enter the server identification and user information:

Name displayed

Identification of the connection displayed in File Manager.

Server

URL of the FTP server you want to connect to.

Port

Communication port. By default, the port used to communicate with an FTP server is 21. If necessary, you can change the port number. You can obtain this information from your Internet service provider.

User name

Enter your user name. You can obtain this information from your Internet service provider.

Password

Enter your password.

Initial directory

Name of the directory you want to open once the connection is established. Leave this field blank to access the Web site root.

Http URL

HTTP Address to connect to the server, if you are not using an FTP address.

Passive (PASV)

To use a passive connection.

PASV mode is a passive exchange mode that is used to ensure there are no conflicts when simultaneously transferring files.

Certain servers with a firewall require use of the passive mode, as the connection in such cases must be established by the server.