Template Maintenance |
Template Maintenance is used to view and modify the settings for a previously created template. A template defines the layout of a panel and how it will be presented to the Web browser. It controls the visual characteristics of the Web page such as size, font, colors and images.
When a new template is created and saved using the Template Designer Wizard, a directory is created for that template in the lib\_plus\inomads\templates directory. Depending on the settings used to create the template, the template directory can contain any or all of the following files:
File |
Contents Description |
template.conf |
Template configuration settings |
.tpl files |
HTML segments |
style.css file |
Style sheet information used by the browser to define the presentation of the panel (i.e. font, color and background) |
sysimage directory |
Replacement system images (!xxx) |
custom.conf and custom.ini |
Custom settings |
Template Maintenance is invoked by using any of the following methods:
Location |
Method |
From the PxPlus IDE Main Launcher |
Expand the Web Deployment category and select iNomads Setup to invoke the iNomads Setup window. From the Template drop box, select a template with custom settings previously defined (i.e. the template-specific directory contains the custom.ini file). Then, click the Custom button located below the Options button. |
From a Web browser |
Launch iNomads from a Web browser. From the iNomads Application Launchpad window, invoke the iNomads Setup window by either clicking the Admin button or selecting admin from the Transaction drop box. From the Template drop box, select a template with custom settings previously defined (i.e. the template-specific directory contains the custom.ini file). Then, click the Custom button located below the Options button. |
From the PxPlus Command prompt |
Invoke the iNomads Setup window by entering the following command: RUN "*plus/inomads/admin" From the Template drop box, select a template with custom settings previously defined (i.e. the template-specific directory contains the custom.ini file). Then, click the Custom button located below the Options button. |
Template Maintenance is launched for the selected template, allowing you to view and modify any of the settings as needed.
This window consists of the following:
Template |
Name of the selected template. The name is for viewing only. | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Page | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Page Background |
Settings for defining the page background color or image.
| ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Click or select the section you wish to edit |
Displays a diagram of the layout that was selected when the template was initially created. To view or modify the settings for a particular section, click on that section inside the diagram or use the adjacent Section spinner control. By default, the first section is highlighted. You can also add new sections to the template layout using the grid on the Advanced Layout tab. See Advanced Layout. | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Section |
Indicates the number of the template section currently highlighted. To change to a different section, use the up/down arrows attached to this field or manually enter the number. You can also click on the desired section inside the diagram shown on the left. Note: | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Background/Size |
| ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Fixed Attributes (Use Advanced Layout to Change) |
The settings in this section are view only. To modify them, select the Advanced Layout tab (see details below).
| ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Section Contents |
You can optionally include additional contents such as Text, Images, Menus and Other parameters in the currently selected section. See Section Contents. | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Menu Name |
Enter a name for the new menu definition. To view or modify the settings for a previously saved menu definition, select the name from the drop box or manually enter the name. You can also create multiple menu definitions for the same template. To do this, highlight the existing menu name and type a new name. If the new menu name does not exist, a message asks if you wish to reset the current menu values and offers three possible responses: Yes, No, Contents Only:
Save the new menu definition either by clicking OK (closes Template Maintenance) or by clicking Apply (leaves Template Maintenance open with the current record displayed). Note: | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Name of the program file to use for generating the menu. Click the Program browse button to specify the program file or enter the program pathname. See Menu Generation Program. (Added in PxPlus 2016) | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Layout |
| ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Border |
| ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Contents |
| ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Normal Display |
| ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Mouse Over Display |
| ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Background Image |
| ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Menu Content |
This section is used to define the contents for the menu. If a Menu Generation Program is entered, the Menu Contents grid is not available for entry. For each option that you want to include in the menu, a separate grid row must be entered with the following details:
Use the Delete and Move Up/Move Down buttons beside the list box to remove a menu option or rearrange the order of the options within the menu. To view or change the content for a different menu, select a menu from the Menu Name drop box. Selecting a different menu (or a different folder tab) automatically saves any changes to the current menu definition. You can also click the Apply button to save changes. | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Panel Header |
| ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Panel Border |
| ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Panel Body | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Panel Background |
| ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Panel Text |
| ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Frames | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Frame Header and Body |
| ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Frame Border |
| ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Frame Text |
| ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Folders | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Folder Background |
| ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Folder Border |
| ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Folder Tab Colors |
| ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Define layout for each section and optional fixed contents |
Displays a grid with the settings that were entered for each section of the layout when the template was created. Each grid row represents a numbered section (identified by the SectID column). Each grid column heading represents the name of an option, similar to those on the Sections tab. Use this grid to refine and adjust the appearance of the template. This is done by modifying the settings for the numbered section(s) you want to adjust and then clicking the Apply button. To add a new section, enter the applicable settings in a blank grid row and then click the Apply button. You can use the Move Up/Move Down buttons to the right of the grid to rearrange the order of the sections. However, keep in mind that other sections of the template layout may be impacted, and the settings for those sections may need to be adjusted. To view the template with these changes on a Web browser, click the Test button. Important Note:
|
SectID |
Number that identifies each section of the template layout. | ||||||||
Cols |
Width of the section, which is measured by the number of columns over which it extends horizontally. | ||||||||
Rows |
Height of the section, which is measured by the number or rows over which it extends vertically. | ||||||||
Panel |
Check box that indicates whether the section contains a panel. | ||||||||
EndRow |
Check box that indicates whether the section is in the last column at the end of the current row. | ||||||||
EndTbl |
Check box that indicates whether the section is in the last row of the table. | ||||||||
Wide |
Width of the section (in pixels). To change the width of a section, click on this cell for the SectID row that you want to change, enter the new value and click the Apply button. The new value is automatically reflected in the Sections tab. | ||||||||
Hi |
Height of the section (in pixels). To change the height of a section, click on this cell for the SectID row that you want to change, enter the new value and click the Apply button. The new value is automatically reflected in the Sections tab. | ||||||||
BackColor |
Background color for the section. See Color Specification for information on applying a color. | ||||||||
BackImage |
Background image for the section. Click the Image browse button inside this cell to select an image. If the image selected is not located under the *plus/inomads directory, you are asked if you want to copy the image file to an Images directory that will be created for that template under *plus\inomads\templates. It is a good idea to keep a copy of the image file in the template's directory so that it can be easily located and displayed when the template is applied. | ||||||||
Repeat |
(Available only when a BackImage has been selected) Selections for duplicating the image are:
| ||||||||
Position |
(Available only when a BackImage has been selected) Selections for positioning the image are: left top (Default), left center, left bottom, right top, right center, right bottom, center top, center center, center bottom, full screen. |
Section Contents
Displays any additional contents such as Text, Images, Menus and Other parameters that were included in the selected section of the template layout. See Section Contents.
Advanced Menus
Define layout and options for system generated menus
The first grid displays the settings for each menu defined for the selected section. If more than one menu has been defined for the same section, all of menu names will be listed. Each row represents a different menu definition, and each column heading represents the name of an option, similar to those on the Menus tab. The second grid displays the menu contents for the menu definition selected in the first grid.
After a template has been created, you can access the Advanced Menus tab to refine and adjust the menu definition by changing the desired settings and then clicking the Apply button. To view the template with these changes on a Web browser, click the Test button.
Name |
Enter a name for the new menu definition or select an existing menu name from the drop box. | ||||||||
Type |
Select either a vertical or horizontal menu layout:
| ||||||||
Text font |
Enter a font for the menu text. | ||||||||
Font Sz |
Enter a font size for the menu text (in pixels). | ||||||||
Text Color |
Color for the menu text. See Color Specification for information on applying a color. | ||||||||
Bold |
Select this check box to bold the menu text. | ||||||||
U/L |
Select this check box to underline the menu text. | ||||||||
Width |
Enter a width for the menu options area. This setting is ignored when horizontal is selected for the menu layout Type. | ||||||||
Height |
Enter a height for the menu options area. (Applies to either horizontal or vertical menu layout Type.) | ||||||||
Shadow |
Select a shadow style for the menu. Selections are none (default), bottom right, bottom left, top right, top left, full, bottom, top, left, right. | ||||||||
Border Clr |
Color for the menu border. See Color Specification for information on applying a color. | ||||||||
Corner Rad |
(Available only when a Border Color has been specified) Enter a value for the rounded corner radius or use the spinner controls to specify a value. A blank or low value (i.e. <10) produces squared menu corners. A higher value (10 - 30) produces progressively rounded menu corners. Maximum value is 99. | ||||||||
Sep Color |
Color for the line (vertical or horizontal) separating the menu options. See Color Specification for information on applying a color. | ||||||||
Back Clr |
Color for the menu background. See Color Specification for information on applying a color. | ||||||||
Back Image |
Image to display for the menu background. Click the Image browse button to select an image. If the image selected is not located under the *plus/inomads directory, you are asked if you want to copy the image file to an Images directory that will be created for that template under *plus\inomads\templates. It is a good idea to keep a copy of the image file in the template's directory so that it can be easily located and displayed when the template is applied. | ||||||||
Repeat |
(Available only when an image has been selected for the menu background Image (see above)) Selections for duplicating the image are:
| ||||||||
Position |
(Available only when an image has been selected for the menu background Image (see above)) Selections for positioning the image are: left top (Default), left center, left bottom, right top, right center, right bottom, center top, center center, center bottom, full screen. | ||||||||
Menu Generation Program |
Pathname of the program file to use for generating the menu. See Menu Generation Program. (added in PxPlus 2016) | ||||||||
Note: | |||||||||
*Bold |
Select this check box to bold the menu text only when the mouse pointer is positioned over individual menu options. | ||||||||
*U/L |
Select this check box to underline the menu text only when the mouse pointer is positioned over individual menu options. | ||||||||
*Text Color |
Color for the menu text only when the mouse pointer is positioned over individual menu options. See Color Specification for information on applying a color. | ||||||||
*Back Clr |
Color for the background only when the mouse pointer is positioned over individual menu options. See Color Specification for information on applying a color. | ||||||||
*Back Image |
Image to display when the mouse pointer is positioned over the menu. Click the Image browse button to select an image. If the image selected is not located under the *plus/inomads directory, you are asked if you want to copy the image file to an Images directory that will be created for that template under *plus\inomads\templates. It is a good idea to keep a copy of the image file in the template's directory so that it can be easily located and displayed when the template is applied. |
This section is used to define the contents for the menu. If a Menu Generation Program is entered, the Menu Contents grid is not available for entry.
For each option that you want to include in the menu, a separate grid row must be entered with the following details:
Menu text |
Enter the text for the menu option that will be visible to the user. |
Transaction or URL |
If the menu launches a different iNomads transaction, enter the Transaction code. If the menu spawns a sub-menu, enter the sub-menu name in the format menu:name (where name is the sub-menu name). If the menu launches a Web page, enter the URL address preceded with http://. |
Use the Delete and Move Up/Move Down buttons beside the list box to remove a menu option or rearrange the order of the options within the menu.
To view or change the content for a different menu, select a menu Name in the upper grid. Selecting a different menu (or a different folder tab) automatically saves any changes to the current menu contents. You can also click the Apply button to save changes.
Test
Displays the selected template on a Web browser in "test" mode with the current settings in Template Maintenance applied. This allows you to preview the template and make any further adjustments if needed. (added in PxPlus 2016)
Changing any of the template settings disables the Test button only until the Apply button is selected. This ensures that you are testing the template with the most recent changes applied.
Edit "custom.conf"
This button is displayed only when a custom.conf file with custom options defined for the selected template exists in that template's sub-directory (within the inomads/templates directory). Selecting this button invokes Configuration Maintenance that displays the template's custom settings.
OK
Saves any changes and closes Template Maintenance.
Close
Closes Template Maintenance. A confirm-save message displays if you have changed any of the data but did not select the Apply button prior to closing.
Apply
This button is available only when any of the template settings is changed. Selecting this button applies the changes to the selected template. Template Maintenance remains open to allow you to Test the template and make further adjustments if needed.
The first grid in the Advanced Layout tab displays the settings entered for each section of the layout when the template was created. The settings for the Cols, Rows, Panel, EndRow and EndTbl columns are based on the template layout selected, and changing these settings impacts the appearance of the template layout. To illustrate this, refer to the example below.
Example:
This example demonstrates how changing a setting for one section of a template can impact the other sections and affect the overall appearance of the template layout.
1. |
A template is created using the following layout and settings: |
| ||
|
|
|
| |
2. |
The Wide setting for SectID 3 is manually changed from 150 to 600: |
| ||
|
|
| ||
3. |
For this layout, changing the Wide setting not only impacts Section 3 but also impacts Section 7 because both sections are in the same column. At the same time, the width of Sections 1, 2, 5 and 6 are impacted to accommodate this change. | |||
|
| |||
To further explain the advanced layout settings, refer to the template layout examples below.
Template Layout |
Advanced Layout Tab Settings | ||||||||||||||||||
|
| ||||||||||||||||||
|
| ||||||||||||||||||
|
| ||||||||||||||||||
|
| ||||||||||||||||||
|
| ||||||||||||||||||
|
|
Section Contents allows you to optionally include additional contents such as Text, Images, Menus and Other parameters in the selected section of the template layout. To do this, click the Add Section Contents button beside the list box. From the popup menu, select the type of contents you are adding. When you have made your selection, a separate window with options pertaining to your selection will display. After saving the section contents, you can use the Delete, Edit and Move Up/Down buttons to the right of the Section Contents list box to remove, modify or rearrange the order of these additions.
The options for adding Text, Images, Menus and Other parameters are described below.
Section Contents - Text Template | |
Text |
Enter the text to add to the current section. |
Font |
Enter a font for the text. |
Color |
Specify a color for the text. See Color Specification for information on applying a color. |
URL |
Enter a URL if the text will be a hyperlink. If the text launches a Web page, enter the URL address preceded with http://. |
Vertical Position |
Enter a vertical position for the text. Selections are Top (default), Middle, Bottom. |
Vertical Adjustment |
Enter a value (in pixels) to adjust the vertical position of the text, if necessary. |
Horizontal Position |
Enter a horizontal position for the text. Selections are Left (default), Center, Right. |
Horizontal Adjustment |
Enter a value (in pixels) to adjust the horizontal position of the text, if necessary. |
Section Contents - Image Template | |
Image |
Select the image to add to the current section. Click the Image browse button to select an image. If the image selected is not located under the *plus/inomads directory, you are asked if you want to copy the image file to an Images directory that will be created for that template under *plus\inomads\templates. It is a good idea to keep a copy of the image file in the template's directory so that it can be easily located and displayed when the template is applied. |
Width |
Enter a width for the image (in pixels). The image will be scaled to the specified height and width. |
Height |
Enter a height for the image (in pixels). The image will be scaled to the specified height and width. |
URL |
Enter a URL if the image will be a hyperlink. If the image launches a Web page, enter the URL address preceded with http://. |
Vertical Position |
Enter a vertical position for the image. Selections are Top (default), Middle, Bottom. |
Vertical Adjustment |
Enter a value (in pixels) to adjust the vertical position of the image, if necessary. |
Horizontal Position |
Enter a horizontal position for the image. Selections are Left (default), Center, Right. |
Horizontal Adjustment |
Enter a value (in pixels) to adjust the horizontal position of the image, if necessary. |
Section Contents - Menu Template | |
Menu Name |
Enter a name for the menu. To define menu content and display settings, see the Menus tab. |
Define Menu |
Click this button to invoke the Define Menus window for defining a new menu for the current section. |
Width |
Enter a width for the menu (in pixels). |
Height |
Enter a height for the menu (in pixels). |
Vertical Position |
Enter a vertical position for the menu. Selections are Top (default), Middle, Bottom. |
Vertical Adjustment |
Enter a value (in pixels) to adjust the vertical position of the menu, if necessary. |
Horizontal Position |
Enter a horizontal position for the menu. Selections are Left (default), Center, Right. |
Horizontal Adjustment |
Enter a value (in pixels) to adjust the horizontal position of the menu, if necessary. |
Section Contents - Other Template | |
Parameter 1 - Parameter 8 |
Define the parameters to be passed to the user-defined Template Definition files (similar to text.tpl, image.tpl or menu.tpl). |