RH2019 embed custom font

[straayer]

I'm building a new version of our HTML5 help with the reimagined robohelp and try to use our company font. For the body I've managed to make it available everywhere I've tested by importing an online font.css pasting the following line at the beginning of my default.css (ofcourse the [font.css url] is replaced by the actual url).

@Import url("[font.css url]");

Now my problem is, that I can't seem to use the same font across all platforms for the toc and title, as Robohelp won't recognize it. I've found it should be embedded in the layout.css that is created while building the output. On a local build I've added the line of code to layout.css after the build was finished and the effect is perfect. However, we're using an automated Jenkins build, so I can't simply paste my fonts source into this. 

Now my question is the following: Is there a way for me to either create a font set that can refer to the online fonts that is used throughout the project (and not just in the body text), or to tell the build to add this import to layout.css?

[Peter Grainge]

See this page on my site. It works on Windows but I haven't tested on all platforms. There is a link to a demo so you can try on whatever platform you need.

http://www.grainge.org/pages/authoring/fonts/fonts.htm

[straayer]

Hi Peter,

thanks for the reply. I checked your sample project, but I've already tried all the options listed there.. Adding the font to the css folder and referencing it in an @font-face{} in the css has no effect on the header and toc text.

A link in the html might be a good solution as well, though adding in the master page again only effects the body text, not the header and toc.. any other ideas? 🙂

[Peter Grainge]

I'm confused because the demo shows the font face in my TOC and the Header of the @font-face topic.

[straayer]

It does look like it. However, with the solutions I can find on your page, I still get the correct font in the body, but not in the header and toc:

Referring to the online font this happens on every platform, using the .ttf the header and toc show up great on my own machine, but as above on part of other platforms i've tested on. If i use [F12] on this output and paste the font url in the layout.css all problems are solved..

[Peter Grainge]

Have you tried applying the CSS I used or downloading the project and testing what you get with that? I'm pretty sure I did test it on a machine without that font.

See if my project works for you first.

[Amebr]

In the skin you can select a font to be used for the layout, in the Layout or General section (depending on the skin). But I think you can only select installed fonts there.

The approved way of customising things in New UI is to add custom stylesheets to the User Assets section (under Layout or User Assets, depending on the skin), so you could try adding your stylesheet there, but I'm unsure exactly what you'd have to specify to get it to work.

[Peter Grainge]

So are you saying that my method works on Windows but not other platforms?

Where doesn't it work?