Show/Hide hidden text

Please post all questions and comments regarding Help & Manual 7 here.

Moderators: Alexander Halser, Tim Green

Post Reply
Vanitha R
Posts: 19
Joined: Mon Apr 02, 2018 7:57 am

Show/Hide hidden text

Unread post by Vanitha R »

hi Team

Is it possible to change the font/size of Show/Hide Hidden text at top corner of screen (inserting toggle links).
Please let me know.

Vanitha
User avatar
Tim Green
Site Admin
Posts: 23143
Joined: Mon Jun 24, 2002 9:11 am
Location: Bruehl, Germany
Contact:

Re: Show/Hide hidden text

Unread post by Tim Green »

Hi Vanitha,

Toggle links are normal paragraphs so you can format them in any way you like. Just select the link text and format it normally, either manually or with a style. If you are using toggle links with an icon you just need to take care that the indent matches the original indent, so that the table containing the toggle text has the same indent as the link text above it.

See here in the help for more details (we recommend studying the entire chapter):

https://helpandmanual.com/help/hm_toggles.html
Regards,
Tim (EC Software Documentation & User Support)

Private support:
Please do not email or PM me with private support requests -- post to the forum directly.
Vanitha R
Posts: 19
Joined: Mon Apr 02, 2018 7:57 am

Re: Show/Hide hidden text

Unread post by Vanitha R »

hi Tim,

I am able to format the actual toggle links.
What I wish to format is the SHOW/HIDE HIDDEN TEXT link that appears on top Right corner of the page in dark blue. Because it looks different from the rest of the content. Can that be done?

Vanitha
User avatar
Tim Green
Site Admin
Posts: 23143
Joined: Mon Jun 24, 2002 9:11 am
Location: Bruehl, Germany
Contact:

Re: Show/Hide hidden text

Unread post by Tim Green »

Vanitha R wrote:What I wish to format is the SHOW/HIDE HIDDEN TEXT link that appears on top Right corner of the page in dark blue.
Well that is in the compiled output using a specific skin and you didn't mention any of that information in your question. 8) That is only available in some skins and how you format it depends on the skin, so we need to know which skin you are using as well. However, it is supposed to look different from the rest of the content so that the users notice it. Normally, there is no reason to change its formatting and if you make it look the same as the normal content many users will not find it.
Regards,
Tim (EC Software Documentation & User Support)

Private support:
Please do not email or PM me with private support requests -- post to the forum directly.
Vanitha R
Posts: 19
Joined: Mon Apr 02, 2018 7:57 am

Re: Show/Hide hidden text

Unread post by Vanitha R »

I am using Webhelp, Two Frames Classic Skin Black.hmskin.
There is also a horizontal grey line that appears below it which i would like to remove.
Please refer sample screenshot.
Thanks & Regards
Vanitha
You do not have the required permissions to view the files attached to this post.
User avatar
Tim Green
Site Admin
Posts: 23143
Joined: Mon Jun 24, 2002 9:11 am
Location: Bruehl, Germany
Contact:

Re: Show/Hide hidden text

Unread post by Tim Green »

Hi Vanitha,

If you open the .hmskin file in Help+Manual, go to Configuration > HTML Page Templates > Default. The code for that link looks like this:

Code: Select all

<table id="idnav" class="expander">
  <tr><td><a href="javascript:toggleToggles()" title="Click to open/close expanding sections">Show/Hide Hidden Text</a>
  </td></tr></table>
If you want to format the link you need to add a CSS class to it. For example, let's say you choose "explink" as the class, then add this to the <a tag:

<tr><td><a class="expandlink" href=...

Then you can add CSS code to format the link directly BEFORE the closing </style> tag in this position further up the page:

Code: Select all

 </style>
<!--[if lt IE 7]>
You need to include three definitions, one for the plain link state, one for the visited state with only the color to keep the color the same, and one for the hover state when the mouse is over the link, like this:

Code: Select all

a.expandlink:link {
color: black;
text-decoration: none;
}
a.expandlink:visited {
color: black;
}
a.expandlink:hover {
text-decoration: underline;
}
</style>
<!--[if lt IE 7]>
That just shows some simple formatting. You can add any CSS code you want for each of the states.

The font used in the link is defined together with the grey border line that you want to remove in the custom.css file in the Baggage Files section of the skin. Go to Project Files > Baggage Files and select the custom.css file on the left. The definition that defines the font and the underline is this block of code there:

Code: Select all

.expander {text-align: right; padding: 0; width: 100%; font-family: Verdana, Helvetica, sans-serif; font-size:9px; font-weight: bold; border-bottom: 2px; border-bottom-style: solid; border-bottom-color: grey; margin-bottom: 1px;}
Just delete all the border-bottom attributes and increase the height of the bottom margin to compensate, like this:

Code: Select all

.expander {text-align: right; padding: 0; width: 100%; font-family: Verdana, Helvetica, sans-serif; font-size:9px; font-weight: bold; margin-bottom: 2px;}
Regards,
Tim (EC Software Documentation & User Support)

Private support:
Please do not email or PM me with private support requests -- post to the forum directly.
Vanitha R
Posts: 19
Joined: Mon Apr 02, 2018 7:57 am

Re: Show/Hide hidden text

Unread post by Vanitha R »

hi Tim,
Thanks a lot! :)
I was able to remove the line.

One more clarification.

I had changed font size of all text from ARIAL 11 to ARIAL 12 in help document. When I generate the help locally, i Can see the change. But this is not reflected in production server. What could be the reason?

Thanks & Regards
Vanitha
User avatar
Tim Green
Site Admin
Posts: 23143
Joined: Mon Jun 24, 2002 9:11 am
Location: Bruehl, Germany
Contact:

Re: Show/Hide hidden text

Unread post by Tim Green »

Vanitha R wrote:I had changed font size of all text from ARIAL 11 to ARIAL 12 in help document. When I generate the help locally, i Can see the change. But this is not reflected in production server. What could be the reason?
First make sure that you activate the option to open the WebHelp automatically after publishing so that you can check it locally. If you see the font size there you know that it is being exported correctly. If that is the case the problem will be one of the following things:
  • You didn't upload all the files in your output folder to your web server. Don't use "smart" FTP programs that claim to only upload changed files. They're not smart and they don't work correctly on WebHelp.
  • If you're uploading to the same folder as before, make sure that you clear the browser cache (delete temporary internet files) before testing. Or just hold down CTRL and press F5 to reload the page without the cache to see the latest files.

Also note that the "Classic" skins you are using are not really recommended now. They are legacy skins designed for targeting users on old, obsolete computers that still use very old versions of Internet Explorer. It would be better to use one of the skins with the word "responsive" in its name.
Regards,
Tim (EC Software Documentation & User Support)

Private support:
Please do not email or PM me with private support requests -- post to the forum directly.
Post Reply