22.2 Customizing the Application Browser View

You can use the myapps.html, axnalview.js, refresh.html, and hf_style.css files to customize the functionality and look of the Application Browser view. The following table lists what each file controls:

Table 22-1 Application Browser Files

File

Controls...

myapps.html axnalview.js

  • Which ZENworks® Middle Tier Server is accessed

  • Whether the view is Web portal enabled or not

  • The banner graphic

  • The banner height

  • Whether or not the view includes the folder tree

  • How the application icons are displayed

  • The navigation elements that are displayed

refresh.html

  • The message displayed in the Application Browser view while Application Launcher starts and retrieves application information

hf_style.css

  • All styles that are applied to the view's HTML elements (heading, text, etc.)

The following sections provide information to help you use the files to customize the Application Browser view:

22.2.1 File Location

The myapps.html, axnalview.js, refresh.html, and hf_style.css files reside, or can reside, in two locations, as shown in the following table:

Table 22-2 Application Browser File Locations

File

Location

myapps.html axnalview.js

  • web_server_root\nwdocs directory on the ZENworks Middle Tier Server

  • c:\program files\novell\zenworks\nls\language directory on the local workstation

refresh.html

This file does not exist until you create it. You must then place it in one of the following directories:

  • web_server_root\nwdocs\nal_html directory on the ZENworks Middle Tier Server

  • c:\program files\novell\zenworks\nal_html directory on the local workstation

hf_style.css

This file does not exist until you create it. You must then place it in one of the following directories:

  • web_server_root\nwdocs\nal_html directory on the ZENworks Middle Tier Server

  • c:\program files\novell\zenworks\nal_html directory on the local workstation

Myapps.html and Axnalview.js Files

The myapps.html and axnalview.js files contain the parameter settings that determine the appearance and functionality of the Application Browser view. They are installed with either of the following components:

If you modify the myapps.html file and axnalview.js file on the Middle Tier Server, users who access the Application Browser from the server have the modified files downloaded to the c:\program files\novell\zenworks\nls\language directory on their workstations. This ensures that the same Application Browser settings are used regardless of whether a user accesses the Application Browser from the Middle Tier Server or the local drive.

If you have users who only launch the Application Browser by accessing the myapps.html file on the workstation, you need to modify the myapps.html file and axnalview.js file on their workstations. You might want to modify single copies of the files and then use an Application object to push them to each user's workstation.

Refresh.html and Hf_style.css Files

The refresh.html and hf_style.css files do not exist until you create them. After you create them and place them in the appropriate directory, they are used in place of the Application Browser's internal settings.

If you add the refresh.html and hf_style.css files to the ZENworks Middle Tier Server, when a user accesses the myapps.html file on the server, the files are downloaded to the user's workstation to maintain consistency.

If users are not accessing the myapps.html file from a ZENworks Middle Tier Server, you need to add the files to each user's workstation. You might want to distribute them through Application Launcher at the same time you distribute the myapps.html.

22.2.2 Modifying the Myapps.html and Axnalview.js Files

Both the myapps.html file and axnalview.js files include the same nine parameters, shown below.

<!--param name=\"SingleTree\" value=\"ZENWORKS_TREE\"-->
<!--param name=\"PortalView\" value=\"false\"-->
<!--param name=\"BannerURL\" value=\"http://www.company.com/banner.html\"-->
<!--param name=\"BannerHeight\" value=\"80\"-->
<!--param name=\"ShowTree\" value=\"true\"-->
<!--param name=\"ShowTasks\" value=\"false\"-->
<!--param name=\"AppDisplayType\" value=\"0\"-->
<!--param name=\"ShowAppFrameNavigation\" value=\"true\"-->
<!--param name=\"ShowIEToolbarButton\" value=\"true\"-->

Even though the files contain the same parameters, you need to modify both files. This ensures that Internet Explorer can successfully launch the Application Browser with the correct settings, regardless of its Local Machine Lockdown and Active Content Blocking security settings.

If you install the Application Browser from a Middle Tier Server (see Installing the Novell Application Launcher Plug-In in the Novell ZENworks 7 Desktop Management Installation Guide.) rather than through the ZENworks Desktop Management Agent installation, you can customize two additional myapps.html parameters that are used by the installation manager:

