Navigation basics

Navigation options

The following navigation options are available for use in Help projects.

Hypertext links
Open the link destination.

Pop-ups
Display an HTML topic in a pop-up window rather than in the default viewer. Pop-ups can be linked only to another HTML topic or to bookmarks.

Link controls
Clickable objects that open a list of related topics. Types of link controls are See Also, Related Topics, or Keyword Links.

Breadcrumbs
These links appear on a Help page and outline the position of the page in the table of contents, or the directory structure of the project.

Browse sequences
The sequence of a series of topics. You define the order of topics in the sequence.

Searches
Find topics that contain search keywords. The search results appear as links in the Search tab of the navigation pane. The search keywords are highlighted in the topic pane.

In-topic navigation bars
Navigation bars added to a layout using WebHelp as the output type.

Expanding hotspots, drop-down hotspots, and twisties
Text links that expand to display additional information, but not other topics. These hotspots are available in browsers that support Dynamic HTML (DHTML).

Text-only pop-up
A window that displays only text, not topics or web pages. Text-only pop-ups are useful for definitions or details. Unlike regular pop-ups, a text-only pop-up resides in the topic that contains it. It’s not a separate topic.

Image maps
An image in an HTML topic that contains graphical links to other topics. Clickable areas in the image are hotspots.

Image links
A link in an image that takes users to a destination or opens a pop-up. Creating image links is like creating text links.

Bookmarks
A link that takes users to a specific place in a topic.

WinHelp topic control
(Microsoft HTML Help only) A clickable object that opens a WinHelp system.

You specify many of these features through settings in the Properties > Navigation dialog box for the specific layout:

Show Navigation Pane Link In Topics
Select to include a link to the navigation pane in topics that are opened through the context-sensitive Help calls.

Add Breadcrumbs Links
Select to add breadcrumbs in the topic pages.

Show Merged TOC In Child Project
Select to view the merged TOC in the child project.

Format
Click to change the format of breadcrumbs.

Show Context In Search Result
(WebHelp, FlashHelp) Select to display the context of topics in search results.

Enable Highlight Search Result
Select to highlight the search results in Topics. Select the color to highlight the search results.

Add About Box
Set up information that appears in a dynamic window when users click the image in the main toolbar.
Example of About box

Browse Sequences
Create browse sequences before enabling them.

Detail
Change the text displayed for the in-topic navigation bar elements.

Search Input Field In Toolbar
Include a search field in the main toolbar.

Synchronize Table Of Contents
Synchronize the TOC with the topic in the right pane so that users see where they are in the structure.
  • To synchronize the TOC automatically, click the pop-up menu and select Automatically.

  • To add a button that users can click to synchronize the TOC, click the pop-up menu and select Manually.
    Note: If you use custom skins, provide a button icon in the WebHelp Skin Editor.

About breadcrumbs

Breadcrumbs are navigational links displayed in web pages of the Help system. These links outline the position of the page in the table of contents or the directory structure of the project. You can define breadcrumbs in a master page or a topic. They can also be configured at run time to appear on the top or bottom of a page.

The user can click a portion of the breadcrumb trail to go directly to a page. For example, if the trail is Home > Installation > Hardware Requirements, the user can click Installation to go directly to the Installation page.

Breadcrumbs are displayed in merged projects. The breadcrumb trail for a page in a merged project shows the position of the page with respect to the merged project and the master project.

For example, suppose the master project MultiCuisine contains the project AsianCuisine. AsianCuisine in turn contains the project JapaneseRecipes. The breadcrumb trail for the topic “Common Japanese Ingredients” is as follows:

Home > MultiCusine > AsianCuisine > JapaneseRecipes

Breadcrumbs are generated only in WebHelp, WebHelp Pro, FlashHelp, FlashHelp Pro, HTML Help, and AIR Help. For all other layouts, breadcrumbs are not generated, even if placeholders are present.

Add breadcrumbs to topics

  1. Select View > Pods > Single Source Layouts.

  2. Double-click the WebHelp/WebHelp Pro/FlashHelp/FlashHelp Pro layout, and do the following:

    • (WebHelp) In the Navigation pane, select Add Breadcrumbs Links, and click Format.

    • (WebHelp Pro/FlashHelp/FlashHelp Pro) Click Next. Select Add Breadcrumbs Links and click Format.

  3. In the Layout area, select the placement and alignment for the breadcrumbs.

  4. In the Text area, select or specify a name for the link to the main Help page, which appears on every topic page.

  5. Select a separator for the Breadcrumbs.

  6. Type a label that precedes the breadcrumbs trail. For example, you can add the static text "You are here" before the breadcrumb trail.

  7. Preview the layout and formatting of breadcrumbs in the Preview pod.

  8. Select a background color.

  9. (Optional) Select Use Topic Level Format to use the default format settings.

  10. (Optional) Click Format to change the default font settings.

  11. Click OK, and then click Finish.

In the generated WebHelp, all the topic pages show a breadcrumb trail reflecting the TOC hierarchy.