Difference between revisions of "Application Branding"

Latest revision as of 06:54, 16 July 2019

Here, you learn how to customize the application banner with your company name and logo, how to Customize Your Email Templates, and how to rename the predefined objects that come with the platform.

Add Your Logo, Company Name, and Custom Feeds

The first step is to make sure your users and visitors see an interface that includes your organization's name and logo.

Open the ServiceDesk application
Go to > Channels > Service Portal
(Branding changes made here apply to all applications.)
In the Branding section, specify:
Header Logo

Upload your organization's logo image.

Standard logo size is 98 pixels wide by 24 pixels high

A realistic maximum size is up to 600 pixels wide by 32 pixels high

Tip:

Even at 32 pixels high, only very simple images and stylized text are readable.

Web Site Url

Enter the URL the users go to when they click on your logo.

(Typically, that will be your organization's web site.)

Favicon

Upload a small favicon image that displays in the browser's address bar,

in bookmarks, and in browser tabs.

Mobile Logo

Upload an image that will be seen by users who access the portal over a mobile device.

Announcement Widget

Specify the title and HTML text for a welcome message or any other announcement

you would like to make on this page.

Page Background Color

Select a background color that matches your organization's theme.
While you're here, note that the Email Templates section contains links to the templates for messages that portal users will see. (You'll do some customizing momentarily. For now, just note where they are.)
Click [Save]

Note:

For a complete list of Service Portal configuration options, see the Service Portal Settings.

Customize Your Email Templates

Add Team Information to the Global Template Variables

The first step in customizing your email templates is to make sure that they contain the right name and email addresses. Variables have been defined for just that purpose, so you need to make the changes in only one place. To modify the variables:

Go to > Customization > Template Variables
Click [Manage Custom Template Variables]
Modify the first three default variables:
Support Team Name

Put the name of your support team here, so messages recipients know who the message is coming from.

Support Team Email Address

When users reply to a case-related message, their comments are automatically recorded as part of the case. This address lets them send messages to the support group for everything else.

Support No Reply Email Address

Some messages are informational, and do not allow replies. Use this value to display something for your users to see. For example: noReply@YourCompany.com
Add any other variables you need for use in multiple templates.
Click [Save]

Add Your Logo and other Information to the Templates

With the template variables set up, the default email templates are perfectly usable, just as they are. They aren't very stylish, however! To add a logo, additional text, and additional styling, you'll want to modify the templates:

Go to > Case Management > Email Templates to see a list of all email templates used in the system.
Go to > Channels > Service Portal to modify the templates that are used by the Service Portal.
Go to > Customization > Objects > {object} > Email Templates to make changes to email templates defined for other objects

Tip: When you're done making changes to a template, be sure to click [Save] at the bottom of the page.

Change the Name of Predefined Objects

The concept of "Case Management" covers many different areas of activity. While many organizations work with things called "cases", others work with things called "Incidents", or "Investigations"--or they may have some other name entirely for the unit of work that comes in, gets handled, and then goes back out as "completed". They all work in fundamentally the same way--with defined processes, business rules, data forms, email communications stored in a history, and associated documents--but it's helpful for users if the interface gives them names they recognize.

In the AgileApps Cloud platform, the names displayed in the ServiceDesk can be modified to suit your organization. The label used for the Cases object can be changed, along with the labels used for Tasks, Contacts, and other objects.

Change the Object Name

Go to > Customization > Objects > {object} > Object Properties
You now have two options:
- You can change the name of the object, if you like. The advantage is that any code you write will use the new object name. The disadvantage is that you will have to modify any and all Email Templates and Document Templates defined on the object, and change the names of the template variables they refer to--since those names all contain the object label (for example: $cases.description).
- The more common solution is to change the Plural and Singular labels defined for the object. For cases, for example, those labels are "Cases", and "Case", respectively. Those changes affect the UI that users see. Template variables and code, on the other hand, continue to use the object name. As an added plus, code samples you get from others or find on the wiki will work with fewer modifications.

