HyperText Studio Title
HyperText Studio Title Home Button Features Button Download Button Purchase Button Support Button Contact Button Company Button
 

TechNote 10008: Creating a header across many topics using topic style content

Topic styles can be used to create headers in topics which can be used in multiple topics, for example in the HyperText Studio help file:

This TechNote describes how to replicate this heading in your own projects.

Note: This TechNote assumes that you already know how to create a topic style with content as described in TechNote 10007: Creating and using a topic style with content.

Creating the content

A table will be used to display the heading bar across the top.

  1. Create a topic style and open it for editing.
  2. Remove any existing content from the topic.
  3. Create a table using Insert | Table, filling in the values as below.:

Making code changes

  1. To add some of the settings we wish to apply to the table we must now make some changes to the HTML source.  Click .
  2. Place the cursor just before the > after <table.
  3. Press the space bar and a menu will appear.
  4. From the menu select bgcolor.
  5. When the next menu appears, select Color...
  6. In the color dialog, enter the color as #336699 and click OK.
  7. Type in the following code before the >, which displays a thin border after the heading:
    style="border-bottom-style: solid; border-bottom-color: black; border-bottom-width: 1px".

Setting page defaults

The table as it is looks to far from the border of the page.  To change that we will change some of the topic properties.

  1. Go back to Design view by clicking on the  tab.
  2. Select Topic | Properties.
  3. Go to the Margin tab.
  4. Type 0 as the value for the Left and Top options.
  5. Press Enter.

Formatting the text

It would be useful to have the HyperText Studio automatically insert the title of our topic.  This can be done by using the Title Field.  Each topic using the topic style will then use their own title in their page.

  1. Press CTRL+HOME to go to the start of the topic.
  2. Select Insert | Field.
  3. Ensure that Title is selected.
  4. Click OK.
  5. Click on the newly inserted field to select it.
  6. From the Formatting toolbar, click the color button .
  7. From the drop-down select white as the color.
  8. Add any other formatting you wish to use.

Creating the editable region

Now that our heading is setup we need to create an editable region for each topic's text to be placed in.

  1. Press CTRL+END to go to the end of the topic.
  2. Select Format | Editable Regions | New
  3. Type the name you wish to use for your editable region into the dialog.
  4. Click OK.
  5. Select File | Save to save the changes to the topic style.  This will automatically update any topics currently using this style.

Now you can apply your new topic style to any topic in your project to see the results of your work!

 

Copyright © 1991-2011 Olson Software Limited. All rights reserved.