Add javascript on pages

[mattludd]

Hi,

I would like to add some rows of javascript on every page in my project. I have tried a large amount of ways with no success. It is necessary that the code can be added without the need to change or add files after the generation of WebHelp has been done, that is, the technical writer should not need to make any hands on work afterwards. To be more precise, it would be perfect if it also was possible to alter the code that generates the frameset, since I would like to add a top frame to the existing set.

Thanks in advance!
Regards Mattias

[Linux Rules]

Hello Mattias -

Welcome!

You said:
"...I would like to add a top frame to the existing set."

That would be done manually to the skin file you use. For example, I use the "XP Blue" skin for one project. The file is in a subdirectory of my project directory :

..\!SkinSubFolder!\XP_Blue\XP_Blue.skn

I first re-name this file to "origXP_Blue.skn" then copy the file and re-name back to "XP_Blue.skn" and then rename the "skn" extension to "xml" - as this is actually an XML file.

Open the XP_Blue.xml file with your favorite editor, add the new frame, define the new frame, save the file then re-name the file extension back to "skn" and you're on your way.

Regards,
GEWB

[mattludd]

Hi again,

Thanks for the tips. However, trying to apply this was not easy since RH uses a number of macros to generate the final code. It was too difficult for me, so I gave up after a while.

I guess I need to be a little bit more precise when explaining what it is I wish to achieve. I have a client that develops a web application that links to the WebHelp. The application runs on a test server before it is tranferred to the production server but the WebHelp runs on a separate server dedicated for WebHelp. When the application runs on the test server, it gets a banner on top of every page saying its a test environment. The client would like to have the same feature for the WebHelp, that is, if the application is undergoing test it should apply for the WebHelp as well.

So, if the test of the application is ok, the WebHelp does not need to be recompiled, meaning it is possible to move the WebHelp from a test directory to a live directory on the separate server and only change the url in the application. Now, here's the trick (and problem): It would be nice to make this move without the need to recompile (to remove the banner, e.g. using conditional text) the WebHelp, that is, WebHelp in test directory = banner visible, WebHelp moved to live directory = banner hidden. I have different ulr's for each directory, so my idea was to distinguish them by sniffing the url with a javascript and then hide/display the banner.

I have actually succeded in creating such a javascript that do all of these things, and it works perfect on my test pages:
- check if the url is app-test.company.com or app.company.com.
-- if app-test, do the following:
--- if a stand-alone page, do the following:
----- display the banner on top of the page (using css and js).
--- if page in frameset, do the following:
----- hide banner on page and instead display banner in a top frame (separate file) on top of the complete WebHelp.
-- if app, do the following:
--- display pages as normal without banner.

The problem is that I cannot add this code to RH and keep it when generating the WebHelp. A way could be to find some resource file(s) that RH uses during compining, and in that file(s) add my code (e.g. for the skin thing that potentially solves the frame problem, the source seem to be the skn-file). I may get the client to accept that the banner is displayed only on stand-alone pages (since context-sensitive help is used more often than opening the entire WebHelp frameset) leaving the frame stuff behind, but I haven't succedeed in finding the proper source file for the single page solution.

The reason I want to access the source file is that it makes it possible to add this feature without the need for the client to do any hands-on work afterwards, just keep on compiling, even recompiling existing WebHelp without the need to add or alter anything. This would be the ultimate thing to achieve.

Perhaps there is a better and more simplier solution to all of my problems? :)

Regards, Mattias

[MergeThis]

You're aware, are you not, that you can create multiple WebHelp layouts, which can each have their specific conditional statements and which can then be generated in batch?

1. Right click Single Source Layouts and select New Layout.
2. Ensure that WebHelp is the Output Type, and name the new layout (wh_develop, wh_prod, etc.).
3. Configure the Properties for your new layout.
4. Right click Single Source Layouts, select Batch Generate, and select the layouts to generate.

(Each layout can be generated and published to separate directories, of course.)


Good luck,
Leon

[Linux Rules]

Hello Mattias -

I like Leon's solution but there is another work-around.

How about inserting a graphic at the top of each page such as "XYZ Test Environment" and "XYZ Production Environment" and give each file the SAME name (stored separatly on a local drive). Upload the correct file to the corresponding server.

When Help runs it calls the graphic file from the server...like I said, it is a work-around if Leon's solution isn't what you want.

Regards,
GEWB

[Roger_N]

Mattias -

If you've already created your script to test if the url is app-test.company.com or app.company.com, you can then add that script to each page you need after each re-generation, with ReplaceEm. Once you define what to insert, and what files to insert them in, you can repeat the insertion with just a click or two. I use it a lot when customizing Webhelp beyond the skins.

[mattludd]

Hi again, and thanks all for your input!

MergeThis...
Well, one great thing with my script is that the client do not need to keep more than one instance of the WebHelp, the script takes care of the rest. But it is a good point...

Linux Rules...
The problem is that the client don't want an image on the WebHelp that is live in production. The idea, however, is great and would probably work if I choose to add the image as a background image and only upload it to the test directory and not the production directory. In this way it will only be visible in the test environment and not in production, since it is missing there. A reference to a background image instead of a img-tag will probably also avoid a missing file-icon in the web browser. However, the script I made uses css to render the banner and avoids yet another image to download, which is nice.

Roger N...
My intention is to avoid post-work after compiling. The solution will probably work excellent, but the aim must be to avoid post-work.

I have decided to go with the following solution (since my time was rather limited, I had to decide quickly): For existing projects I will add my script in the footer in the Standard.htt topic template by using Insert > Advanced > Script. Putting it in the footer allows me to quickly re-apply the template to all existing topics, which is not possible if I locate the script in the body. Since it now reside in the topic template for the existing project, it will be embedded when creating new topics, if needed. For totally new projects I will add the script to the Standard.htt topic template in our master WebHelp project template.

The client accepted the solution to only display the banner on top of every individual topic, so I can leave the idea of adding the banner on top of the WebHelp when in full mode. Pitty, since my original tests (before I even started RH) was very fancy. :)

However, I do still have a question that has not been answered yet: Is it really no way to permanently add code (e.g. to the html header in a topic) that can always be embedded when compiling the WebHelp? Do RH always generate all files (even standard js resource files) on the fly when compiling? Or which resource files are used by RH and where can they be found (e.g. in C:\Program Files\...\RoboHelp 6.0\...)?

Regards, Mattias