• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers

Font not being applied in RH2020

Explorer ,
Oct 14, 2021 Oct 14, 2021

Copy link to clipboard

Copied

Things were fine, i.e., all fonts were the same on my mobile pages. Now, first page has our proprietary font, second page has a mixture, proprietary font (let's call it MyFont) in the h1, MyFont in p and no font selected in td so in td, I have Times New Roman as the font. I've gone to the deafult.css, checked that: MyFont, Arial, sans-serif; is in the body section, no other font used anywhere in the CSS. There is no stylesheet associated with the master page and I don't use a master page when generating. 

 

I had noticed this last week and couldn't figure out how to update the style, there's some confusing thing about make your change then click on the update style icon but when I go to a different page, the change I had made to styles is not applied. When I click on Styles in the right hand side, I have no styles, None. I then went into each place where my font had to be applied and changed the Font Family for that section in Content Properties, clicking on Update Style after each change. Saved, generated and looked, no changes appear in my generated output, fonts are still changing to Times New Roman and when I go back to my project, the changes I've made to Font Family are gone.

 

What am I doing or not doing wrong? Thanks for your help.

Helen

Views

297

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Oct 14, 2021 Oct 14, 2021

Copy link to clipboard

Copied

Making any changes in Content Properties will only make the change to the specific element (paragraph, heading, list item, etc) that is selected, so I don't recommend doing that.

 

Given you say the Styles panel doesn't list any styles, that suggests a stylesheet is not associated with the topic. check in the Topic Properties panel. You can also check the stylesheet for all topics - tick the Stylesheets checkbox under columns - and bulk apply one if necessary, using the Topic List report.

 

Also, if the proprietary font is not installed on every computer that will access your help, you'll need to make sure the font is specified using @Font-face. See Peter's site for instructions and a demo.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Oct 15, 2021 Oct 15, 2021

Copy link to clipboard

Copied

I suspect there may be a bug in Update Style. My understanding is it should change the CSS but it doesn't. I have reported this to Adobe.

________________________________________________________
See www.grainge.org for free Authoring and RoboHelp Information

Help others by clicking Correct Answer or Like if helpful. Found your answer elsewhere? Share it here.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Oct 15, 2021 Oct 15, 2021

Copy link to clipboard

Copied

It seems there is a trick to using Update Style. Rather than selecting a heading, select the breadcrumb above, apply the changes and then click Update Style. That works.

 

I think it should work by selecting the text as it did in Classic.

________________________________________________________
See www.grainge.org for free Authoring and RoboHelp Information

Help others by clicking Correct Answer or Like if helpful. Found your answer elsewhere? Share it here.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Oct 15, 2021 Oct 15, 2021

Copy link to clipboard

Copied

Please add your vote if you want to see this working as it did in Classic.

 

RH-10265

________________________________________________________
See www.grainge.org for free Authoring and RoboHelp Information

Help others by clicking Correct Answer or Like if helpful. Found your answer elsewhere? Share it here.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Oct 15, 2021 Oct 15, 2021

Copy link to clipboard

Copied

Thanks to you both for your replies. I have checked the topics, every topic is associated with default.css. I have applied @Font-face in the css per Amebr's instructions and also done what Peter suggested. It's like nothing is sticking when I hit Update Styles. I save my work basically after every change I make and nothing seems to stick. I've even taken the time to add the font-family to almost every style in the css, especially p. From one p to the next in a topic, the font changes. OK, I'm going to go away, drown my frustration in my tears (because this worked in 2019 Classic) and start afresh Monday.

Thanks for the help, I appreciate it.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Oct 18, 2021 Oct 18, 2021

Copy link to clipboard

Copied

So back to trying again. Every topic page has the Style sheet default.css applied under Topic Properties. In the Topic list, default.css is also listed there for all my topics. @Font-face is in css. The font in the Font Weight section of Content properties actually changes from one time that I touch the text to the next, as in I place my cursor in the text, it shows MyFont (hmm, only MyFont, not MyFont, Arial, Sans-serif; as shows in the css), I scroll down, place cursor in another block of text, return to the first location, Font Family now shows Select. 

 

Once again, any idea what I'm doing wrong?

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Oct 19, 2021 Oct 19, 2021

Copy link to clipboard

Copied

Is it still the case that you have no styles showing when you click the Styles icon? If so the issue is the CSS itself. If you open that in the CSS editor does it show the UI or the code? If the latter it means there is something in your CSS that the editor cannot parse and you need to fix that first.

 

Are there any @media styles in the CSS? If there are, comment them out. /* before the start and */ at the end.

________________________________________________________
See www.grainge.org for free Authoring and RoboHelp Information

Help others by clicking Correct Answer or Like if helpful. Found your answer elsewhere? Share it here.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Oct 19, 2021 Oct 19, 2021

Copy link to clipboard

Copied

I had followed Amebr's directions in the first post and used your directions to include the @Font-face in the CSS. I've now commented that out. There is no other @ in the CSS file. No change to the result. There have never been any styles showing when clicking the Styles icon in the right side but the correct font was previously applied everywhere in the project which seemed correct as the font-family was declared in the body of the CSS. Every so often and sometimes when I haven't made any change in the default.css, I get a message saying stylesheet failed to parse. It's not consistent and I can't reproduce it on demand.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Oct 19, 2021 Oct 19, 2021

Copy link to clipboard

Copied

There have never been any styles showing when clicking the Styles icon in the right side

 

If that is the case there is definitely something wrong with your CSS and the fact that TNR appears confirms that, it is defaulting to the standard HTML font when no font is defined. That is where you need to be looking.

 

Until styles appear when you click that icon, I would say it is not worth pursuing anything else.

________________________________________________________
See www.grainge.org for free Authoring and RoboHelp Information

Help others by clicking Correct Answer or Like if helpful. Found your answer elsewhere? Share it here.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Nov 04, 2021 Nov 04, 2021

Copy link to clipboard

Copied

I opened a sample project, changed the font in there to MyFont, generated and the font is there on my machine. Moved that CSS to the other project folder. So now when I check Styles on the right hand side in Author view, there are styles! It works when I generate it locally but MyFont is installed on my machine so I'm not sure that's a true test, even though I was previously seeing the TNR and MyFont on my local machine after generating. I moved to publish then to web server test environment, I see MyFont on Android, TNR only on iOS! Before I did this, on both Android and iOS I saw both MyRoom and TNR in the same topic. Since I now have the correct font showing in Android tablets, I'm reluctant to do anything to try and fix the iOS output so I don't mess up the Android version. Any ideas? Do I add back @Font-face to the CSS?

TIA

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Nov 04, 2021 Nov 04, 2021

Copy link to clipboard

Copied

First of all I would suggest creating a copy of your project as it is now so that if any subsequent work makes it go bang, you have something to revert to.

 

Then go to Using Font Awesome, Google Fonts, @font-face and SVGs in RoboHelp (grainge.org) and see if you can get it working from instructions or the working project there.

________________________________________________________
See www.grainge.org for free Authoring and RoboHelp Information

Help others by clicking Correct Answer or Like if helpful. Found your answer elsewhere? Share it here.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Nov 19, 2021 Nov 19, 2021

Copy link to clipboard

Copied

I did what you suggested and then continued trying. I have been working on this for a while. Here's my feedback:

In our page to select the Help documentation, there is a choice of each OS so when I'm on Android, I can choose which version I want to see. When I choose the iOS version on the following platforms, these are the results:

Windows 10: shows in MyFont but MyFont is installed on this machine, not sure if it's representative.

Linux: shows in MyFont.

MacOS: shows in TNR. The MacOS version shows MyFont which is not installed on this machine.

Android: shows MyFont.

iOS: shows in TNR. 

 

I have examined the default.css for my mobile version which is used by Android and iOS over and over and followed your directions as given, TNR still displays for iOS only, not Android.

 

I've also looked at the layout.css in the generated/template/project/ folder as this is referred to in the source on the iOS machine and MyFont is defined and assigned there as well in the body section but not with @Font-famuily as defined in default.css.

 

Hope this means something to you.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Nov 20, 2021 Nov 20, 2021

Copy link to clipboard

Copied

Windows 10: shows in MyFont but MyFont is installed on this machine, not sure if it's representative.

OK so further testing required.

 

Linux: shows in MyFont.

So all good.

 

MacOS: shows in TNR. The MacOS version shows MyFont which is not installed on this machine.

I'm confused here. You say it shows in TNR and then it shows MyFont.

 

Android: shows MyFont.

So all good.

 

iOS: shows in TNR. 

I can't help you on that. I don't have or use any iOS devices.

________________________________________________________
See www.grainge.org for free Authoring and RoboHelp Information

Help others by clicking Correct Answer or Like if helpful. Found your answer elsewhere? Share it here.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Nov 24, 2021 Nov 24, 2021

Copy link to clipboard

Copied

In each case, I'm accessing the support page which has tabs for each operating system help so I can choose which OS version of Help to look at on each machine. So when I'm on the Mac, I can choose to see the Windows version instead of Mac version. In this case, when I'm on the Mac, when I choose the MacOS version it displays MyFont. When I choose the iOS version instead, it displays Times New Roman , as it does on a Linux machine.  How do I bring this problem to Adobe's attention? 

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Nov 24, 2021 Nov 24, 2021

Copy link to clipboard

Copied

This may be a dumb question but if I am on a Mac machine, why would I choose the iOS option.

 

I think the issue is that you have set things up to work on Windows using the method I have described or something else and it works on Windows. Whether it will work on other operating systems and how is a different thing and as I have said, I can't help on that. 

 

The first question to address is on what operating systems is RoboHelp's output supported. You can ask Support. See https://helpx.adobe.com/contact/enterprise-support.other.html#robohelp for your Adobe Support options. The email link tcssup@adobe.com is recommended as it reaches a team dedicated to Technical Communication Suite products including RoboHelp. 

 

How to make any HTML work on other systems beyond what is supported is a matter for other forums. 2020 is will accept valid CSS3 and HTML5.

 

It would be interesting and useful if you would post back what you are told by Support.

________________________________________________________
See www.grainge.org for free Authoring and RoboHelp Information

Help others by clicking Correct Answer or Like if helpful. Found your answer elsewhere? Share it here.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Nov 24, 2021 Nov 24, 2021

Copy link to clipboard

Copied

Just so you know, I would not normally ask for the iOS version on a MacOS machine, for instance, but wanted to see whether it was the iOS version that was wrong or just my iOS devices. It's the version that is wrong as the version is wrong on other operating systems.

 

I'll use your links and let you know by posting back here what their response is.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Nov 25, 2021 Nov 25, 2021

Copy link to clipboard

Copied

I think it will help Support if what works where is set out in a table with one row showing

  • Viewed on a Windows device- Name of font seen
  • Viewed on a Mac device - Name of font seen
  • Viewed on iOS device - Name of font seen
  • Viewed on Linux device- Name of font seen

 

Then rows showing what you see when each version of the help is viewed on the "wrong" device. for example:

Windows Device

  • Font seen in Windows Help
  • Font seen in Mac Help
  • Font seen in iOS Help
  • Font seen in Linux Help

and so on for each device.

 

Maybe I am still not following you but I have read this thread a few times and your scenario is still not clear to me. We are talking about one version of the help being viewed on different operating systems, correct?

 

Also I noticed in the first post you said "When I click on Styles in the right hand side, I have no styles, None." Is that still the case? If it is it means the CSS editor cannot parse the CSS. That doesn't necessarily mean there is anything wrong with it, simply the parser cannot understand it so the definitions could be right or wrong. However, it's worth looking into. Any media styles specified in the CSS? If so comment them out, that might fix it.

________________________________________________________
See www.grainge.org for free Authoring and RoboHelp Information

 

Help others by clicking Correct Answer or Like if helpful. Found your answer elsewhere? Share it here.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Nov 26, 2021 Nov 26, 2021

Copy link to clipboard

Copied

Peter, thanks for your advice. Heres what I came up with to reply to Adobe who had asked for my Windows, Mac and Linux versions, I figured I'd give them everything all at once:

Using this OSFont seen using this RH version         
 WindowsWindowsMacMacLinuxLinuxAndroidAndroidiOSiOS
 TOCTopicTOCTopicTOCTopicTOCTopicTOCTopic
Windows 10 EnterpriseMyFontMyFontMyFontMyFontMyFontMyFontMyFontMyFontMyFontMyFont
Ubuntu 18.04.05 LTSMyFontMyFontMyFontMyFontMyFontMyFontMyFontTNRMyFontTNR
macOS Catalina 10.15.7MyFontMyFontMyFontMyFontMyFontMyFontMyFontTNRMyFontTNR
iPhone 14.8.1MyFontMyFontMyFontMyFontMyFontMyFontMyFontTNRMyFontTNR
Android version 9MyFontMyFontMyFontMyFontMyFontMyFontMyFontMyFontMyFontMyFont

 

Yes, I'm talking about one version being viewed on other operating systems but the primary concern is that even on the operating system it is for, i.e., my iOS version on an iPad or iPhone, the font is wrong. And why does the TOC display correctly but the topic doesn't? Quandary, conundrum, I'm lost in both.

 

To answer your question about the CSS, at one point I had moved the CSS from my second project which is presented in MyFont on all devices and OSs to this project, styles appeared so that problem was solved but it still did not solve the TNR issue.

 

Thanks for all the help!

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Nov 26, 2021 Nov 26, 2021

Copy link to clipboard

Copied

All the help is produced on the Windows version of RoboHelp and then viewed on different platforms. The first column is the OS being viewed on.

 

The other columns show how the help appears for each OS. So the topics for Windows and Android are correct no matter what OS you view on.

 

When you view the topics for Linux, Mac and iOS on devices running those operating systems is when things go wrong, correct? Taking Linux as an example, what seem odd is the topics for say Windows viewed on the Linux OS are correct but the Linux and iOS topics are not. The most obvious thing to check is are the topics that don't work using the same CSS as those that do.

________________________________________________________
See www.grainge.org for free Authoring and RoboHelp Information

Help others by clicking Correct Answer or Like if helpful. Found your answer elsewhere? Share it here.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Dec 02, 2021 Dec 02, 2021

Copy link to clipboard

Copied

Somewhere my chart didn't get across. When on a Linux, MacOS or iOS machine and viewing the Android or iOS version of my Help, TNR is displayed in all topics. There is only one CSS, default.css (MyFont defined in this css) and it is applied across the whole project.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Dec 02, 2021 Dec 02, 2021

Copy link to clipboard

Copied

I see the table in this thread. What I cannot figure out is how on a given operating system some topics provide the correct font while others do not. For example, I could understand an OS not working with MyFont but not showing it is some topics but not others.

 

There has to be some difference in the HTML or maybe masterpages applied. I don't have the necessary hardware to test it so I'm sorry but I can't help you further.

________________________________________________________
See www.grainge.org for free Authoring and RoboHelp Information

Help others by clicking Correct Answer or Like if helpful. Found your answer elsewhere? Share it here.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Dec 02, 2021 Dec 02, 2021

Copy link to clipboard

Copied

That's my question exactly and why I'm trying to figure it out. I have also addressed it to Adobe per your information and after having given them the same table on the same date as above, I've heard nothing back from them.

 

Thank you for your diligent pursuit of this issue, I've examined HTML all over the place and do not see where it could be going wrong. I'll wait for them to come back to me but once again, kudos to you for persistence and suggestions!

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Dec 02, 2021 Dec 02, 2021

Copy link to clipboard

Copied

Maybe it's the font file format you've defined. Perhaps you've only used one, and it happens not to be supported on a couple of platforms? Or maybe the order you've entered them in the stylesheet means the correct one isn't being picked up for specific platforms? Have a look at this page and see if and of the things to keep in mind help.

 

https://developer.mozilla.org/en-US/docs/Learn/CSS/Styling_text/Web_fonts

 

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Dec 03, 2021 Dec 03, 2021

Copy link to clipboard

Copied

LATEST

@Amebr My understanding is this is a single project with a single CSS file and a single output. The problem is that on the Mac OS for example, the topics that describe the Windows, Mac and Linux systems work but the topics that describe Android and iOS do not.

 

To my mind if one topic works on a given OS, they all should.

 

It feels like something is not being described properly or @TatuMbili is missing something, no offence meant as we've all done it when troubleshooting.

 

@TatuMbili I think at this point I would do the following.

  1. Create a brand new project.
  2. Import your CSS.
  3. Import one topic that works on all platforms.
  4. Import one topic that does not work on all platforms.
  5. Test that to prove it shows the same issue.
  6. Assuming it does, it should be easier to spot the issue.

________________________________________________________
See www.grainge.org for free Authoring and RoboHelp Information

Help others by clicking Correct Answer or Like if helpful. Found your answer elsewhere? Share it here.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Resources
RoboHelp Documentation
Download Adobe RoboHelp