This template is a portal that enables you to monitor incidents/requests, perform approvals, consult the Knowledge Base, etc.

It is shipped in both the Desktop and Mobile versions.

Notes

• The template is provided with the Green_Blue-OpenSans theme. You can customize and adapt it to your style guide.

• CSS overrides are grouped in a CSS Overwrite widget available in all pages whenever required, e.g. the color of the search and New Request buttons, the color of the selected filter, etc.

Caution

• The Sliding Page widget on the Home page contains a CSS override that ensures optimal display in different resolutions. This override, calculated based on the height of the widget, will hide the navigation icons in the other News widget on the Home page.

Home page

 Mobile display
         

Message from the IT Department

The messages are displayed via a Sliding Page widget, which allows the access to the Services catalog and the Knowledge, via a button  (4).

An image (1), a logo (2) and a text (3) are also displayed on the widget.

Trends

Three trends are displayed:

• Open incidents
• Current service requests
• Self Service approvals to be performed

News articles

News articles are displayed via a Sliding Page widget: displaying of a fixed text and the top three news articles from the Service Manager Home menu.
        

Chat room

The tawk.to (Chat) widget is displayed using a HTML Script widget. It uses JavaScript configured for discussions via an Service Manager demo account. You can adapt it to your requirements.  See the procedure.
         

 Mobile display
         

My Incidents page

The page uses a filter based on the Home > My Incidents menu.

• (1) List of user incidents
• (2) A tab bar (Incident Details Tab widget) displays the following for each selected incident:
  • A Details pane with a button that opens a wizard for updating the incident.
  • The history of actions
  • Attachments (in the Attachments tab)
  • Questions and answers

The Attachments tab is used to attach and remove documents. Note: The delete icon  appears for public documents, not those downloaded via questionnaires.

Service Catalog page

The page displays a service catalog template with the New Request button in the details (Form) of a catalog entry. This is the recommended configuration when there are several elements in the list.
         

The Status Notification tag is used in the EasyStore Catalog items Data Viewer widget.

• It keeps the number (1) and the status (2) of the created request displayed at all times.
• If you prefer the standard message which only appears briefly, delete the #[EZVTAG-NEW-REQUEST-STATUS]# tag from the Form display mode.
           

Top of the page

The top of each page contains a Logo Secured HTML widget that displays the logo, and a Login & Logout & User Info Authentication widget. It is in the same color as the area outside the page so as to appear transparent.
         

Bottom of the page

The bottom of each page contains a Social Bar Menu widget that displays a button bar. The Contact IT option is used to create an incident.
         

Procedure: How to install and use the template app

Step 1: Importing the theme to Service Apps.

1. Download the file below to your workstation.

   Theme (Green_Blue-OpenSans)

2. Import the downloaded file to Service Apps by clicking Import in the Gallery toolbar.

3. (optional) Customize the theme.

• Edit the theme by clicking  in the Gallery toolbar.
• Replace the colors by those in your style guide.
• Publish the theme.
   

Step 2: Importing the template to Service Apps.

1. Download the required version of the files below to your workstation.

   Template

2. Import the downloaded file to Service Apps by clicking Import in the Gallery toolbar.

Step 3: Importing views, filter and reports to Service Manager.

1. Download the files below to your computer.

• Views:

• A filter for actions in internal steps:

• Reports:

2. Import the downloaded file to Service Apps by clicking Import in the Gallery toolbar.

Step 4: Creating your Service Apps apps.

BestPracticeDuplicatingTemplate

1. Duplicate the template you just imported.

2. Rename the duplicated template.

3. Associate an image with it.

4. Create the shortcut pointing to your app.

5. Repeat this procedure for each new app created using the same template.

Step 5: Customizing datasources and widgets of your apps.

1. Customize the data sources.

• Go to the Service Apps graphical editor.
• Edit the New Request Catalog data source.
• Replace the filter by the one corresponding to the section of the catalog to promote on the portal.
• Check the data sources pointing to the EasyVista alias, e.g. the Query, Filter and View fields.
• Specify the execution context in the general properties of the app.
   

2. Customize the widgets.

Home page - tawk.to (Chat) widget.  See Tawk.to integration.

• Log in to your tawk.to account. If you do not have an account, you can create it by completing the form on the tawk.to website. 
• Configure the Chat widget via the website.
• Copy the JavaScript code.
• Go to the Service Apps graphical editor.
• Edit the tawk.to (Chat) widget.
• Paste the JavaScript code in the HTML Code field.

 Logo widget

• Open the text editor in Service Apps.
• Replace the logo with yours.
   

 CSS Overwrite widget

• In the Service Apps graphical editor, go to each page where you modified the theme colors. 
• Edit the CSS Overwrite widget.
• Replace the color by the one in your style guide in the HTML Code field.

 Social Bar widget - Contact IT

• Go to the Service Apps graphical editor.
• Edit the Social Bar widget.
• Modify the Catalog property to associate the incident catalog entry with the Contact IT element.
           
   

Page 3. Service Catalog - Filter List Catalog widget

• Edit the Filter widget.
• Edit the data source associated with the widget. Check that the filter shows the default value you want.
• Click on Filters List.
• Click Remove.
• Add the filters you want to use.
           
   

Page 5. Knowledge Base - Global Search in KB widget

• Specify the search language you want (English by default).
   

Step 6: Deleting the unused images/icons.

1. Open the editor from any widget.

2. Click .

3. Delete the files you want.

List of files to download

• Theme (Green_Blue-OpenSans)
• Template

• Views:
  • View Operation > Actions > All actions
  • View Home > My Approvals

• Filter

• Reports:
  • Questions/Responses
  • Know Errors and Knowledge