How to get Roboto Font for RoboHelp 11?

@1715680 - Correct me if I am wrong but I think what you are saying is that if the user wants Roboto to work for a user of the help on a machine that doesn't have the Roboto font installed, they need the Google version. Correct?

The font is a Google font, not an Adobe font, so you'll need to use the link Stefan included in his post.

Thanks Jeff, Peter and Stefan for your help.

@Stefan Gentz 

I would like to donwload the font from Adobe. Can you please share the page from where one can download? This is an enterprise Adobe account with Adobe Creative Cloud enabled on my system. Though I havent ever signed into the Cloud account. I simply need the licensing details and installation information so that I can share with the project team and software installation team.

Roboto is also available from Google: The license details can be found here:

https://fonts.google.com/specimen/Roboto

Steps to implement it:

1. Go to the Google Roboto page and select the styles you want to use. I have preselected "Regular 400", "Regular 400 Italic", "Bold 700", and "Bold 700 Italic" here. Select more depending on your needs.

2. On the Google Roboto page, choose "Embed" in the "Selected Family" Panel on the right.

3. Choose @7898623.

4. Copy the code given.

5. Switch to RoboHelp. Open the CSS file associated with the topic. (In RoboHelp 2019/2020, by default this CSS is in folder: "\asset\css\default.css").

6. Add the code to import/link the font, and add it to the appropriate elements. Usually, you would add it for "body" to make it available for all elements.

   Example:
   
   

   @import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,400;0,700;1,400;1,700&display=swap');
   
   body {
     font-family: "Roboto", sans-serif;
   }
   

   
   If you have local font definitions for specific elements, you might need to change them there as well.

7. Save the CSS. Open the topics and check if the font is applied everywhere.

1. Search in Google for Roboto font. According to that it is free.
2. The same folder your project as the CSS. Yes just paste it in using File Explorer or import it.
3. You will need it installed on your computer if you want to see it in the source. That means you must test on a machine that doesn't have the font installed.
4. You need to define the font for the styles where it is to be used. Same as any other font. Look in the project you can download from my site.
5. You will need to edit the CSS file in RoboHelp's CSS editor or in a text editor.
6. Because the font needs to get uploaded to the output folder. The project CSS folders get uploaded automatically but not additional CSS files.

1. Some fonts are not allowed to be distributed (that's basically what you are doing)

2. In the project, yes

3. You should check to see if you are licensed to distribute the font file.

4. Yes, edit the CSS file to include this - doesn't make any difference what tool you use to edit a CSS - it's just text.

5. Yes, same as 4.

6. Because you are distributing the font file, it has to get into your output somehow - in Classic versions, that was achieved via Baggage Files; in the New UI, that's not necessary because the CSS gives RH the info it needs at build time to suck in the file.

Thanks for the link to the page. I would need clarification on few of the points mentioned under the Font Face method.

1.Do I need to purchase the Roboto font as the 1st step mentions going through the licensing details? 

2. It also says that the TTF or OTF file needs to be saved in the same location as the CSS file. Do you mean the project folder? Is this just a simple copy and paste action?

3. I do not recall installing the Roboto font on my PC so that I can see the font in RoboHelp. It came with the project file.

4. It says that the font needs to be added to the CSS file. In the example that was given, the Quicksand font family and file referenced in the URL were added to the file. Does this mean that I need to edit the CSS file from within RoboHelp using either CSS editor or HTML editor?

5. Do I need to manually add the font family to each individual styles (h1, h2, h3 etc) by editing the CSS using HTML editor from within RoboHelp?

6. For Classic version, it is said that the OTF or TTF file needs to be added as a baggage file. Why do we need to do this when we are saving it in the same location where the CSS file is used? This seems to clash with the 2nd point.

Oops. https://www.grainge.org/pages/authoring/fonts/fonts.htm

@Peter Grainge - I think something got lost there - there's no link to any "page below" in your post.

The page below was written for the New UI versions of RoboHelp but I think they will work for Classic. They may need a bit of adaptation.

BTW. If you are generating WebHelp from RoboHelp 11, I would be expecting issues with it in modern browsers. Do test fully.