Two different styles of drop-down hotspots?

[NealonUX]

Robohelp 2015. Can I make two different styles of drop-down hotspots available? For example, could I have regular drop-down hotspots italic but a special class of drop-down hotspots roman--without resorting to inline styling?

Hoping for a solution within RoboHelp, but I'm open to ideas for CSS.

[Peter Grainge]

Copy the dropspot style and then customise. Repeat dose as required.

[NealonUX]

Thanks, Peter! I created the copy of the drop-down hotspot style. To use it, must I first insert the drop-down hotspot, and then go to the HTML view to change the class from [class="droptext"] to my new class? I've done that, and it works, but it would be even more amazing if I can get this second style to appear as a separate button on the insert menu.

[Peter Grainge]

In the Style and Formatting pod, right click the Dropdown style and select Duplicate.

Once your styles are set up as required, create a dropdown, select it and then apply the appropriate style. While Paul's answer is correct, this way is easier. No need to go near the HTML.

---

See www.grainge.org for RoboHelp and Authoring information

@petergrainge

[prhmusic2]

CSS would be the way to go. I have HTML code like this:
|

<p class="Body-Text">

    <?rh-dropspot_start class="dropspot" href="javascript:TextPopup(this)" id="a10" dataid="POPUP10"?>

    <span class="HoverIntro">Click here to view contact information...</span>

    <?rh-dropspot_end ?>

</p>

<?rh-droptext_start class="droptext" id="POPUP10" style="display: none;"?>

<?rh-placeholder type="snippet" ref="Contact Information"?>

<?rh-droptext_end ?>

<?rh-cbt_end ?>

|
and then, in my CSS file, I have this:
|

.HoverIntro {

    font-family: Arial, helvetica, sans-serif;

    color: #0000ff;

}

|
Just create a second style and change the definition to reflect the font you want, such as:
|

.HoverIntroSpecial {

font-family: "Times New Roman", Times, "serif ";

    color: #0000ff;

}

<p class="Body-Text">

    <?rh-dropspot_start class="dropspot" href="javascript:TextPopup(this)" id="a10" dataid="POPUP10"?>

    <span class="HoverIntroSpecial">Click here to view contact information...</span>

    <?rh-dropspot_end ?>

</p>

<?rh-droptext_start class="droptext" id="POPUP10" style="display: none;"?>

<?rh-placeholder type="snippet" ref="Contact Information"?>

<?rh-droptext_end ?>

<?rh-cbt_end ?>
|
Hope that helps!

Paul

[NealonUX]

Thanks, Paul! I'll study this. (I'm a little slow on CSS.) My colleagues would prefer a button in the RH user interface, but this may work for us. And it helps me see that if I get rid of the font styling in the rh-dropspot selector, then I have more options.