Accordion or Tabbed Interactive on Page

[andreamw]

I'm using Robohelp 2017. I have the output of a sample that has an accordion or tabbed interactive on the page. When you touch a bar on the page, it expands and yuo can see additional text. When you touch another one, the previous bar closes and the new one expands. I don't know how else to explain this but I'm trying to figure out how to do this. I don't have the source files. Is this a widget or some feature in Robohelp that I can insert on my pages. I am trying to create a procedure manual and I like this design. Thanks in advance for your help.

[Captiv8r]

Hi there

About the only thing that RoboHelp will offer for that is a Dynamic HTML Drop-down hotspot.

Cheers... Rick

[Peter Grainge]

Picking up on Rick's suggestion, you can use images as the hotspot for a dropdown so I wonder if you could create something that way that is close to what you want?

---

See www.grainge.org for free RoboHelp and Authoring information.

@petergrainge

[andreamw]

Thanks Rick and Peter. I was hoping there was a widget or something that I could include.  I'll try your suggestions and circle back if I need additional help.

Thanks,

Andrea

[Peter Grainge]

... or to show us the beauty of what you have created?

It helps to show others what can be achieved.

---

See www.grainge.org for free RoboHelp and Authoring information.

@petergrainge

[andreamw]

Ok, let me play with it and see what I come up with. I'll post here when I get it done. Thanks again!

[Captiv8r]

Hello again

Okay, I have a thought about how this may be accomplished using RoboHelp and no scripting.

Let's say you want five tabs. So you create an image of the five tabs.

Then you add Image Map hotspots to each tab.

You also will need to create five different HTML topics. One for each tab.

Then you would insert an Inline Frame into the topic with the image of the five tabs and size it accordingly.

Then all you would need to do is to configure each of your Image Map hotspots to point at the Inline Frame and target the desired topic.

Cheers... Rick

[Captiv8r]

I decided to put this to the test.

After making it work, I recorded a video to demonstrate how it was done.

[andreamw]

Bless you!!! This is exactly what I was thinking of. Thanks you SOOO much! 🙂

[sriniketh_1530]

Hi Rick,

I have tried to replicate what you have shown in the video but I facing a challenge.

I'm not getting an option to change the name of the iFrame. Upon double-clicking the iFrame, only two options are displayed (list of files to be linked to the iframe and ID). I have tried adding the a name in the ID field but that doesn't work.

[Peter Grainge]

@sriniketh_1530 This is a seven year old thread and the code for those versions was completely different to the new UI versions.

The templates that come with the modern versions do not offer tabbed viewing. I would say it is impossible to edit them to the degree needed as it would be more than appearance that needs editing.

________________________________________________________

My site www.grainge.org includes many free Authoring and RoboHelp resources that may be of help.

[sriniketh_1530]

Hi Peter,

Thanks for your response. I counldn't find a more recent thread related to my issue. Ad since this thread was exactly what I needed, I decided to try my luck. Going ahead, I think it would be better to create a new thread with reference to the older thread maybe. 

Thanks for your inputs also. 

Regards,

Sriniketh

[Peter Grainge]

Each of the supplied skins has been designed and then linked by Adobe to different backends. Even if you could create a new template that looks as you want, you would not be able to link it. That means you would have to customise an existing template. To do what you want, I would say is impossible.

________________________________________________________

My site www.grainge.org includes many free Authoring and RoboHelp resources that may be of help.