Adobe RoboHelp 8 – How to Create a New Cascading Style Sheet (CSS)

© 2010 Ugur Akinci

One new feature of RoboHelp 8 that I like is the way it allows you to use CSS (Cascading Style Sheet) to format the headers, body text, font/color, etc. of your topics.

This is not a primer on CSS but let me just mention the obvious advantage of using a CSS: when you want to make any stylistic change (let’s say, changing the font and color of Heading1 paragraph style) you can change it only once inside the CSS file (which is basically a text file) instead of making the change in every topic you’ve created. It’s really the only way to control the styling of complex help projects.

RH8 comes with a default CSS file (called — of course — “default.css). But that does not mean you’re stuck with it. You can import an existing CSS sheet (file) or create a new one.

Here is how to create a new CSS file:

1) Select View > Toolbars > Formatting to make sure the formatting toolbar is displayed on the top of your work area.

2) Click the Style Sheet button on the Formatting toolbar to display the drop-down menu:

RH-StyleSheet-Button

3) Select New to display the Create New Style Sheet dialog box:

RH-CreateNewStylesheet

4) Type a filename in the Name field, complete with its .css extention (e.g., “New_CSS_File.css).

5) Select a location to save the file from the Folder drop-down list.

6) Check the Copy Styles From check-box if you if you’d like to base your new CSS on a pre-existing one.

7) Click Create to display the Styles screen:

RH-Styles Screen

8] Click the New drop-down list to create new Character, Paragraph, Table, etc. styles.

9) Click the Format drop-down list to format your fonts, paragraphs, borders, etc.

10) Click OK to save your new CSS.

RoboHelp 8 Resources

Adobe RoboHelp 8 HTML: The Essentials
Ret Robohelp Office 8 Win 1U
Upgrade Robohelp Office 8 Win 1U