Robohelp 2017 - New Responsive HTML5 Output Issues

[christinaa29838475]

Hi,

In Robohelp 2017, when I edit any aspect of the layout.css file for a custom screen layout based on Indigo, the preview for a Topic view no longer displays the body content correctly, shifting topic content and the sidebar to the left and reducing the overall height of the both body components to perhaps 100 px (as in, I am no longer able to access the sidebar navigation menu and topic content features both a horizontal and vertical scroll bar). However, I am able to edit the theme-1.css without any Topic preview issues. I'll note that I have not modified the height specifications in the layout.css; instead, I attempted to mod a font size for the title-text from 1.4em to 1.6em. In addition, it doesn't seem to matter what edits I make. For example, if I want to specify a border radius or border, the same issue occurs.

As such, I'm hoping someone can advise whether the preview issue is a bug with the preview, a bug with editing the layout.css, or a issue with my system (I'm using Windows Server 2008 r2 on a desktop, IE 11, and the latest version of Chrome)?

In addition, it's not entirely clear how to configure the Homepage header and paragraph text. Am I supposed to do use the Homepage (Default) screen layout? If so, adding the Welcome header doesn't work consistently. If not, how do I access the index.htm in the Project Manager pod?

Best,

Christina

[Willam van Weelden]

Hi Christina,

Without seeing the output/project, that's hard to say. Could you share a (sample) output with me? You can contact met at contact [at] wvanweelden [dot] eu.

[WerdNerd]

Hi William,

I'm experiencing the same issue with the topic content and sidebar shifting to the left and the height becoming reduced. I created a layout based on Indigo, customized the colors of the header and functions buttons, disabled the index, and added custom URLs in the settings - no problem so far. Then I opened Topic.slp in RoboHelp to change the background color of search results as shown by the bold text below:

<?rh-msp-search-highlight-control id="highlightsearch" widgettype="highlightsearch" type="checkbox" checked class="wSearchHighlight" id="highlightsearch" textcolorval="#000000" bgcolorval="#CC99FF" aria-labelledby="highlightsearchlabel" ?>

That is the only change I made in Topic.slp. When I generate the project, the topic page is messed up as shown in the screenshot. Regardless of the browser I use to view it, the issue occurs.

The only workaround I've found is to delete my layout, create a new one, change the search background color in Topic.slp first, and then customize the layout in the settings. Although this prevents the issue, it means that I can't make any changes in Topic.slp again without having to delete, create, and customize my entire layout all over again. Can this problem be fixed?

- Drew

[Willam van Weelden]

Did you open using the RoboHelp editor? The RoboHelp editor doesn't understand the HTML in layout and will rewrite it if you just open it. Please get the original Topic.slp file (By adding the layout again) and copy it to your modified layout. Then open the Topic.slp with Notepad outside of RoboHelp to make the change. That should fix your problem.

[WerdNerd]

Yes, I had opened it in RoboHelp editor. Modifying the slp file with Notepad did fix the problem. I was able to change the highlight color without any unwanted changes in the topic layout. Thanks again, Willam!