Participant

Question

RH2019 HTML5 - Is it possible to narrow the width of the TOC pane?

Forum|Forum|4 years ago
June 30, 2021
5 replies
184 views

We have short section & topic titles so when we display the Contents in any of the phone layouts, there's a lot of whitespace between the TOC entries and the wee bit of topic displayed in the right pane. I tried changing the width of the TOC pane in the custom skin I created, and that change sticks in RoboHelp after I Save All and even open and close the file. However, when I generate the Help, the TOC panel displays in the default width.

Is there any way to narrow the TOC pane in phone view? If so, are there any caveats in doing so?

This topic has been closed for replies.

Peter Grainge

Community Expert

Apologies if you took it as some form of admonishment, I simply meant to point out the difference. I'm telling myself off for not looking at the title. 🙂

See how you get on with Amber's suggestion.

If you do change to frameless, Amber has pointed out the developers will need to change the call but it's an easy change to the string.

For what it's worth, I don't think anyone else wanted the width changed so maybe their users haven't been worried about the width. Sometimes when producing the help we worry about things like that more than the users who just want something to click or tap to get what they are looking for.

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

Use the menu (bottom right) to mark the Best Answer or Highlight particularly useful replies. Found the answer elsewhere? Share it here.

A

Amebr

Community Expert

A number of things.

1. Dragging the toc divider in the preview of the skin won't adjust the width of the toc. The preview is just a replica of your browser and only allows you to see what your customisations in the left panel will look like; it doesn't allow you to make any changes.

2. Frameless output has more customisation options than HTML5. So you could consider switching to Frameless output. It would affect any context sensitive calls your developers make though and you'd have to customise a new skin and preset to meet your needs.

3. You can change a lot of things with the HTML5 skin that aren't available in the editor, as it's mostly html and css. But you'll need to inspect the output using the browser developer tools to figure out the style to modify.

For Azure Blue, try the following (this is for RH2019 Azure Blue, but should be pretty close to the RH2020 output):

i. Create a new stylesheet and paste in the following text:

body.media-mobile div.toc-holder {
    width: 50%;
}

You can change the width value to whatever will suit you.

ii. In the skin, navigate to Layout and add the css file under User Assets.

When you generate the width of the mobile output toc should be narrower. If you don't see a difference in the width you can add the !important keyword to the style. If you find you need to add this, and aren't sure how, post back and I'll show the code.

Peter Grainge

Community Expert

It is only a bug if RoboHelp allows you do something and it doesn't work. You said there is no setting for that so it's not a bug but something needing a feature request.

Before we go there, I'll take a look tomorrow but you haven't said which version of RoboHelp you are using.

If you are using a Classic version please go to File Help > About and confirm the version shown. If it is 2019 Classic, please add "Classic" when advising the version number.
If you are using the New UI, 2019 or 2020.

Please always start any thread with that information along with the skin name where that is relevant to the question.

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

Use the menu (bottom right) to mark the Best Answer or Highlight particularly useful replies. Found the answer elsewhere? Share it here.

A

AMBF19634608Author

Participant

Hi Peter,

I apologize if you inferred that I was reporting a bug in RoboHelp. That was not my intent. My customer has no concept of RoboHelp, but if my customer sees a a huge body of whitespace in the TOC of a Help system that my company published, then my customer might think there's a bug in our Help system. Does that make sense? So yes, I am making a feature request of the RoboHelp team: please allow custom resizing of the TOC pane in phone view.

I am indeed using the "New UI" version of RoboHelp--that's why I included RH2019 HTML5 in my intial Post heading. I browsed around your community before I posted and that's what I saw elsewhere so I figured that was what was expected for non-Classic questions.

I didn't realize the skin made a difference as I can create custom skins, but if it helps to know I am using the Azure_Blue skin.

Please don't spend a lot of time on this because I think I have figured out at this time I can't acheive what want with the current 2019 version. However, if the 2020 version doesn't include resizable TOC panes in phone view, then a feature request would be great!

Peter Grainge

Community Expert

In phone view doesn't the TOC just slide out while the user chooses a topic, the slide back? That's making me wonder how it helps. I'm not at a RoboHelp machine to check.

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

Use the menu (bottom right) to mark the Best Answer or Highlight particularly useful replies. Found the answer elsewhere? Share it here.

A

AMBF19634608Author

Participant

Hi Peter,

Yes, in phone view the TOC slides to the left and off screen when the user makes a selection, but my point is that when users open the TOC for my project on a phone, about 50% of vertical display in the center of the screen is blank because our TOC entries are short. To have a large area of white space in the center of the phone screen looks like a bug to me. I wish I could attach a screenshot but this is proprietary software so I cannot.

A great solution would be an author-adjustible TOC pane width that wraps TOC entries that are wider than the column width allows. Once again, thanks for your help!

A

Amebr

Community Expert

Did you click the ittle phone icon at the top of the skin editor before changing the toc width? That should switch over to displaying the settings configured for phone layouts, rather than the default desktop view. You may want to adjust the tablet view as well, which is the third icon across.

(I haven't tried any of this myself, but in theory it should work. 🙂 )

A

AMBF19634608Author

Participant

Hi, Amebr, and thanks for your quick reply.

After I posted my question above, I did some more testing and realized that I was in desktop view when I was able to drag the width of the TOC pane, and that's why when I previewed in phone view I didn't see the change. But my Aha! moment didn't last long, because when I went back to RH and tried adjusting the column width for phone view, that was not allowed. No resize cursor on the layout preview as available in desktop view and no column width settings on in the right panel.

So I think the answer to my question is No, I can't change the TOC pane width for phone view unless...

Is some sort of RoboHelp Developer Toolkit software that would allow such a customizations?

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