|
|
|
|
|
Customizations Specific to HTML Help
This section covers project customizations specific to HTML Help. HTML Help-specific customizations refer to any project or output modifications that can only be applied to HTML Help output – such as modifying drop-down hotspots.
These types of customizations are specific to HTML Help:
Adding a PDF Button to the Toolbar
In your ePublisher Pro project, you can generate PDFs for each source document and/or each top-level group. You can either deliver the PDFs separately from your Help system, or you can add a PDF button to your toolbar that will display the PDFs in the frameset.
The PDF that displays when you click on the PDF button depends on whether you have generated PDFs for the top-level groups or each source document in your project.
In your project, if you have selected any of the following settings for your PDF format settings, then the PDF button will appear next to the navigation buttons.
|
|
Generate PDFs only for the top-level groups, then when you click the PDF button, the PDF for the top-level group in which the currently viewed topic is located will display. |
|
|
Generate PDFs only for each source document, then when you click the PDF button, the PDF for the source document in which the currently viewed topic is located will display. |
|
|
Generate PDFs for all source documents and for all top-level groups, then when you click the PDF button, the PDF for the source document in which the currently viewed topic is located will display. |
For more information on generating PDFs, please see “Creating PDFs” on page 62.
Adjusting the Default Opening Display Position and Window Size of the HTML Help Viewer
The Help author may specify where on the screen HTML Help opens.
Changing the Default Display Position and Window Size:
|
1. |
In Windows, open your project folder. Create the folder structure displayed in Figure 8. For customizations on the target level, this folder structure should be created in the Targets directory. For customizations on the project level, this folder structure should be created in the Formats directory. |
Figure 7: Folder Structure for Changing the Default
Opening Position of the HTML Help Window
|
2. |
Navigate to ePublisher Pro\Formats\Microsoft HTML Help 1.x\Pages in your installation directory. |
|
3. |
Select and copy template.hhp. |
|
4. |
Paste template.hhp into the Pages folder created inside your project folder in step 1. |
|
5. |
Open the template.hhp file placed in the project directory in HTML Help Workshop. |
Positioning is determined by pixels, relative to the screen resolution. To position the window on the left side of the screen, enter “0” as the value for “Left.” Entering the maximum screen resolution in the “Left” box will place the left side of the Help Window at the far right of the screen. To position the right margin of the window on the right side of the screen, enter the maximum value of the screen resolution of the intended viewer minus the value for Width.
Similarly, entering “0” as the value for “Top” will place the window at the top of the screen. Entering the maximum screen resolution in the “Top” box will place the Top side of the Help Window at the bottom of the screen. To position the bottom margin of the window on the bottom of the screen, enter the maximum value of the screen resolution of the intended viewer minus the value for Height.
Clicking the Autosizer button in the Window Types dialog box will display a sample window with the specified settings.
The Default Positions button will assign a default position and size to your window.
Modifying the Mini TOC
Mini TOC settings are stored in webworks.css. Modifications may be made to specific levels of the mini TOC or to the entire mini TOC.
Modifying the Appearance of the Mini TOC:
|
1. |
In Windows, open your project folder. Create the folder structure displayed in Figure 8. For customizations on the target level, this folder structure should be created in the Targets directory. For customizations on the project level, this folder structure should be created in the Formats directory. |
Figure 8: Folder Structure for Modifying the mini TOC
|
2. |
Navigate to ePublisher Pro\Formats\Microsoft HTML Help 1.x\Pages\CSS in your installation directory. |
|
3. |
Select and copy webworks.css. |
|
4. |
Paste webworks.css into the css folder created inside your project folder in step 1. |
|
5. |
Open the webworks.css file placed in the project directory. |
|
a. |
|
|
b. |
|
|
c. |
|
|
d. |
|
|
Table 3: Border-Style Values |
|
|---|---|
|
e. |
|
|
f. |
|
|
8. |
Save webworks.css. |
Modifying Individual Entries in the Mini TOC
Users may modify specific entries in the mini TOC. For instance, each line may be a different font or font size. In addition, margins may be modified.
Modifying Individual Entries in the Mini TOC:
|
1. |
Open your project folder in Windows. Create the folder structure displayed in Figure 9. For customizations on the target level, this folder structure should be created in the Targets directory. For customizations on the project level, this folder structure should be created in the Formats directory |
Figure 9: Folder Structure for Modifying the Mini TOC
|
2. |
Navigate to ePublisher Pro\Formats\Microsoft HTML Help 1.x\Pages\css in your installation directory. |
|
3. |
Select and copy webworks.css. |
|
4. |
Paste webworks.css into the css folder created inside your project folder in step 1. |
|
5. |
Open the webworks.css file placed in the project directory. |
where x equals the level number you wish to modify.
|
a. |
To modify the font of a particular mini TOC level, place the following markup inside the braces following each |
Substitute your desired font family in place of “webdings.”
|
b. |
To modify the font size of a particular mini TOC level, place the following markup inside the braces following each |
Substitute your desired font size in place of “14pt.”
|
|
The user may specify the font size to be in points, inches, centimeters, etc. |
|
c. |
To modify the margin indent of a particular mini TOC level, change the default markup inside the braces following each |
margin-left: ypt;
|
|
The user may specify the margin size to be in points, inches, centimeters, etc. |
|
8. |
Save webworks.css. |
|
9. |
Regenerate your project for changes to take effect. See Figure 10 for an example of how this markup should look. |
Figure 10: Sample Markup for Changing the Font Size, Font Family
and Margin in the Mini TOC
Modifying the Navigation Bar in the Topic Pane
The user may add graphics to the navigation bar. To add an image to the navigation bar see “Adding a Logo” on page 30. The navigation buttons can also be resized or replaced.
Changing the Navigation Button Images in the Topic Frame:
|
1. |
Open your project folder in Windows. Create the folder structure displayed in Figure 11. For customizations on the target level, this folder structure should be created in the Targets directory. For customizations on the project level, this folder structure should be created in the Formats directory. |
Figure 11: Folder Structure for Changing Navigation Buttons
|
2. |
Paste .gifs with names identical to those you wish to replace in the images folder created in step 1. See Table 4 for a list of default button images and their file names. |
|
Table 4: Navigation Buttons |
|||
|---|---|---|---|
|
Image Name |
|||
|
|
Sends the user to the previous HTML document. |
||
|
|
Displayed when there is no previous HTML document available. |
||
|
|
Sends the user to the next HTML document. |
||
|
|
Displayed when there is no next HTML document available. |
||
Disabling the Navigation Bar:
|
1. |
Select View > Style Designer. |
|
2. |
Select Page Styles. |
|
3. |
Select the first default option. |
|
4. |
Set the value for Navigation links shown at bottom of page and Navigation links shown at top of page to “Disabled.” |
Modifying Drop-down Hotspots
Users may change the images used to denote expanded or collapsed hotspots.
Modifying a Drop-down Hotspot:
|
1. |
Open your project folder in Windows. Create the folder structure displayed in Figure 12. For customizations on the target level, this folder structure should be created in the Targets directory. For customizations on the project level, this folder structure should be created in the Formats directory. |
Figure 12: Folder Structure for Modifying Drop-down Hotspots
|
2. |
Paste .gifs with names identical to those you wish to replace in the images folder created in step 1. See Table 5 for details on drop-down images and their file names. |
|
Table 5: Drop-down Hotspot Image Details |
||
|---|---|---|
|
|
||
|
|
||
Modifying Breadcrumbs
Modifying breadcrumbs requires a target override. Users may change the font family, font size, and color of breadcrumbs.
Modifying the Appearance of Breadcrumbs:
|
1. |
Open your project folder in Windows. Create the folder structure displayed in Figure 13. For customizations on the target level, this folder structure should be created in the Targets directory. For customizations on the project level, this folder structure should be created in the Formats directory. |
Figure 13: Folder Structure for Modifying Breadcrumbs
|
2. |
Navigate to ePublisher Pro > Formats > Microsoft HTML Help 1.x > Pages > css in your installation directory. |
|
3. |
Select and copy webworks.css. |
|
4. |
Paste webworks.css into the css folder created inside your project directory in step 1. |
|
5. |
Open the webworks.css file placed in the project directory. |
|
6. |
Locate the following markup in webworks.css: |
|
a. |
Modify the value given after |
|
b. |
Modify the value given after |
|
c. |
Modify the value given after |
|
8. |
Save the changes to webworks.css. |
Setting the Title Bar
The title bar in your compiled HTML Help system will display the title you assign to your project in the Merge Settings dialog box.
Setting the Title Bar:
|
1. |
In your ePublisher project, select Format > Merge Settings. |