Reviewing the interface, you will see that many of the labels and buttons that the user sees automatically reflect the change. There are some things that don't change, however. The next steps change those.

Change View Names

Looking down the sidebar, you'll see that the predefined views are still using the old object names. For example: "All Active Cases" and "Open Team Tasks". You'll want to change those to match your object name.

If you don't need most of the views, do the following:

Do a "Save As" on the views you wish to keep, and change the name.
Then, for each the original views:
- Edit the view as the administrator
- Click [Save]
- Change visibility to Visible to me only
- Click [Save] again

If you want to keep most of the default views, use the Translation Workbench:

Go to > Administration > Account Management > Translation Workbench
Select the language (there may only be one).
Under Elements, choose Views
For Tasks, under View Type, choose Other Views.
For Cases and other objects, choose Object Related Views, and then select the object in question.
Click [Edit]
Specify "translated" labels to use for the predefined views.
Click [Save]

Change Field Labels

Most of the time, the default field names are fine. But there are times when the field name appears in the column heading, when a list of records is displayed. For example, when displaying a view of Case records, one of the column headings is Case Channel (the "channel" by which the case arrived--by email for example, or after it was entered by a case agent).

Go to > Administration > Account Management > Translation Workbench
Select the language (there may only be one).
Under Elements, choose Fields.
Under Objects:
- For Cases, choose Case Folder. (The object from which all case types are inherited. The Cases object contains custom fields, only.)
- For other objects, choose the object name.
Click [Edit]
Specify "translated" labels to use for the predefined fields.
Click [Save]

