<style>p { margin: 0; }span.fr-emoticon.fr-emoticon-img { background-repeat: no-repeat !important; font-size: inherit; height: 1em; width: 1em; min-height: 20px; min-width: 20px; display: inline-block; margin: -0.1em 0.1em 0.1em; line-height: 1; vertical-align: middle; } span.fr-emoticon { font-weight: normal; font-family: "Apple Color Emoji", "Segoe UI Emoji", "NotoColorEmoji", "Segoe UI Symbol", "Android Emoji", "EmojiSymbols"; display: inline; line-height: 0; } blockquote { border-left: solid 2px #5e35b1; color: #5e35b1; margin-left:0; padding-left:5px;}blockquote blockquote{ border-color: #00bcd4; color: #00bcd4;}blockquote blockquote blockquote{ border-color: #43a047; color: #43a047;} table.grid{ border-collapse: collapse;} table.grid td, table.grid th { border: 1px solid #ddd;} .fr-fic.fr-dib{ display: block; margin: 5px auto;}.fr-fic.fr-dib.fr-fir{ text-align: right; margin: 5px 0 5px auto;}.fr-fic.fr-dib.fr-fil{ text-align: left; margin: 5px auto 5px 0;}.fr-fic.fr-dii{ float: none; margin: 5px auto;}.fr-fic.fr-dii.fr-fil{ float: left; margin: 5px auto;}.fr-fic.fr-dii.fr-fir{ float: right; margin: 5px auto;}img.fr-dib.fr-fir { margin-right: 0; text-align: right;}img.fr-dib.fr-fil { margin-left: 0; text-align: left;}img.fr-dib { margin: 5px auto; display: block; float: none;}img.fr-bordered { box-sizing: content-box; border: solid 5px #CCC;}img.fr-shadow { box-shadow: 10px 10px 5px 0px #cccccc;}img.fr-rounded { border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box;}</style><style>
p {
margin: 0;
}
span.fr-emoticon.fr-emoticon-img {
background-repeat: no-repeat !important; font-size: inherit; height: 1em; width: 1em; min-height: 20px; min-width: 20px; display: inline-block; margin: -0.1em 0.1em 0.1em; line-height: 1; vertical-align: middle;
}
span.fr-emoticon {
font-weight: normal; font-family: "Apple Color Emoji", "Segoe UI Emoji", "NotoColorEmoji", "Segoe UI Symbol", "Android Emoji", "EmojiSymbols"; display: inline; line-height: 0;
}
blockquote {
border-left: solid 2px #5e35b1; color: #5e35b1; margin-left: 0; padding-left: 5px;
}
blockquote blockquote {
border-color: #00bcd4; color: #00bcd4;
}
blockquote blockquote blockquote {
border-color: #43a047; color: #43a047;
}
table.grid {
border-collapse: collapse;
}
table.grid td,
table.grid th {
border: 1px solid #ddd;
}
.fr-fic.fr-dib {
display: block; margin: 5px auto;
}
.fr-fic.fr-dib.fr-fir {
text-align: right; margin: 5px 0 5px auto;
}
.fr-fic.fr-dib.fr-fil {
text-align: left; margin: 5px auto 5px 0;
}
.fr-fic.fr-dii {
float: none; margin: 5px auto;
}
.fr-fic.fr-dii.fr-fil {
float: left; margin: 5px auto;
}
.fr-fic.fr-dii.fr-fir {
float: right; margin: 5px auto;
}
img.fr-dib.fr-fir {
margin-right: 0; text-align: right;
}
img.fr-dib.fr-fil {
margin-left: 0; text-align: left;
}
img.fr-dib {
margin: 5px auto; display: block; float: none;
}
img.fr-bordered {
box-sizing: content-box; border: solid 5px #CCC;
}
img.fr-shadow {
box-shadow: 10px 10px 5px 0px #cccccc;
}
img.fr-rounded {
border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box;
}
</style><p><span style="font-size: 11pt;"><strong>In this guide we will cover:</strong></span></p><p><span style="font-size: 11pt;"><strong>- List of Menu Buttons</strong></span></p><p><span style="font-size: 11pt;"><strong>- Creating Menu Buttons</strong></span></p><p><span style="font-size: 11pt;"><strong>- Customising Menu Buttons</strong></span></p><p><span style="font-size: 11pt;"><strong>- Show on Navigation Bar Setting</strong></span></p><p><br></p><p><br></p><p><span style="font-size: 11pt;"><strong>Admin Guides: </strong></span></p><ul><li><span style="font-size: 11pt;"><strong><a href="https://usehalo.com/haloitsm/guides/1862/" rel="noopener noreferrer" target="_blank">Self Service Portal</a></strong></span></li></ul><p><br></p><p><strong><span style="font-size: 14pt;">List of Menu Buttons<br></span></strong></p><p>Menu buttons allow you to build out the functionality of your Self Service Portal and compose of all the features end-users can interact with.</p><p><br></p><p><img data-fr-image-pasted="true" src="https://halo.haloservicedesk.com/api/attachment/image?token=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6IjgxMzAyZjcxLWNmZWUtNDk3YS04YjVjLTE2MzllNjkxMjQyMSJ9.vXlvAa3ipw9Mcq5AIA8Ke6cEoOBrj50oLHN9z-u4K3g" width="991" style="box-sizing: inherit; border-style: none; cursor: pointer; padding: 0px 1px; user-select: none; text-align: left; color: rgb(0, 0, 0); font-family: sans-serif; font-size: 14px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; white-space: normal; background-color: rgb(255, 255, 255); text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial; max-width: none !important; width: 993px; height: 562.568px;" id="isPasted" class="fr-fil fr-dib" height="563"></p><p><strong><span style="font-size: 10pt;">Fig 1. The Menu Buttons list configuration</span></strong></p><p><br></p><p><strong><span style="font-size: 14pt;">Creating Menu Buttons</span></strong></p><p>The menu buttons added in Configuration > Self Service Portal build out a 'Field List', which can be manipulated similar to <a href="https://halopsa.acadle.com/admin/course/service_desk_0serd/lesson/ticket_forms_jwldd">Ticket Field Lists</a>. </p><p>Adding a new menu button is as simple as clicking 'New' at the bottom of this list and selecting the function you would like to add. Menu Buttons can be dragged and dropped to change the order of them on the list</p><p><img src="https://halo.haloservicedesk.com/api/attachment/image?token=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6IjQ5ZmU0N2U0LTJjYWMtNDFkNC05Yjg4LWQwZmRkODZmMWNhMyJ9.M-VxRK6ZtUKlD0N_xQY3zDDP-2yjv-obQv-g6BzVP8w" class="fr-fic fr-fil fr-dib" width="638" height="148"></p><p><strong><span style="font-size: 10pt;">Fig 2. Hovering over a Menu Button and clicking on the icon to drag and drop it on the list</span></strong></p><p><img src="https://halo.haloservicedesk.com/api/attachment/image?token=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6ImY4NjA4MDc2LTExYmQtNDEyYy05MTdlLWFjZTkzYmJiNzY4OSJ9._zrAu2miwdd69lGcZUNkGWmoIxJiejVmo4YRi3wTGQ4" class="fr-fic fr-fil fr-dib" width="2"></p><p><br></p><p><img src="https://halo.haloservicedesk.com/api/attachment/image?token=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6IjMxYTAyYTJjLWVlOTktNDlkZi05MjIwLTZjMzZhMTg2ZWZkNSJ9.H0tNZOPr12-0OQU053S5gmIUKZ6g3ihq57ZCzicL9UY" class="fr-fic fr-fil fr-dib" width="684" height="429"></p><p><strong><span style="font-size: 10pt;">Fig 3. The new button function selection when adding to the Menu Buttons List</span></strong></p><p><br></p><p><strong><span style="font-size: 14pt;">Customising Edit Buttons</span></strong></p><p>When editing a menu button (clicking the pencil on the right hand side), you will be presented with the following options:</p><p><br></p><p><img src="https://halo.haloservicedesk.com/api/attachment/image?token=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6IjU5MTM1ZWI5LTNkMTYtNGRhMS1hZWQwLWZjMGYzM2E1MzhmNCJ9.7Jj5CIKbaA21Bxo-5lv8rqGJ0Z1YowYDwZmnIOms9S0" class="fr-fic fr-fil fr-dib" width="632" height="1122"><img src="https://halo.haloservicedesk.com/api/attachment/image?token=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6IjM5MzAyNWJjLWU0ZTAtNGQ1Yi04ZTQyLTdkMDMwMGI4Y2UzOSJ9.M8Oh-2JW1w5Lz3oQwwXSlSat2e0fib3BR76kBwwBAAU" class="fr-fic fr-fil fr-dib" width="2"><img src="https://halo.haloservicedesk.com/api/attachment/image?token=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6IjJhMzgzMGJkLTg0NTItNGI5Ni1hYjk3LWRhNmRlZjY2N2ExOSJ9.59kdrCSABhUo-xSnwb3Zi6NM7iK0XOvAdUClMEfpQxg" class="fr-fic fr-fil fr-dib" width="657" height="728"></p><p><strong><span style="font-size: 10pt;">Fig 4. Menu button edit screen</span></strong></p><p><br></p><ul><li><strong>Dashboard button restriction </strong>- Allows you to set whether or not an end-user needs to log in to access this feature. If you were to disable 'Require Users to login to access the portal' then you could set modular access per menu button via this option.</li><li><strong>Override default name, hint and icon</strong> - Default options for these entities are provided but can be overridden via enabling this setting, you would then find the below options to input your own preferences.</li><li><strong>Icon Colour</strong> - Set the background colour for the icon displayed on your menu button:</li></ul><p><img src="https://halo.haloservicedesk.com/api/attachment/image?token=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6IjRhODhmZDU0LWZmMDUtNGE1Yy1hY2FhLTBiNzJkMTE5OWQ4MyJ9.OzUe69Ps7xee-sNhO-5vdZSgduRDrWxsnQD4erWNKVI" class="fr-fic fr-fil fr-dib" width="975" style="width: 977px; height: 354.659px;" height="355"><strong><span style="font-size: 10pt;">Fig 4. Example of modifying the 'My Invoices' menu button icon colour</span></strong></p><p><br></p><p><strong><span style="font-size: 14pt;">Show on Navigation Bar Setting</span></strong></p><ul><li><strong>Show on Home Screen/Navigation Bar</strong> - Showing menu buttons on the home screen displays them as shown in <strong>Fig 4</strong>, while displaying menu buttons on the navigation bar display them along the top portion of the screen:</li></ul><p><img src="https://halo.haloservicedesk.com/api/attachment/image?token=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6IjA0NzY3YWFlLTE4MzYtNDA1Yi1hOTZjLTM1MjhjNTZmMWJkMCJ9.O8e0RruHgcqcbnGbu3qQM7TzyvXRtr1N0eoQwfzUd1A" class="fr-fic fr-fil fr-dib" width="2"></p><p><img src="https://halo.haloservicedesk.com/api/attachment/image?token=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6Ijk0ZDE2NjBlLWViZDgtNDI2OS1iNDU4LWVmOGEzN2FhNWIxMyJ9.UzausWnPb65oKsQBmphLY_IuUuVeMjfuJDtYzb-mTdQ" class="fr-fic fr-fil fr-dib" width="995" style="width: 997px; height: 72.7362px;" height="73"></p><p><strong><span style="font-size: 10pt;">Fig 5. The Navigation Bar (Checkbox on for "Show on Navigation Bar")</span></strong></p><p><br></p><p>The navigation bar will be available from any page within the Self-Service portal, so should only include options that you want your end-users to quickly access at any time.</p><p><br></p><ul><li><strong>Preview screen when logging (Service catalogue button only)</strong> - When set to 'show' will show a preview screen with the service page description, 'request service' button must then be used before the user is prompted to complete the ticket fields. This can be set here globally for all services, but can be overridden for each service under the configuration for that service. </li></ul>
