Font Awesome Icons in RoboHelp

Forum|Forum|8 years ago
August 25, 2017
13 replies
8377 views

I recently installed the Font Awesome icons (i.e. symbol font) in Microsoft Word so that when using the Insert > Symbol option, I can change the Font dropdown (on the Symbols tab) to FontAwesome to see and select the icon I want to insert into the Word document. I'm looking for a way in RoboHelp 2015 to also be able to do this. When choosing Insert > Symbol, I'd like to be able to see the list of FontAwesome icons so I can select one to put into my Topic. But I'm not seeing a way to do this. I know I can do screen captures of each of the FontAwesome icons, either via MS Word or even one of the many websites that display Font Awesome icons, and then paste that screen capture into RoboHelp, but I'd rather be able to select the symbol from a list when I need one. Anyone have any thoughts or ideas on how to get the Font Awesome icons into RoboHelp? I'm just not seeing a way to do this. Thank you.

This topic has been closed for replies.

Show previous replies

shootathought

Inspiring

I have been formatting them that way, I just said <i> for brevity. I'm using the code exactly as written in the help on the font-awesome site. If I hide them in <div> tags they'll stay for a while. It I even try to edit in the wysiwyg or the html editor, robohelp either dies or removes the tags (sometimes both). Still, it works, as long as I remember to edit the topic in notepad++ instead of the editor.

shootathought

Inspiring

I have managed to get font-awesome to work in RoboHelp, but you have to do a few odd things. I am using RoboHelp 2017, so steps based on that.

After downloading font-awesome, copy all of the files in the css and the fonts folder, then use Window Explorer to place them in your Project Files folder.
Open RoboHelp, then import the files as baggage.
Add the following to your Master Page in the <head></head> section using the html editor:
<link rel="StyleSheet" href="font-awesome.css" type="text/css" />
<link rel="StyleSheet" href="font-awesome.min.css" type="text/css" />

Here's where the fun comes in. RoboHelp pretty much hates font-awesome. It will randomly delete all of the <i> tags in your html just for fun. I would keep a folder somewhere outside of the project with the html backed up if you aren't using source control. I also don't recommend using the HTML editor in RoboHelp to insert the <i> tags. Do it in Notepad or Notepad++. RoboHelp crashes a lot if you try to do it in the editor.

I have had some luck hiding the <i> tags from RoboHelp by surrounding them in <div> tags. That also helps with layout, anyway, so win/win. But eventually RoboHelp will find the tags and delete them, and you'll be sad if you don't have them backed up.

Good luck!

S

Stefan Gentz

Community Manager

RoboHelp deletes certain formatting related "empty tags", that is, tags without content written like this: <i/>. This is to clean up files and avoid unnecessary tag clutter, especially after importing files from other formats.

You can force RoboHelp to keep your tags by inserting FontAwesome tags like this:

That is, just wrap a non-breaking space with the FontAwesome tags. I have not tested it (midnight here), but it should work.

Captiv8r

Legend

Hi there

Unfortunately there is no way I'm aware of that you might be able to coax these characters into the RoboHelp offered list. I think your best bet is to either have them all in a Word document where you might be able to copy/paste as needed, or you might consider using the Windows Character Map application (assuming it is capable of displaying them). (Start > Run > Charmap)

Cheers... Rick

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.

Scanning file for viruses.

This file cannot be downloaded