HelpSmith Topics
Making Help Authoring a Pleasure To Do

Applying a Google font to the text in a help file

Hi,

I'm a registered HelpSmith user creating a help system for my application.

My question is how can I apply a custom font to the text in my:

  • CHM help file
  • Web Help system

Is it possible to use a Google font?

18

Comments

HelpSmith allows you to include a custom CSS file (Project|Project Options|HTML Includes), so you can apply a custom font by:

  • Linking to the Google Fonts service
  • Including a local font's .woff2 file

For more details on adding custom CSS, JS, and other files, you can visit:

https://www.helpsmith.com/webhelp/topics/including-javascript-and-css-styles.htm

12

Could you please provide a sample help project that uses a Google font?

8

Below you can find a sample help project that includes a custom font by linking to the Google Fonts service.

8

Here is another sample help project that includes a local Pacifico.woff2 font file.

Please note that if you include a custom CSS file (at: Project|Project Options|HTML Includes) that links to a local .woff2 file, in the "HTML Include" window, you should include it as Folder, so HelpSmith will copy the entire folder with the CSS and .woff2 file(s).

7

How to apply a custom font to selected text

You can specify the name of a custom font in the Font dialog, and similarly in the Web Help appearance settings.

For example:

  1. In a topic, right-click on the selected text and then click "Font" in the popup menu.
  2. In the Font dialog, in the Font box, type the name of your font (for example, "Pacifico" as in the sample projects).
10

How to apply a custom font to all text in a topic (via CSS)

Also you can apply a custom font to all paragraphs in a topic by using the CSS code like:

p, p span {
    font-family: Pacifico !important;
}
6

Add a Comment

Please Login or Register or leave comments.

Hello World
Lorem ipsum dolor sit amet
OK
Login
Nickname or Email:
Password:
If you do not have an account, you can register.