TopNavigation Frameless: Close Help Function

Report · Jul 20, 2021

Running RoboHelp 2020.5

I need to update an existing help system (built with RH 2015, possibly older and skin is no longer supported in RH 2020) that's delivered with a web-based application. The help is opened from the web-based application by end-users. However, since the web browser is configured to hide its tabs/menu/etc. for both the web app and the help, users can't (by default) close the help and return to the app. To address this, the legacy help system was built with a custom, integrated "close help" function. Here's the actual code we used (note that it still works):

<a href="javascript&colon;window.open('','_self').close();">
<img src="../../images/exit.png" alt="" style="border:none; margin-left:0px; margin-bottom:0px; margin-top:15px; margin-right:45px; width:100%; max-width:32px" align="right" border="0">
</a>

For the help update, I've selected the TopNavigation skin for frameless output. I'd like to add the "close help" function to the same row as the print, expand/collapse all, and remove highlight functions. I already have an icon for it:

The problem is that I can't figure out what/how/where to define/configure the function. I've tried a variety of things in the OnClick field, but none of them work. For example:

Thoughts?

Report · Jul 21, 2021

I think Robohelp support would be your best bet. I tried your code in Responsive and it worked, but it doesn't seem to in Frameless.

Contact support using the email address on this page:https://helpx.adobe.com/contact/enterprise-support.other.html#robohelp

Report · Jul 22, 2021

Thank you for looking at this. I really want to switch the project's output to the TopNavigation output so I emailed Adobe Support. Hopefully they can offer up a solution. I'll update this post if/when I learn anything.

Report · Jul 29, 2021

Identified a solution. It needs refined - prettied up - but it works.

I inserted the following code in the data-region header section of my masterpage:

</head>
<body>
  <div data-region="header"><br />
    <button onclick="goBack()">Go Back</button>
    <script>
      //<![CDATA[
      function goBack() {
        window.history.back();
      }
      //]]>
    </script><button onclick="goForward()">Go Forward</button>
    <script>
      //<![CDATA[
      function goForward() {
        window.history.forward();
      }
      //]]>
    </script><button onclick="exitHelp()">Exit Help</button>
    <script>
      //<![CDATA[
      function exitHelp() {
        window.open('', '_self').close();
      }
      //]]>
    </script>
  </div>
  <div data-region="topic">

This inserts the following buttons to each topic:

Each button/function works, as expected/desired. Note: Exit Help only closes the browser tab in which the help is displayed. Any other browser tabs remain open. This is the desired behavior for this particular use-case. I want to replace the buttons with icons that reflect the rest of the help and its corresponding app's UX (and remove the non-functioning X from the print, highlight, expand/collapse row), but the heavy lifting (for my non-programmer skills at least) is done. Thanks to everyone for the feedback and insight that allowed me to arrive at a solution!

Adobe Community

TopNavigation Frameless: Close Help Function