For AI agents: a documentation index is available at https://idratherbewriting.com/llms.txt. Markdown versions of all pages are available by appending .md to any page URL.

Search results

DITA: Add a menu selector

If you have multiple output files and you want to provide users with the ability to easily navigate from one output to another, you can add a menu selector in the header.

The menu selector is a simple menu that allows users to select other options. When a user selects an option, the URL switches to another page. Here's an example of what this looks like:

When the user makes a selection, the URL reloads another site entirely.

To incorporate a menu selector:

  1. Create a new HTML file by going to File > New > New Document > HTML.
  2. Insert a menu selector form with various options.

     <form><span id="progSelector">Programming language:</span>
              <select name="URL" onchange="window.parent.location.href=this.form.URL.options[this.form.URL.selectedIndex].value">
                  <option value="../java/index.html">Java</option>
                  <option value="../dotnet/index.html">.NET</option>
                  <option value="../cpp/index.html">C++</option>
                  <option value="../php/index.html">PHP</option>
            </select>
        </form>

    When a user selects an option, it triggers an onchange script to trigger that changes the browser's location to the URL of the option selected.

    Note that because OxygenXML's webhelp uses frames, you must use the window.parent.location as the target for each of theo ptions selected.

    The user will see the first option as the option that appears selected. Therefore, you need to customize the menu selector for each output.

  3. Create another header file and swap around the order. For the .NET transform, for example, put the .NET option first. Create another header file and swap around the order again. For the C++ transform, put the C++ option first.
  4. Click the Configure transformation scenariosbutton. Edit one of your transformation scenarios. On the Parameters tab, click the webhelp.footer.file option and set it to the right header file for that output.

Sponsored

About Tom Johnson

Tom Johnson

I'm an API technical writer based in the Seattle area. On this blog, I write about topics related to technical writing and communication — such as software documentation, API documentation, AI, information architecture, content strategy, writing processes, agent skills, tech comm careers, and more. Check out my AI courses for more on the latest in AI and tech comm. If you're looking for info about documenting APIs, see my API documentation course.

If you're a technical writer and want to keep on top of the latest trends in tech comm, be sure to subscribe to email updates below. You can also learn more about me or contact me.

Finally, I want to note a couple of things. I usually write the first drafts of my posts myself and then use AI to improve accuracy, clarity, and detail in places, so my writing is a mix of human and AI. (Hopefully that's not too off-putting.) Also, the opinions I express on my blog are my own perspectives, not those of my employer.