Page 1 of 1
Output Query
Posted: Fri Dec 27, 2024 2:49 pm
by Stacey
Hi There:
UX is looking to update our webhelp output, and I'm wondering if this is possible/how it might be done.
They want to keep the "same" tasks on the same page (currently written as different topics), and then have toggle options for those tasks for Mobile and Desktop versions, as applicable. I'm assuming it might be a CSS and topic-tagging exercise?
ExampleLayout.png
Re: Output Query
Posted: Mon Dec 30, 2024 12:19 pm
by julien_lacour
Hello,
You can use tabbed display to toggle between Mobile and Desktop versions. For this you just need to use either a list, a definition list or a choicetable in your DITA source in combination with the @outputclass="wh-tabbed" attribute.
For more details you can check
our user guide.
Regards,
Julien
Re: Output Query
Posted: Fri Jan 03, 2025 12:27 am
by Stacey
Hi Julien:
I looked at the user guide, but I'm not sure how you would write instructions using those specific elements (lists, definition lists, choice tables)? Showing a tab with the words "Instructions for Mac" is only useful if I can also see the instructions there? Do I need to create a choicetable for each step? Or would there be another way of displaying/linking things to show an entire topic there?
Re: Output Query
Posted: Fri Jan 03, 2025 10:57 am
by julien_lacour
Hello,
As an example you can use a list to display the tabs, and a child list to display all the steps for mobile and for desktop:
Code: Select all
<ul outputclass="wh-tabbed">
<li><ph>Mobile</ph><ol>
<li>Select menu, then Calendar.</li>
<li>Select task's date.</li>
<li>Select the event card for more information about the task.</li>
</ol></li>
<li>
<ph>Desktop</ph><ol>
<li>Select ...</li>
<li>Select ...</li>
<li>Select ...</li>
</ol></li>
</ul>
Regards,
Julien