CSH Calls for HTML5 Output

which method is best for you?

Each method has its unique benefits. Generally speaking, the JavaScript method lets you have more control, whereas the URL method is a bit more quick and simple.

One reason to choose the JavaScript method is to better control the window size and location. With the URL method, the browser window automatically starts to open at the same size and location as the previous time that browser window was opened. But if you have specified a different size and location for your output window, the window will visibly move and resize accordingly. The JavaScript method prevents this type of behavior by opening the window directly to the size and location you specified. You would set the window size and location in the skin. Then in the JavaScript call you would specify the appropriate skin.

Another benefit to using the JavaScript method is that it is required in order for the Browser Settings option to take effect. This option can be found on the Setup tab of the Skin Editor. See Specifying Browser Settings.

how to use javascript to open html5 output

Author Add a header file to your project.
Author Add an alias file to your project.
Author In the Alias Editor, create and assign an identifier (ID) for the topic that you want to link to from the CSH call.

For example, if you have a topic called "Welcome.htm," you might create a new ID and also name it "Welcome." Then you might assign a value of 1000 to it. You would make sure that the topic Welcome.htm is assigned to the ID.

Finally, an optional step in the Alias Editor is to assign a skin to that ID. However, you can bypass this step and specify a skin later when you create the actual JavaScript, or you can choose not to select a skin at all.
Author Build your Help system using an HTML5 target and publish the output files to the final destination.
Developer Add a reference to the JavaScript file (which is created automatically when the author builds the output). This .js file should be named "csh.js." The reference to the JavaScript file should use the following format: <script type="text/javascript" src="[path of file]/csh.js"></script>.

Note: Make sure you use forward slashes (/) in the src path to the file, even if the file is referenced locally.
Developer Create a trigger and add the command to let users open the Help system. Here is a format that you can use to add a button.

<input type="button" value="Open Help System" onclick="MadCap.OpenHelp(ID, skin name, search string, first pick search string value );" />

You can change the input type and the value if necessary. The most important parts that you will adjust are the elements within parentheses (ID, skin name, search string, first pick search string value).
- ID This is the CSH ID that the author created in Flare (see Step 3 above). This can be either the ID name or value. The topic and skin associated with the ID will be used. If no skin is associated with the ID in Flare, the skin name that you provide in this command will be used. Alternatively, the ID may contain a topic path. In this case, the specified topic will be loaded with the skin that is specified in this command. The topic path must be relative to the Content folder of the Flare project. You also have the option of entering "null" instead of an ID to use the Help system's default starting topic.
- Skin Name This is the name of the skin to use when opening the Help system. If a skin has been assigned to the ID in Flare (see Step 3 above) and you enter a skin name in this command, the skin name in the command will take precedence. You also have the option of entering "null" instead of a skin name if you want to use the Help system's default skin or to use the skin that is associated with the CSH ID in Flare.
- Search String This is an optional element that automatically performs a search for a specific string.
- First Pick Search String Value This element can be used in conjunction with the search string. If you use the first pick option, you can include a true or false value. If the value is true, the first topic found with the specified search string will be opened automatically. If the value is false, the search results will simply be displayed; the first topic will not be opened automatically.

examples

In the following example, the topic and skin associated with "Welcome" will be used. No search string information is included.

In the following example, the topic associated with "Welcome" will be used. "BlueSkin" will override the skin associated with "Welcome." No search string information is included.

In the following example, the topic and skin associated with the ID value 1000 will be used. No search string information is included.

In the following example, the topic associated with the ID value 1000 will be used. "BlueSkin" will override the skin associated with ID value 1000. No search string information is included.

In the following example, "Company/Employees.htm" will be used with the default skin. No search string information is included.

In the following example, both the default topic and skin will be used. A search will automatically be performed for the words "quarterly report," but the first topic found in the search will not be opened automatically.

In the following example, the default topic will be used with "BlueSkin." A search will automatically be performed for the words "quarterly report," and the first topic found in the search will be opened automatically.

how to use a url to open html5 output

Author (Optional) Add a header file to your project.
Author (Optional) Add an alias file to your project.
Author (Optional) In the Alias Editor, create and assign IDs for the topics to which you want to provide links. If you do not want to create a header file, alias file, and IDs for topics, you can instead use the file names for the topics to which you want to link.

An optional step in the Alias Editor is to assign a skin to that ID.
Author Build your Help system using an HTML5 target and publish the output files to the final destination.
Developer Create a trigger and add a link to let users open a specific area of the Help system.

There is a certain amount of flexibility in terms of how you create the link and what you can include in it. Here is the basic structure of the link.

[main entry file].htm#cshid=[ID number, ID name, or topic path/name]&searchQuery=[search string]&firstPick=true

After the hash tag (#), you can specify any combination of the parameters (cshid, searchQuery, firstPick), separated by ampersands (&). The order of the parameters does not matter.
- Main entry file Provide the path to the main entry file for your output. The file name is determined by whatever you enter into the Output File field in the General tab of the Target Editor. If you do not provide a name in this field, the name "Default" will be used.
- cshid This is the CSH ID that you created in Flare (see Step 3 above). This can be either the identifier name or value. The topic and skin that is associated with the ID will be used (unless you override it in this link by specifying a different skin name). Alternatively, you can enter the path and name of the specific topic to which you want to link. If you use this element, you do not need to create an ID as described above. The topic path must be relative to the Content folder of the Flare project.
- searchQuery This is an optional element that automatically performs a search for a specific string.
- firstPick This element can be used in conjunction with the search string. If you include the first pick option, the first topic found with the specified search string will be opened automatically. If you do not include this element, the search results will simply be displayed; the first topic will not be opened automatically.

CSH Calls for HTML5 Output—Developers