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 |
---|
|
$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 |
---|
|
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 |
---|
language | js |
---|
linenumbers | true |
---|
|
<!--
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 |
---|
|
$css_settings_categories = [
'category_1' => '*',
'category_2' => [
'property_name_1' => ['transform' => false],
'property_name_2' => [],
],
]; |
...