<!--param name=\"MiddleTierAddress\" value=\"$$IPADDR$$\"-->
<!--param name=\"Nt4PluginVersion\" value=\"4,0,1,0\"-->

By default, the parameters are commented out, which results in the Application Browser using its preset internal values.

To modify a parameter:

  1. Open the myapps.html file and axnalview.js files in an editor.

    For information about the location of these files, see File Location.

  2. Remove the !-- (beginning comment) and the -- (ending comment) to activate the parameter. For example:

    <param name=\"SingleTree\" value=\"novell_tree\"

  3. Modify the parameter's VALUE. Each parameter is described below.

    SingleTree: This parameter lets you specify a single Novell eDirectory™ tree from which to read application information. If this parameter is used, Application Launcher ignores any other trees to which the user authenticates.

    This parameter applies only at installation time. After installation, changes to this parameter have no affect.

    PortalView: This parameter lets you better support portals by removing the banner section of the Application Browser view. The VALUE settings are True or False. True removes the banner section.

    BannerURL: This parameter applies only if the PortalView parameter is set to False.

    You can use this parameter to specify an alternate banner. For example, you could use a banner that contains your company's logo instead of the Novell logo. The VALUE setting must be a URL to an HTML page or graphics file (GIF, JPEG, etc.). If you specify an HTML page, the page is cropped to the height specified by the BannerHeight parameter. If you specify a graphics file, the banner section scrolls to fit the entire graphics file. Unless you want the banner section to be scrollable, you should ensure that the graphic's height is not greater than the height specified in the BannerHeight parameter.

    BannerHeight: This parameter applies only if PortalView parameter is set to False and the default Novell banner is being overridden by the BannerView parameter.

    You can use this parameter to determine the height of the banner section. The VALUE setting must be from 5 to 200. Any number less than 5 is rounded up to 5. Any number greater than 200 is rounded down to 200.

    ShowTree: This parameter determines whether or not the Application Browser view includes the left pane (referred to as the folder view). The VALUE settings are True and False. True causes the folder view to display, and False causes it to be removed.

    ShowTasks: This parameter determines whether or not the folder view (left pane) includes the Work online/work offline, MiddleTier log in/Middle Tier log out, Refresh applications, and Help options. The VALUE settings are True and False. True causes the options to display, and False causes them to be removed.

    AppDisplayType: This parameter determines how the applications are displayed in the right pane of the Application Browser view. The VALUE settings are 0 and 1. The default setting, 0, causes the application icons to display as large icons, similar to the Large Icons view in Windows Explorer. The 1 setting causes the applications to be listed in table format, similar to the List view in Windows Explorer.

    ShowAppFrameNavigation: This parameter determines whether or not the right pane of the Application Browser view includes navigation. The VALUE settings are True and False. True causes the right pane to include navigation. The type of navigation depends on the setting for the AppDisplayType parameter:

    • When the AppDisplayType parameter is set to 0 (large icons), navigation is displayed as a breadcrumb trail (for example, ZENworks Tree > Application Folder > Application A).

    • When the AppDisplayType parameter is set to 1 (small icons), navigation is displayed as an Up arrow at the top of the applications list.

    Setting this parameter's value to False causes the Application Browser view to start with the All folder open, meaning that all application icons are displayed in the right pane. If the All folder is disabled in the user's Launcher Configuration settings in ConsoleOne, this parameter is ignored (in other words, the default value of True is used).

    ShowIEToolbarButton: This parameter determines whether or not the Application Browser button is added to the Internet Explorer toolbar. The Application Browser button launches the local version of the myapps.html file. The VALUE settings are True and False. The True setting is the default setting and causes the Application Browser button to be added to the toolbar. The False setting causes the Application Browser button to be removed from the toolbar. Whenever this setting is changed, the user must close Internet Explorer and then reopen it for the change to take affect.

    MiddleTierAddress: This parameter applies only if you've configured a ZENworks Middle Tier Server for access to eDirectory.

    The MiddleTierAddress parameter lets you specify the IP address of the Middle Tier Server that the user authenticates to. It is used only if a Middle Tier Server address is not included in the Windows registry; the registry includes the address if the user entered it when running the ZENworks Desktop Management Agent installation program.

    Nt4PluginVersion: The ZENworks 7 NAL plug-in is not supported on Windows NT 4 workstations (see Interoperability with Windows NT 4 Workstations in Interoperability with ZENworks for Desktops 4.x in the Novell ZENworks 7 Desktop Management Installation Guide for more information about Windows NT 4 support). You can, however, continue to use the ZfD 4.0.1 NAL plug-in on those workstations. This parameter specifies the minimum version of the ZfD 4.0.1 NAL plug-in that runs on Windows NT workstations.

    For example, the default parameter setting (4,0,1,0) requires only that the original ZENworks for Desktops 4.0.1 NAL plug-in be installed on the workstation. If you place an updated ZENworks for Desktops 4.0.1 NAL plug-in (zfd40.cab) with a version number higher than 4,0,1,0 (for example, 4,0,1,1 or 4,0,1,2) on the Middle Tier Server, workstations that have the 4.0.1.0 NAL plug-in are upgraded to the new version only if you change this parameter to the new version. In other words, upgrades do not happen automatically when you place a newer NAL plug-in version on the Middle Tier Server; if you want workstations upgraded, you must force the upgrade by bumping up the version number specified in this parameter.

  4. Save the file.

