Use the HTML Editor to edit any existing HTML documents contained within a package in the Library. You can also create new HTML documents which can be saved and copied into the package you are editing. 

 

Publishing Note: HTML files stored in packages are not published in document outputs. See Package Behavior in Publishing in the Enhance Content with Packages section of the Enhance Content with Attachments chapter. 

 

To edit HTML files in a package: 

  1. Open a package in the Package editor.
     
  2. Double-click HTML file that you want to edit and it opens in the HTML editor. You can also right-click the file and choose Open to edit the file in the HTML editor or Open with... to open it in another program.
     
  3. Edit and save the file using the HTML toolbar functions.
     
  4. Save the package.

 To create a new HTML file in a package:

  1. Open a package in the Package editor.
     
  2. On the Edit menu, select New HTML File New HTML File to open an empty document in the HTML editor.
     
  3. Edit and save the document using the HTML toolbar functions.
     
  4. Save the package. 

The HTML editor toolbars provide the following functions: 

 

Source, Save, Save As, Preview Toolbar icons 

 

Source: Display the HTML source code for the current document. You can view or edit the source code. Press Source again to go back to normal text.

 

Save: Save the page you are editing.

 

Save As: Save the page you editing with a different name. You must provide a different file name. The document is saved in the package you are editing.

 

Preview: Display the HTML page in a new or active browser window for preview purposes. You can also preview the HTML page by linking it to a document in the Developer Concept pane. 

 

Cut, Copy, Paste, Print Toolbar icons 

 

Cut: Cut the selected text to the clipboard.

 

Copy: Copy the selected text to the clipboard.

 

Paste: Paste the data copied to the clipboard (with or without formatting). 

 

Paste as plain text: Paste content as plain text. 

 

Paste from Word: Paste content copied from Microsoft Word or similar applications.

 

Print: Print the current document.

 

Undo/Redo, Find/Replace, Select All, Remove Format Toolbar icons 

 

Undo: Undo the most recent action.

 

Redo: Redo the most recent action.

 

Find: Find a word or phrase in the document.


Replace: Find and replace a word or phrase in the document.

 

Select All: Select all of the text in the document.

 

Remove Format: Remove the formatting from the selected text.

 

Insert Form, Checkbox, Radio Button, Test Field and Area, Selection Field, Button, Image Button, Hidden Field Toolbar icons. Use this toolbar to insert various form functions into the HTML page. After you insert and of these form functions into a page, you can right click on it to edit its properties. The properties control various settings on the how the form function appears and behaves when the HTML page is viewed in a browser.

 

Insert Form: Insert a form.

 

Insert Checkbox: Insert a checkbox.

 

Insert Radio Button: Insert a radio button

 

Insert Text Field: Insert an editable text field.

 

Insert Text Area: Insert a multi-line text area. You can configure the text area size by defining the number of rows and columns.

 

Selection Field: Insert a selection field that can list, selectable, predefined values.

 

Button: Insert a clickable button. You can also specify text to appear on the button as well as a Reset or Submit button type.

 

Image Button: Insert a clickable image button.

 

Hidden Field: Insert a hidden field that does not appear when the HTML file is viewed in a browser.

 

Bold, Italic, Underline, Strike Through, Subscript, Superscript Toolbar icons. 

 

Bold: Formats selected text in bold.

 

Italic: Formats selected text in italics.

 

Underline: Formats selected text with an underline.

 

Strike Through: Formats selected text as strike through.

 

Subscript: Subscript is a way to put an index to a letter or to a number. The subscript has a smaller font than the normal text.

 

Superscript: Superscript works in the same way as the subscript but instead of placing the index in the bottom you place it in the top. This function is usually used in mathematical equations to write the "to the power of" function.

 

Insert Numbered and Bulleted List, Decrease/Increase Indent, Block Quote, Create Div Container Toolbar icons. 

 

Insert Numbered List: Inserts a numbered list or changes the format of selected text to a numbered list. This icon also removes an existing numbered list (to a Normal format).

 

Insert Bulleted List: Inserts a bulleted list or changes the format of selected text to a bulleted list. This icon also removes an existing bulleted list (to a Normal format).

 

Decrease Indent: Decrease the text indentation. Repeated clicks continue to decrease the text indentation until the text is no longer indented.

 

Increase Indent: Increase the text indentation. Repeated clicks continue to increase the text indentation.

 

Block Quote: Format a block of text to identify quotations.

 

Create Div Container: Create <div> blocks that hold part of the contents with the Div Container button.

 

Alignment Text: Left, Centered, Right, Justified toolbar icons. 

