1. Help
  2. Using the System
  3. Self-Service Portal
  4. Self Service Design v2 Fields
Close modal icon featuring an X formed by two crossed lines.
  1. Help
  2. Using the System
  3. Self-Service Portal
  4. Self Service Design v2 Fields
purple icon for coordination.
We’ve moved!
Our Help Center has a new home and our URLs have changed. Please update your bookmark to this page before April 30, 2026

Self Service Design v2 Fields

Self Service Design v2 fields control HTML and CSS customization options.

The table below lists the fields of the Self Service Design form and provides utilization guidelines for each field.

Field Label Utilization Guideline
Use design of directory account

The Use design of directory account box is available only in support domain accounts. It is checked when the self service design of the support domain account's directory account is to be used when users access the self-service portal of the support domain account. When checked, the self service design of the support domain account is ignored.

HTML

The HTML field on the HTML tab is used to maintain the HTML code of the self-service pages. It can be used to control the Header, Navigation, Homepage, and Footer of Xurrent Self Service. The HTML uses Liquid syntax for dynamic content.

The maintenance of code in this field is supported by a code editor that offers special shortcut keys.

CSS

The CSS field on the CSS tab is used to maintain the CSS code of the self service design. This CSS is applied to all parts of the self-service portal. CSS custom properties (variables) can be defined using the :host selector to control design tokens such as colors, font sizes, spacing, and border radii.

The maintenance of code in this field is supported by a code editor that offers special shortcut keys.

Fonts

The Fonts field on the Fonts tab is used to maintain the @font-face declarations that define the custom fonts available on the self-service portal. Font files can be referenced from the Xurrent CDN.

The maintenance of code in this field is supported by a code editor that offers special shortcut keys.

Global Settings
Self service homepage
Show chat widget

The Show chat widget toggle controls the visibility of Sera AI on the Self Service homepage. When checked, 'Talk to service desk' will be available to end users.

Self service subpages
Background color

The Background color field allows for selecting the background color on the subpages. Separate values can be set for light mode and dark mode.

Background image

The Background image field allows for selecting a background image to be displayed on the subpages.

Button color

The Button color field allows for selecting the main button color on the subpages. The text color will be adjusted automatically for readability based on the selection. Separate values can be set for light mode and dark mode.

Accent color

The Accent color field allows for selecting the color for selected icons, hover effects, and other subtle details to reflect the organization's brand style. Separate values can be set for light mode and dark mode.

Accessibility color

The Accessibility color field allows for selecting the color used for focus indicators and other accessibility-related visuals, ensuring that users with different needs can navigate the interface easily. Separate values can be set for light mode and dark mode.

Font

The Font field sets the font that is used on the Self Service subpages. Custom fonts defined in the Fonts tab will be available for selection.