22.2.3 Creating a Refresh.html File

When Application Launcher first starts, it reads eDirectory and the local cache for information about the applications it needs to display. If Application Launcher is started by opening the Application Browser view, the following message is displayed in the view while Application Launcher retrieves its application information:

Figure 22-1 Application Progress Message

You can replace this message by creating a refresh.html file that contains the message and graphics you want displayed during startup.

  1. Create the file you want to use. Be aware of the following guidelines:

    • The file can contain text, graphics, and other standard HTML elements.

    • Make sure referenced files are available. If the refresh.html file is being accessed from a workstation rather than the ZENworks Middle Tier Server, use an absolute URL rather than a relative URL. For example, when referencing an image, use <IMG SRC="http://www.novell.com/graphics/banner.jpg"> rather than <IMG SRC="banner.jpg">. Any files referenced from the refresh.html file, regardless of the location, are downloaded to user's workstations along with the refresh.html file. In addition, the references are modified to point to the files on the workstation. Only referenced files one level deep are downloaded. For example, if refresh.html references message.html, which references banner.jpg, message.html is downloaded but not banner.jpg.

  2. Name the file refresh.html.

  3. Create a nal_html directory in one of the following two locations:

    • Under the web_server_root\nwdocs directory on the ZENworks Middle Tier Server (for example, apache\nwdocs\nal_html). The nal_html directory and its contents are copied to each user's workstation the same way the myapps.html file is copied. For information, see File Location.

    • Under the c:\program files\novell\zenworks directory on each user's workstation, if users won't access the myapps.html page from the Middle Tier Server.

  4. Copy the refresh.html file to the nal_html directory.

22.2.4 Creating an Hf_style.css File

The Application Browser uses an internal default cascading style sheet (.css) to determine the look of elements such as headings and paragraph text. You can replace the default style sheet by creating an hf_style.css file that contains the style definitions you want used.

  1. Create the cascading style sheet. You can use the default Application Browser cascading style sheet, shown below, as an example or template.

  2. Name the file hf_style.css.

  3. Create a nal_html directory in one of the following two locations:

    • Under the web_server_root\nwdocs directory on the ZENworks Middle Tier Server (for example, apache\nwdocs\nal_html). The \nal_html directory, and its contents, is copied to each user's workstation the same way the myapps.html file is copied. For information, see File Location.

    • Under the c:\program files\novell\zenworks directory on each user's workstation, if users won't access the myapps.html page from the ZENworks Middle Tier Server.

  4. Copy the hf_style.css file to the \nal_html directory.

Default Application Browser Cascading Style Sheet

