Page 1 of 1

How to use a customized webhelp header

Posted: Tue Mar 06, 2018 9:56 am
by catherine
Hi, I want to customize the webhlep header and menus, submenus.
I wish to have the same web header with our website.
I have created a header css that is in the smae style with our website, and tested it with the oxygen webhelp index.html, it worked.
But, for the topic pages, the header didn't change.

Now, my problem is, how to use my css file as a template or global web header for my webhelp.

or, anyway to change the global web header?

Re: How to use a customized webhelp header

Posted: Tue Mar 06, 2018 1:24 pm
by cosmin_andrei
Hi Catherine,

Thank you for contacting us.

To investigate what happens, we need some more details regarding this:

- What version of Oxygen are you using?
- How do you initiate the transformation: from Oxygen (via a transformation scenario) or from the command line?

Re: How to use a customized webhelp header

Posted: Wed Mar 07, 2018 8:51 am
by catherine
Hi, cosmin,
Thanks for your reply. I'm using Oxygen v18.
What I did was just editing the index.html file directly. I didn't change the transformation values and generate from Oxygen.
That is my question, how to change a webhelp header gobally using Oxygen.
I want to change the whole header, including the css styles the naviagtions, the logo and generate a webhelp using my customized html file and css file. Is it possible to achieve it?

By the way, I followed the instructions in following discussion, but didn't work for me: post40351.html?hilit=customize%20header#p40351

1. I create a html file like the following:

Code: Select all

<div class="links">
<div class="pdf-link">
<a href="${oxygen-webhelp-output-dir}/pdf/flowers.pdf">
<img src="${oxygen-webhelp-output-dir}/pdf/pdf-icon.png"/>
</a>
</div>
<div class="chm-link">
<a href="${oxygen-webhelp-output-dir}/chm/flowers.chm">
<img src="${oxygen-webhelp-output-dir}/chm/chm-icon.png"/>
</a>
</div>
</div>
2. I set the webhelp transformation value webhelp.fragment.after.top_menu to the customized html file. But the icon/image dispaly after the the header logo, NOT after top menu.
3. I also tested with the value webhelp.fragment.after.logo_and_title, and webhelp.fragment.before.logo_and_title, it also didn't as expected. The icon/image doesn't display on the desired location.