Skip to main content
Inspiring
August 11, 2022
Question

TOC "hides" all but the first book in Responsive HTML5 output on smaller screens

  • August 11, 2022
  • 3 replies
  • 334 views

Hello there,

In the Responsive HMTL5 output, only the first  “book” in the TOC is visible when viewed from a laptop or smaller screen. You have to click the first book to show all the other books. All books are at the same level as shown in the source files in Robohelp.

 

This issue doesn’t occur on bigger monitors. It also doesn’t occur in all of our online help projects: just two of them. There were no unique settings in the TOCs in either of these two projects that I know of.

Additional info:

  • We’re using Robohelp 2020 8.34
  • It’s not an issue with the skin: I replaced the skin with one that I know works and that didn’t fix the issue.

Thanks in advance for any insight!

Dawn

    This topic has been closed for replies.

    3 replies

    Peter Grainge
    Community Expert
    Community Expert
    August 15, 2022

    Go back to Support with a polite version of "it failed".

    ________________________________________________________

    My site www.grainge.org includes many free Authoring and RoboHelp resources that may be of help.

     

    Help others by clicking Correct Answer if the question is answered. Found the answer elsewhere? Share it here. "Upvote" is for useful posts.
    Inspiring
    August 15, 2022

    Thanks, Peter! I'm in the middle of a chat with Adobe support now. I'll post here when I know something definitive.

     

    Inspiring
    August 23, 2022

    Adobe Support advised me that, because I had to manually recreate so much of the TOC (because our project was so disorganized), it "rebroke." A little history of the project: it was created with no logical folder structure in Contents, and a former colleague subsequently lost the project and then "recreated" it by importing the Responsive HTML5 output back into RH. We have had many random issues with the project since. Adobe support had told me to delete a bunch of JS files to attempt to fix the corruption introduced by this "recreation." So, yesterday, to attempt to fix the TOC issue and possibly leave us with a corruption-free project, I created a brand-new project, and am creating logical folders into which I'm importing topics from the "recreated" project and relinking the style sheet and images. So far, as I'm testing by auto-generating the TOC, the TOC issue is not recurring. Peter, in your opinion, is this method of recreating the project likely to retain any of the corruption introduced when my colleague imported the output files? How would you advise me to proceed? Thank you!

    Jeff_Coatsworth
    Community Expert
    Community Expert
    August 11, 2022

    Sorry, no idea - not a CSS guru. But if you've got it working in one project & not in another, a fast test would be to create a backup of the "bad" project (for safety) and then copy over all CSS files from a "good" project to the bad one and see if that has any impact.

    Inspiring
    August 11, 2022

    Woohoo! I'm cautiously optimistic that your advice fixed it! It looks that way! I'm going to do a random QC on the project to see if all the styles look good. Thank you so much!

    Inspiring
    August 15, 2022

    Actually, that didn't work: the issue seems to be intermittant. I opened a ticket with Adobe Support. The support rep advised me the TOC file was likely corrupted when the project was upgraded from 2019 Classic RH to the new interface, and that I should delete the TOC and create a new one. That seemed to work, but again, only intermittantly: as I continued to add new "books" to the TOC and generate the output, the issue reoccurred.

    Jeff_Coatsworth
    Community Expert
    Community Expert
    August 11, 2022

    If the "problem" projects work on larger monitors, then I would suspect that it's got something to do with the CSS being used to define the display sizes of things.

    Inspiring
    August 11, 2022

    Thanks for your reply, Jeff! I don't know which css would define the display sizes of things? We have a custom css that was created by customizing out of the box styles in simple ways: font family, colors, etc. Would the display size be configured in that type of css? Or is there another one that is built-in that would cover that?