Sets the text alignment to left, centered, right or justified.

 

Link, Unlink, Anchor Toolbar icons 

 

Link: Link selected text to a URL, anchor in the text or E-mail". Depending on which option you choose different options and bookmarks will appear in the window. For example:

 

if you choose URL, you will need to specify the type of protocol you want to use for your link. You can choose from http://, https://, ftp://, news:// or <other>. You also need to specify the URL you want your link to refer to. Choose Browse to link to a file in the package that contains the HTML file you are working on, a file on your computer, or a URL address.  On the Target tab, use the Target field to specify the type of window in which the link will appear. You may choose from <frame> (also supply a Target Frame name), New Window ( _blank ), Topmost Window ( _top ), Same Window ( _self ), Parent Window ( _parent). If you choose <popup window>, you can also specify various settings that control the popup display behavior such as size and position and other options. 

 

if you choose Link to anchor in text, select an existing anchor name in the By Anchor Name field. You can also link by Element Id if the source HTML has Ids defined. 

 

if you choose E-mail, specify the e-mail address to which you want the link to refer to. Also specify the subject of the message and the message text which is sent to the e-mail address.  

 

Regardless of Link Type you choose, use the Advanced tab to configure the following link settings:

 

Id: specifies the ID of the link. 


Language Direction: sets the language direction from left to right (LTR) or from right to left (RTL).

 

Access Key: sets up an access key to the link.


Name: specifies the link name.

 

Language Code: defines the code of the language e.g. en, pt, pl.

 

Tab Index: defines the tab index.

 

Advisory Title: specifies the description of the target object.

 

Advisory Content Type: specifies the MIME type of the target object.

 

Stylesheet Classes: specifies the name of the CSS class.

 

Linked Resource Charset: specifies the charset of the target object.

 

Style: defines the style.

 

Unlink: Remove an existing link in selected text.

 

Anchor: Inserts a new link anchor (by providing an anchor name) or modifies an existing link anchor. You can use anchors as a mechanism for linking to other text.

 

Insert Image, Table,  Horizontal Line, Special Character, Page Break Toolbar icons. 

 

Insert Image: Insert an image into the document. Use the Image Properties dialog box to set the following properties. The image file is automatically saved in the package you are editing at the time you insert it.

 

The Image Info tab controls the following:

 

URL: defines the URL address of the image. Choose Browse to link to a file in the package that contains the HTML file you are working on, a file on your computer, or a URL address. 

 

Alternative Text: puts the descriptions of the image if you want it to be different than the image name. 

 

Width: specifies image width. 

 

Height: specifies image height. 


Border: specifies the size of the border you want to place around the image.


HSpace: defines the size of the  horizontal gap.


VSpace: defines the size of the vertical gap.


Align: specifies the alignment of the image. You can choose from: Left, Abs Bottom, Abs Middle, Baseline, Bottom, Middle, Right, Text Top or Top.

 

The Link tab controls the following: 

 

URL: defines the URL address of the image. 


Target: defines the target of the image (for advanced users). You can choose from New Window ( _blank ), Topmost Window ( _top ), Same Window ( _self ) or Parent Window ( _parent ).

 

The Advanced tab controls the following: 

 

Id: specifies the ID of the image. 


Language Direction: sets the language direction from left to right ( LTR ) or from right to left ( RTL ).

 

Language Code: specifies the language code e.g. en, pt, pl.


Long Description URL: specifies the description of the page.


Stylesheet Classes: specifies the name of the CSS class.


Advisory Title: specifies the description of the target object.


Style: specifies the style.

 

Insert Table: Insert or edit a table by adjusting the table properties such as number of rows and columns, width and height, borders, alignment, cell padding, and so on. You can then right-click in a table to perform additional functions such as insert/delete rows, cells, columns, and so on. 

 

Insert Horizontal Line: Insert a horizontal line where your cursor is positioned. 

 

Insert Special Character: Insert a special character where your cursor is positioned. Use your mouse to highlight the character that you want and click the character to select it from the character chart. 

 

Insert Page Break for Printing: Insert a page break where your cursor is currently positioned. 

 

Format, Font, and Size Toolbar icons. 

 

Styles & formatting determine the appearance and semantic value of your document. You may use the drop down boxes to apply styles, set the font, its size, and so on. To remove the applied style select the style name again. 

 

Text and Background Color Toolbar icons. 

 

Text Color: Change the color of selected text.

 

Background Color: Change the background color of selected text.

 

Show Block Toolbar icon. 

 

Show Blocks: Show where the block element boundaries are in text.


Table of Contents