Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: Published by Scroll Versions from space TDDM and version 1

With the release of Totara 13, for site admins and tenant domain managersSite Administrators and Tenant Domain Managers, we introduced a new way of managing theme settings. These settings are tenant aware and can be customized on an individual tenant level.

...

If there is a category or property that you want to allow to be updated by a tenant then the server/lib/classes/hook/tenant_customizable_theme_settings.php hook can be used to extend this list of categories and/or properties.You can specify a '*'  to indicate that all properties in that category are allowed to be updated for a tenant.

The array entries must have the following format:

  • key: Name of the category. This name is usually the name given to a tab like 'brand' or 'images'. In most situations it matches the name given to the tab in the corresponding Vue file.
  • value: Asterix (*) or an array of setting names. An asterix (*) indicates all settings and if an array is specified then only those settings mentioned in the array will be available to be updated for a tenant.

Example

Code Block
languagephp
$settings = [
	'category_1' => '*', // All settings in the 'category_a' category will be available for a tenant.
	'category_2' => ['c2_field_1', 'c2_field_2', 'c2_field_3'], // All other fields, not mentioned in this list, in the 'category_b' category will not be available for a tenant.
	'category_3' => ['c3_field_1'], // Only 'c3_field_1' in the 'category_3' category will be available for a tenant.
];


If we examine the example theme's watcher then we notice that in the following code snippet we have a category named 'example_file' and we allow all fields in that category to be customized for a tenant:

Code Block
languagephp
public static function customize_tenant_category_settings(tenant_customizable_theme_settings_hook $hook) {
	$settings = $hook->get_customizable_settings();

    // Add our example file tab.
    $settings['example_file'] = '*';

    $hook->set_customizable_settings($settings);
}

The category 'example_file' matches the name we gave the tab we introduced in the ThemeSettings.vue override, see line 18 below:

Code Block
languagejs
linenumberstrue
<!--
	Lets add a new tab with a file example, the file will refer to
    the example file we created under the theme directory.
-->
<Tab
	v-if="embeddedFormData.formFieldData.example_file"
    :id="'themesettings-tab-5'"
    :name="$str('tab_example_file', 'theme_example')"
    :always-render="true"
    :disabled="!customCSSEnabled"
>
	<SettingsFormExampleFile
    	:saved-form-field-data="embeddedFormData.formFieldData.example_file"
    	:file-form-field-data="embeddedFormData.fileData"
        :is-saving="isSaving"
        :selected-tenant-id="selectedTenantId"
        :customizable-tenant-settings="
        	customizableTenantCategorySettings('example_file')
        "
        @mounted="setInitialTenantCategoryValues"
        @submit="submit"
	/>
</Tab>

Controlling what properties should be added to the stylesheets 
Anchor
properties_stylesheet
properties_stylesheet

...

  • '*' - indicates that all properties in the category are treated as CSS variables
  • [] - an array of properties that are CSS variables that need to be included in the stylesheet

Example

Code Block
languagephp
$css_settings_categories = [
	'category_1' => '*',
    'category_2' => [
    	'property_name_1' => ['transform' => false],
		'property_name_2' => [],
    ],
];

...