Configuration

Description

App uses the configuration property '_genesys.widgets.main'. App controls the Genesys Widgets product as a whole, handling themes, languages, and mobile devices.

Example

window._genesys.widgets = {

	main: {
		theme: 'dark',
		themes: {

			dark: 'cx-theme-dark',
			light: 'cx-theme-light',
			blue: 'cx-theme-blue',
			red: 'cx-theme-red'
		},
		lang: 'en',
		i18n: 'i18n.json',
		mobileMode: 'auto',
		mobileModeBreakpoint: 600,
		debug: true,
                downloadGoogleFont: true,
                googleFontUrl: 'https://apps.mypurecloud.com/webfonts/roboto.css',
		header: {'Authorization': 'value'},
		cookieOptions: {
			secure: true, 
			domain: 'genesys.com', 
			path: '/', 
			sameSite: 'Strict'
		}
	},
	onReady: function(){

		// Do something on Widgets ready
	}
}

Options

Name	Type	Description	Default	Required	Introduced / Updated
main.themes	object	An object list containing the CSS classname for each theme. The property names are used to select the theme in the 'theme' property, for example {dark:'cx-theme-dark', light:'cx-theme-light', 'red':'cx-theme-red', 'blue':'cx-theme-blue'}. Where 'dark' and 'light' are the built-in themes provided in Genesys Widgets and 'red' and 'blue' are example custom theme names you may create on your own. Note: It is not necessary to define the 'dark' and 'light' theme as shown in this example. It is included to help show how the formatting works. Whatever you put in this object will be merged with the default themes object internally.	{dark: 'cx-theme-dark', light: 'cx-theme-light'}	n/a
main.theme	string	Selects the theme to apply to Genesys Widgets from the 'themes' object. Uses the property name of the theme. for example using the example from 'themes' above, possible values for this could be 'dark', 'light', 'red', 'blue'.	dark	n/a
main.lang	string	Select the language to use from the 'i18n' language pack. Language codes are selected by the customer. Any language code format can be used as long as this property matches one of the language codes in your i18n language pack. For more information about localization, see localization.	en	n/a
main.i18n	URL string or JSON	Either a path to a remote i18n.json language pack file or an inline JSON language pack definition. For more information about language packs, see localization.	Default English language strings are built into each widget and are displayed by default. Defining this i18n language pack overrides the built-in strings.	n/a
main.header	object	An object containing a key value pair for the authorization header.	n/a	n/a	9.0.002.06
main.preload	array	(For use with lazy-loading only) A list of plugins you want pre-loaded at startup. You may want certain plugins, such as SideBar, to be shown on screen as soon as possible; to do so, you may add 'sidebar' to this preload plugins array so it will be loaded after Widgets starts up. The names you add to the list must match the first part of the plugin filename you wish to load. Example: 'sidebar' will load 'sidebar.min.js' from the 'plugins/' folder. All filenames are lowercase. Note: This preload array is intended for use when running widgets in lazy-loading mode. You may also use this to pre-load your own custom-made plugins.	none	When lazy loading Widgets
main.mobileMode	boolean/string	Mobile Mode setting. true = Force Mobile Mode on all devices. false = Disable Mobile Mode completely. 'auto' = Genesys Widgets Automatically switches between Mobile and Desktop Modes using the 'mobileModeBreakpoint' property and UserAgent detection.	auto	n/a
main.timeFormat	number/string	This sets the time format for the timestamps. It can be 12 or 24.	12	n/a
main.mobileModeBreakpoint	number	The breakpoint width in pixels where Genesys Widgets will switch to Mobile Mode. Breakpoint checked at startup only.	600	n/a
main.debug	boolean	Enable debug logging from the bus to appear in the browser console.	false	n/a
main.customStylesheetID	string	The HTML ID of a <style> tag that contains CSS overrides, custom themes, or other custom CSS intended for Genesys Widgets. On startup, Widgets will move this <style> tag to the end of the document so that 1:1 CSS class overrides apply correctly.	n/a	n/a
main.downloadGoogleFont	boolean	By default, Genesys Widgets downloads and uses the Google Font 'Roboto'. To disable this download, set this value to false.	true	n/a
main.googleFontUrl	string	The string used to refer the URL where the Google Fonts are hosted in Genesys Hosted Repository. You can configure one of the Genesys Hosted region font URLs specified here, Genesys Web Fonts. Note: This Option is only applicable when the downloadGoogleFont option is set to true.	https://apps.mypurecloud.com/webfonts/roboto.css	n/a	9.0.018.00
main.deploymentID	string	The string used to customize cookie names so that multiple Widgets deployments can run in the same domain.	n/a	n/a	9.0.006.02
main.cookieOptions	object	An object containing cookie attributes that applies globally to all Widgets. The following cookie attributes are supported: 1. 'secure' - Either true or false, indicating if the cookie transmission requires a secure protocol (https). 2. 'domain' - A string indicating a valid domain where the cookie should be visible. 3. 'path' - A string indicating the path where the cookie is visible. 4. 'expires' - Specifies the number of days, either from time of creation or from a date instance, until the cookie is to be removed. 5. 'sameSite' - This maps to the cookie SameSite attribute allowing the cookie to be restricted to a first-party or same-site context. It can take any of the supported values that SameSite attribute takes. 'domain' and 'path' can be used to make cookies compatible with environments that use a non FQDN URL, such as an intranet hostname. However, the domain should only be manually set in production if the automated values are causing problems. Otherwise, rely on the automated domain and path. Note: The values are automatically set by Widgets to support cross-sub-domain cookies. Modifying these options overrides the automated values and might break cross-sub-domain cookie support if not properly set. For usage, please refer to the above example.	{sameSite:'Strict'}	n/a	9.0.017.01
onReady	function	A callback function that is invoked when the Widgets are ready and initialized with the configuration provided.	none	n/a