Help+Manual 7 has an option to apply code-style inline text formatting. The default formatting can be applied via a button in the Write tab:
If I apply this code-style formatting to the word 'Finish' in the editor, the corresponding XML code is:
<text styleclass="Code Example" style="font-weight:normal; font-style:normal; text-decoration:none; color:#000000;" translate="true">Finish</text>
In default.css there is a declaration that seems to correspond to this code-style formatting:
span.f_CodeExample /* Code Example */
{
font-size: 11px;
font-family: 'Courier New',Courier,monospace;
}
If I place a copy of this CSS in the Baggage Files, I can (as an extreme example!) modify the declaration to make the background blue and the characters red:
span.f_CodeExample /* Code Example */
{
color: red;
font-size: 1em;
font-family: 'DINOT-Bold',DINOT,Calibri,sans-serif;
background-color: blue;
}
However, in the published webhelp document, the background is blue but the characters are not red.
Could anyone help me understand why this is the case, and what the structured solution is?
xxx
I wish to utilise this function to indicate text appearing in the menus of the software that I am documenting. In keeping with the software interface, such text would have a grey background and white characters.Modifying CSS to customise code-style text
Moderators: Alexander Halser, Tim Green
-
- Posts: 11
- Joined: Thu Mar 24, 2022 2:40 pm
Modifying CSS to customise code-style text
You do not have the required permissions to view the files attached to this post.
- Tim Green
- Site Admin
- Posts: 23186
- Joined: Mon Jun 24, 2002 9:11 am
- Location: Bruehl, Germany
- Contact:
Re: Modifying CSS to customise code-style text
Hi Tom,
Don't try to repurpose the code syntax formatting tool for this. You will run into all kinds of strange problems, and you will also not be able to reformat the text formatted that way by changing the style definition. The syntax formatter is not designed for formatting single words within other text, only for entire passages of computer code in specific languages. Instead, define a dedicated text style with the attributes you need. See here (text styles) for instructions:
https://helpandmanual.com/help/hm_worki ... efine.html
The rest of the chapter on styles is also strongly recommended, as Help+Manual styles are different from regular word processing styles in some ways.
PS: It's also a mistake to try to achieve CSS from within the project editor. You need to define universal styles that will also work in non-HTML formats (PDF and Word).
Don't try to repurpose the code syntax formatting tool for this. You will run into all kinds of strange problems, and you will also not be able to reformat the text formatted that way by changing the style definition. The syntax formatter is not designed for formatting single words within other text, only for entire passages of computer code in specific languages. Instead, define a dedicated text style with the attributes you need. See here (text styles) for instructions:
https://helpandmanual.com/help/hm_worki ... efine.html
The rest of the chapter on styles is also strongly recommended, as Help+Manual styles are different from regular word processing styles in some ways.
PS: It's also a mistake to try to achieve CSS from within the project editor. You need to define universal styles that will also work in non-HTML formats (PDF and Word).
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.
Tim (EC Software Documentation & User Support)
Private support:
Please do not email or PM me with private support requests -- post to the forum directly.
-
- Posts: 11
- Joined: Thu Mar 24, 2022 2:40 pm
Re: Modifying CSS to customise code-style text
Thank you for your help.
I now understand that there is an official way to create character styles.
As for CSS modifications, surely this will nonetheless prove necessary for adjusting the appearance of webhelp templates?
I now understand that there is an official way to create character styles.
As for CSS modifications, surely this will nonetheless prove necessary for adjusting the appearance of webhelp templates?
- Tim Green
- Site Admin
- Posts: 23186
- Joined: Mon Jun 24, 2002 9:11 am
- Location: Bruehl, Germany
- Contact:
Re: Modifying CSS to customise code-style text
Absolutely, but we keep content and layout separate. The content is formatted in the project editor and the formatting you apply there is exported as CSS that is used in the HTML. The skin contains the templates and the CSS for the templates, and you can edit that in the skin.Technical Tom wrote: ↑Mon Mar 28, 2022 4:18 pm As for CSS modifications, surely this will nonetheless prove necessary for adjusting the appearance of webhelp templates?
The .hmskin file of the skin is actually a special kind of Help+Manual project without topics. It only contains the HTML templates, the necessary settings and additional JavaScript and CSS files stored in the baggage section. You can edit .hmskin files just like Help+Manual projects, and you will find everything there.
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.
Tim (EC Software Documentation & User Support)
Private support:
Please do not email or PM me with private support requests -- post to the forum directly.