a  { color: #039; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular; text-decoration: underline }
body  { font family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular }
p, option, li, ol, ul  { color: black; font-size: 0.9em; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular }
th  { font-family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular }
.datalink  { color: #039; text-decoration:underline; margin-top: 2px }
.errorlink  { color: #c82727; text-decoration: underline; margin-top: 2px }
.errorhead  { color: #c82727; font-style: normal; font-weight: 800; font-size: 1.2em; line-height: 1.5em; margin-bottom: 1.5em }
.formcolumnhead1   { color: #556c79; font-weight: bold; font-size: 0.7em; text-align: center }
.formhead1  { color: white; font-weight: bold; font-size: 1em; line-height: 1.2em; background-color: #6b8899; text-align: left; text-indent: 0.5em; letter-spacing: 0.1em; vertical-align: middle }
.formhead1b  { color: white; font-weight: bold; font-size: 1em; line-height: 1.2em; background-color: #6b8899; text-align: left; text-indent: 0.5em; letter-spacing: 0.1em; vertical-align: middle }
.formhead2  { color: black; font-weight: bold; font-size: 1em; line-height: 1.2em; text-align: left; vertical-align: middle }
.formdescriptext   { color: #355263; font-size: 0.8em; margin-left: 1em }
.head1   { color: black; font-weight: bold; font-size: 1.3em; line-height: 1.3em; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular; margin-bottom: 0.6em }
.head1a   { color: #663; font-weight: bold; font-size: 1.3em; line-height: 1.3em; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular; margin-bottom: 0.6em; margin-left: 1em }
.head1b   { color: black; font-weight: bold; font-size: 1.3em; line-height: 1.3em; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular }
.head1w   { color: white; font-weight: bold; font-size: 1.3em; line-height: 1.3em; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular }
.head2   { color: black; font-weight: bold; font-size: 1.2em;
 font-family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss,
 SunSans-Regular; margin-top: 0.4em }
.head2a   { color: #663; font-weight: bold; font-size: 1.2em; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular; margin-top: 0.4em }
.head2b  { color: black; font-weight: 600; font-size: 1.2em; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular; letter-spacing: 0.1em; margin-top: 0.4em; margin-bottom: 0.3em; border-bottom: 2px solid #6c8899 }
.head2tm6   { color: black; font-weight: bold; font-size: 1.2em; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular; margin-top: 0.6em }
.head2w  { color: #fff; font-weight: bold; font-size: 1.2em; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular }
.head2indent  { color: black; font-weight: bold; font-size: 1.2em; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular; margin-top: 0.4em; margin-left: 0.5em }
.head3  { color: black; font-weight: bold; font-size: 1em; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular; margin-top: 0.3em }
.head3a  { color: #663; font-weight: bold; font-size: 1em; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular; margin-top: 0.3em }
.head3b  { color: black; font-weight: bold; font-size: 1em; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular; }
.head3center  { color: black; font-weight: bold; font-size: 1em; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular; text-align: center }
.head3indent   { color: black; font-weight: bold; font-size: 1em; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular; margin-top: 0.3em; margin-left: 1em }
.head3tm6   { color: black; font-weight: bold; font-size: 1em; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular; margin-top: 0.6em }
.head3w  { color: #fff; font-weight: bold; font-size: 1em; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular }
.head4   { color: black; font-weight: bold; font-size: 0.85em; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular; margin-top: 0.2em }
.head4b   { color: #663; font-weight: bold; font-size: 0.85em; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular; margin-top: 0.2em }
.head4tm6   { color: black; font-weight: bold; font-size: 0.85em; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular; margin-top: 0.6em }
.head5   { color: black; font-weight: 600; font-size: 0.75em; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular; margin-top: 0.2em }
.head5b   { color: #663; font-weight: 600; font-size: 0.75em; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular; margin-top: 0.2em }
.head5tm6   { color: black; font-weight: 600; font-size: 0.75em; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular; margin-top: 0.6em; margin-left: 2em }
.hint1  { color: #663; font-size: 12px; line-height: 14px; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular }
.hint1centered   { color: #663; font-size: 12px; line-height: 14px; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular; text-align: center }
.hint1right   { color: #663; font-size: 12px; line-height: 14px; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular; text-align: right }
.inactive  { color: #738c9c }
.indent1   { margin-top: 0.3em; margin-left: 1em }
.indent1b  { line-height: 18pt; margin-top: 0.5em; margin-left: 1em }
.indent1c  { margin-top: 0.8em; margin-left: 1em }
.iconindent1  { margin-left: 18px }
.iconindent2  { margin-left: 34px }
.indent2  { margin-top: 0.3em; margin-left: 2em }
.indent3  { margin-top: 0.3em; margin-left: 3em }
.indentall     { margin-left: 0.5em }
.listhead1  { color: black; font-style: normal; font-weight: 800; font-size: 12pt; text-indent: .3em; }
.mainnavlink  { font-weight: bold; font-size: 15pt; line-height: 18pt; }
.margintop1  { margin-top: 0.3em }
.margintop2  { margin-top: 0.5em }
.margintop3  { margin-top: 1em }
.marginleft1  { margin-left: 1em }
.marginleft1b { font-size: 0.85em; margin-left: 1em }
.marginleft2  { margin-left: 2em }
.marginleft3  { margin-left: 3em }
.marginleft4  { margin-left: 4em }
.navlink  { color: #030; font-weight: normal; text-decoration: underline }
.nonproportional  { color: black; font-size: 12pt; font-family: "Courier New", Courier, Monaco }
.rowaltcolor  { color: #efeee9 }
.serverhead1  { color: #c82727; font-weight: 800; font-size: 1.3em; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular }
.smalltext   { font-size: 0.7em; line-height: 1em; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular }
.mediumtext { font-size: 0.85em; line-height: 1em; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular }
.smalltext2c   { color: #355263; font-size: 0.7em; line-height: 1.1em; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular; width: 400px }
.textblue1  { color: #355263; font-size: 1em; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular }
.smalltext2a     { color: #663; font-size: 0.9em; line-height: 1.1em; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular }
.smalltext2b  { color: black; font-weight: bold; font-size: 0.8em; line-height: 1.1em; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular }
.subtitle1  { color: black; font-weight: bold; font-size: 14px; line-height: 14px; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular }
.subtitle2  { color: white; font-weight: bold; font-size: 14px; line-height: 14px; font-family: "Trebuchet MS", Arial, Helvetica, Geneva, Swiss, SunSans-Regular }
.headpb  { color: black; font-weight: bold; font-size: 15px; text-align: left; vertical-align: top; letter-spacing:2px;}
.tab1s  { color: white; font-weight: bold; font-size: 12px; line-height: 17px; text-decoration: none; background-color: #6b8899; text-align: center }
.tab1u  {  color: black; background-color:#DFDDD5; font-size:12px; text-decoration:none; font-weight:bold; text-align:center }
.tab2s  { color: white; font-weight: bold; font-size: 11px; text-decoration: none; background-color: #6b8899 }
.tab2u  { color: white; font-weight: normal; font-size: 11px; text-decoration: none; background-color: #6b8899 }
span.tab1u  { color: black }
span.tab2u  { text-decoration: underline }
span.tab2s  {text-decoration: underline }
.tablecolumnhead1  { color: #663; font-weight: bold; font-size: 0.7em; text-align: center }
.tablecolumnhead2   { color: #663; font-weight: 600; font-size: 0.75em}
.tablehead1    { font-weight: bold; font-size: 1em; line-height: 1.1em; background-color: #cc9; text-align: left; text-indent: 0.5em; letter-spacing: 0.1em }
.tablehead1b   { font-weight: bold; font-size: 1em; line-height: 1.1em; background-color: #cc9; text-align: left; text-indent: 0.5em }
.tablesubhead1  { color: black; font-weight: bold; font-size: 0.85em; background-color: #efeee9; text-align: left; text-indent: 0.5em }
.tablehead3  { color: black; font-weight: bold; margin-left: .5em }
.tabb  { font-weight: bold; font-size: 14pt;}
.tabw  { color: white; font-weight: bold; font-size: 14pt; }
.task1  { margin-top: 0.3em; margin-left: 1em; font-size: 0.8em }
.task2  { margin-top: 0.3em; margin-left: 2em; font-size: 0.8em }
.windowheaddgrey  { color: #5a5958; font-weight: bold; font-size: 18pt; line-height: 18pt; letter-spacing: 1px }
.windowheadblack  { color: #5a5958; font-weight: bold; font-size: 18pt; line-height: 18pt; letter-spacing: 1px }
.windowheadwhite  { color: white; font-weight: bold; font-size: 18pt; line-height: 18pt; letter-spacing: 1px }
.width350  { width: 350px }
.width400  { width: 400px }
.width450  { width: 450px }
.width500  

 width: 500px }