Configure the Page

Change the page title

By default, the tab title in the browser window for the Intelligent Advisor interview is comprised of the screen name followed by the project name.

You can provide a page title to use instead of the project name. To change the page title:

1. On the Interview tab, click the Styles button.
2. In the Styles dialog box, select the Styling tab.
3. In the Title field, enter the page title.
4. Click OK.

Note: If you remove the screen name from a screen, this will also remove the screen name from the tab title in the browser.

Change the page width

To change the page width:

1. On the Interview tab, click the Styles button.
2. In the Styles dialog box, select the Styling tab.
3. Click in the area on either side of the page.
4. In the pop-up window, enter the page width (in pixels) in the Width field.
5. Click OK.

Tip: Changing the page width is a good way to see what your interview will look like in a mobile browser. Alternatively, you can simply resize the browser window and the page layout will automatically adjust accordingly. Changing the page width is demonstrated in the Emergency Response example policy model that is installed with Policy Modeling. Be aware that changing the page width may affect how the navigation strip displays.

Change the background color of the page

To change the background color of the page:

1. On the Interview tab, click the Styles button.
2. In the Styles dialog box, select the Styling tab.
3. Click in the area on either side of the page.
4. In the pop-up window, for the Background field either:
   • click in the left hand side of the field and enter a new hex color code, or
   • click in the right hand side of the field and in the Color dialog select a new color. Click OK.
5. Click OK.

You can also use an image as the background of the page. To use this feature you should have a basic working knowledge of Cascading Style Sheet (CSS). To use an image as the background of the page:

1. On the Interview tab in Policy Modeling, click the Styles button.
2. In the Styles dialog box, click the Custom Files button. (If the project doesn't already have any custom files, you will be warned that custom files can make manual upgrade necessary for future product versions, and that you must test any customizations against WCAG 2.1 accessibility standards. Click OK.) Windows Explorer will open to the /interview-theme/resources folder in the project directory.
3. In the /interview-theme/resources folder, put:
   • the CSS file which defines the background image to use, and
   • the image file to use as the background.

Note: The browser may cache the custom CSS file, in which case any subsequent changes to the file will not be displayed until you reload the page in the browser.

Change the border color of the page

To change the border color of the page:

1. On the Interview tab, click the Styles button.
2. In the Styles dialog box, select the Styling tab.
3. Click in the area on either side of the page.
4. In the pop-up window, for the Border field either:
   • click in the left hand side of the field and enter a new hex color code, or
   • click in the right hand side of the field and in the Color dialog select a new color. Click OK.
5. Click OK.

Change the gutter color of the page

To change the gutter color of the page:

1. On the Interview tab, click the Styles button.
2. In the Styles dialog box, select the Styling tab.
3. Click in the area on either side of the page.
4. In the pop-up window, for the Gutter field either:
   • click in the left hand side of the field and enter a new hex color code, or
   • click in the right hand side and in the Color dialog select a new color. Click OK.
5. Click OK.

Change the page direction

By default, pages are rendered left-to-right. You can, however, specify that pages should be rendered right-to-left for that particular language. To do this:

1. On the Interview tab, click the Styles button.
2. In the Styles dialog box, select the Strings tab.
3. For the pagedir-right-to-left setting, double-click in the Text field.
4. Change the text to true.
5. Click OK.