@@ Line 1: / Line 1: @@
-This article tells you how to customize the Service Portal with your company name and logo. Even if haven't enabled the Service Portal, you'll want to see how to [[\#email_templates|Customize Your Email Templates]].
+Here, you learn how to customize the application banner with your company name and logo, how to [[#email_templates|Customize Your Email Templates]], and how to rename the predefined objects that come with the platform.
-===Add Your Logo and Company Name to the Portal===
+==Add Your Logo, Company Name, and Custom Feeds==
-The first step is to make sure your visitors see things that identify the portal as yours:
+The first step is to make sure your users and visitors see an interface that includes your organization's name and logo.
-# Go to '''[[File:GearIcon.png]] > Channels > Service Portal'''
+# Open the [[ServiceDesk application]]
+# Go to '''[[File:GearIcon.png]] > Channels > Service Portal'''<br>(Branding changes made here apply to all applications.)
 # In the '''Branding''' section, specify:
-#:'''Header Logo'''<br>Upload your organization's logo image.<br>Standard logo size is 98 pixels wide by 24 pixels high<br>A realistic maximum size is up to 600 pixels wide by 32 pixels high
+#:'''Header Logo'''
-#:
+#:Upload your organization's logo image.
-#:'''Tip:'''
+#:Standard logo size is 98 pixels wide by 24 pixels high
-#:Even at 32 pixels high, only very simple images and stylized text are readable.
+#:A realistic maximum size is up to 600 pixels wide by 32 pixels high
 #:
+#::'''Tip:'''
+#::Even at 32 pixels high, only very simple images and stylized text are readable.
+#:<br>
+#:<span id="logo_url"></span>
 #:'''Web Site Url'''
 #:Enter the URL the users go to when they click on your logo.
 #:(Typically, that will be your organization's web site.)
-#:
+#:<br>
+#:<span id="favicon"></span>
 #:'''Favicon'''
-#:Upload a small [http://en.wikipedia.org/wiki/Favicon favicon] image that displays in #:the browser's address bar,
+#:Upload a small [http://en.wikipedia.org/wiki/Favicon favicon] image that displays in the browser's address bar,
 #:in bookmarks, and in browser tabs.
-#:
+#:<br>
+#:<span id="mobile_logo"></span>
 #:'''Mobile Logo'''
 #: Upload an image that will be seen by users who access the portal over a mobile device.
+#:<br>
+#:<span id="announcements"></span>
 #:'''Announcement Widget'''
-#:Specify the title and HTML text for a welcome message or any other announcement you #:would like to make on this page.
+#:Specify the title and HTML text for a welcome message or any other announcement
-#:
+#: you would like to make on this page.
-#:'''Twitter Hashtag'''
+#:<br>
-#:Specify a twitter feed to feature Tweets to that tag on the support page.
+<!--#:<span id="twitter"></span><span id="twitter_feed"></span>
-#:
+#:'''Twitter Widget'''
+#:Use this option to display a Twitter feed in the Service Portal.
+#:To use it:
+#::* In your Twitter account, go to Settings, and create a new widget
+#::* Configure that widget to display an embeddable timeline, or one of the other feed types
+#::* The widget generates code that has two segments:
+#:::: An HTML ''link'' portion: <tt><nowiki><a ...> ... </a></nowiki></tt>
+#:::: A JavaScript portion: <tt><nowiki><script ...> ... </script></nowiki></tt>
+#::* Copy the HTML link portion of the generated code.<br>(The JavaScript portion is not needed. That code has already been integrated into the platform.)
+#::* Paste HTML link portion into the '''Twitter Widget''' field
+#:<br> (Hiding due to LJP-8904)-->
+#:<span id="bg_color"></span>
 #:'''Page Background Color'''
 #:Select a background color that matches your organization's theme.
+#:
 # While you're here, note that the''' Email Templates''' section contains links to the templates for messages that portal users will see. (You'll do some customizing momentarily. For now, just note where they are.)
 #:
@@ Line 34: / Line 55: @@
 :For a complete list of Service Portal configuration options, see the [[Service Portal Settings]].
-===Customize Your Email Templates===
+==Customize Your Email Templates==
-====Add Team Information to the Global Template Variables====
+===Add Team Information to the Global Template Variables===
 The first step in customizing your email templates is to make sure that they contain the right name and email addresses. Variables have been defined for just that purpose, so you need to make the changes in only one place.
 To modify the variables:
-# Go to '''[[File:GearIcon.png]] >''' '''Shared Global Resources > Template Variables'''
+# Go to '''[[File:GearIcon.png]] > Customization > Template Variables'''
 # Click '''[Manage Custom Template Variables]'''
 # Modify the first three default variables:
 #:'''Support Team Name'''
 #:Put the name of your support team here, so messages recipients know who the message is coming from.
-#:
+#:<br>
 #:'''Support Team Email Address'''
 #:When users reply to a case-related message, their comments are automatically recorded as part of the case. This address lets them send messages to the support group for everything else.
-#:
+#:<br>
 #:'''Support No Reply Email Address'''
 #:Some messages are informational, and do not allow replies. Use this value to display something for your users to see. For example: noReply@YourCompany.com
+#:
 # Add any other variables you need for use in multiple templates.
 #:
 # Click '''[Save]'''
-====Add Your Logo and other Information to the Templates====
+===Add Your Logo and other Information to the Templates===
 With the template variables set up, the default email templates are perfectly usable, just as they are. They aren't very stylish, however!
 To add a logo, additional text, and additional styling, you'll want to modify the templates:
-# Go to '''[[File:GearIcon.png]] > Case Management > Email Templates''' to see a list of all email templates used in the system.<br>-''or''-<br>Go to '''[[File:GearIcon.png]] > Channels > Service Portal''' to modify the templates that are used by the Service Portal.
+# Go to '''[[File:GearIcon.png]] > Case Management > Email Templates''' to see a list of all email templates used in the system.
-#:
+# Go to '''[[File:GearIcon.png]] > Channels > Service Portal''' to modify the templates that are used by the Service Portal.
-#:(Those are the only templates you really need to modify, for now.
+# Go to '''[[File:GearIcon.png]] > Customization > Objects > {object} > Email Templates''' to make changes to email templates defined for other objects
-#: The other templates are for messages that go to your internal staff.)
-#:
+{{Tip|When you're done making changes to a template, be sure to click '''[Save]''' at the bottom of the page.}}
-# When you're done making changes to a template, be sure to click '''[Save]''' at the bottom of the page.
+<span id="object_names"></span>
+==Change the Name of Predefined Objects==
+The concept of "Case Management" covers many different areas of activity. While many organizations work with things called "cases", others work with things called "Incidents", or "Investigations"--or they may have some other name entirely for the unit of work that comes in, gets handled, and then goes back out as "completed". They all work in fundamentally the same way--with defined processes, business rules, data forms, email communications stored in a history, and associated documents--but it's helpful for users if the interface gives them names they recognize.
+In the {{EnterpriseBrand}}, the names displayed in the ServiceDesk can be modified to suit your organization. The label used for the Cases object can be changed, along with the labels used for Tasks, Contacts, and other objects.
+===Change the Object Name===
+# Go to '''[[File:GearIcon.png]] > Customization > Objects > {object} > Object Properties'''
+# You now have two options:
+#* You can change the name of the object, if you like. The advantage is that any code you write will use the new object name. The disadvantage is that you will have to modify any and all [[Email Templates]] and [[Document Templates]] defined on the object, and change the names of the template variables they refer to--since those names all contain the object label (for example: <tt>$cases.description</tt>).
+#* The more common solution is to change the Plural and Singular labels defined for the object. For cases, for example, those labels are "Cases", and "Case", respectively. Those changes affect the UI that users see. Template variables and code, on the other hand, continue to use the object name. As an added plus, code samples you get from others or find on the wiki will work with fewer modifications.
+Reviewing the interface, you will see that many of the labels and buttons that the user sees automatically reflect the change. There are some things that don't change, however. The next steps change those.
+===Change View Names===
+Looking down the sidebar, you'll see that the predefined views are still using the old object names. For example: "All Active Cases" and "Open Team Tasks". You'll want to change those to match your object name.
+If you don't need most of the views, do the following:
+# Do a "Save As" on the views you wish to keep, and change the name.
+# Then, for each the original views:
+#* Edit the view as the administrator
+#* Click '''[Save]'''
+#* Change visibility to '''Visible to me only'''
+#* Click '''[Save]''' again
+If you want to keep most of the default views, use the [[Translation Workbench]]:
+# Go to '''[[File:GearIcon.png]] > Administration > Account Management > Translation Workbench'''
+# Select the language (there may only be one).
+# Under '''Elements''', choose ''Views''
+# For Tasks, under '''View Type''', choose ''Other Views''.
+# For Cases and other objects, choose ''Object Related Views'', and then select the object in question.
+# Click '''[Edit]'''
+# Specify "translated" labels to use for the predefined views.
+# Click '''[Save]'''
+===Change Field Labels===
+Most of the time, the default field names are fine. But there are times when the field name appears in the column heading, when a list of records is displayed. For example, when displaying a view of Case records, one of the column headings is ''Case Channel'' (the "channel" by which the case arrived--by email for example, or after it was entered by a case agent).
+# Go to '''[[File:GearIcon.png]] > Administration > Account Management > Translation Workbench'''
+# Select the language (there may only be one).
+# Under '''Elements''', choose ''Fields''.
+# Under '''Objects''':
+#* For Cases, choose ''Case Folder''. (The object from which all case types are inherited. The Cases object contains custom fields, only.)
+#* For other objects, choose the object name.
+# Click '''[Edit]'''
+# Specify "translated" labels to use for the predefined fields.
+# Click '''[Save]'''
+<noinclude>
+[[Category:{{HD}} application]]
+[[Category:Design]]
+</noinclude>

Search

where to start

Feedback

customize and design

resources

Tools

Personal tools