Ventura theme settings
  • 01 Jul 2024
  • 7 minutes to read

Ventura theme settings


Article summary

You can configure the Ventura theme by navigating to Quick-access menu > Appearance > Themes > Ventura.

We recommend using the Ventura Cloud theme, as it includes a number of improvements over the Ventura theme.

Site theme

With the Ventura theme selected you can configure the following settings.

SettingDescriptionNotes

Brand

Logo

Upload an image to be used as your site's logo in the main navigation.

-

Logo alternative text

Add the name of the site to function as a text alternative to the logo image. This is recommended to make your site more accessible.

-

Favicon

Here you can upload a small icon which will display in the browser tab next to the page name. The favicon allows users to see which site is open in the tab at a glance.

The favicon image should be 16 x 16 px and in the .ico format.

Email notifications

HTML headerAdd custom HTML to brand the header of email notifications.

Note that the brand colour used in email notifications is set by the Accent colour setting.

Multi-language content is not supported.

HTML footerAdd custom HTML to brand the footer of email notifications.

Note that the brand colour used in email notifications is set by the Accent colour setting.

Multi-language content is not supported.

Plain-text footerAdd standard text that will appear in plain-text email notifications, such as legal disclaimers or contact details.
-
Test email notificationUse this button to send a test email notification to see how your changes look.
-

Colour

Primary colour

Use the colour picker or enter a hex code for the colour you want to use for the interactive elements of your site, e.g. hyperlinks and buttons.

-

Use overriding colours

If you want to configure the colour of interactive elements in more detail you can enable this setting. With Use overriding colours enabled you can set the following colours individually:

  • Primary button colour: Select the fill colour of buttons
  • Secondary button colour: Select the outline and text colour of buttons
  • Link colour: Select the colour of all hyperlinks on your site

-

Accent colour

Set the colour of non-interactive elements, such as the tab highlight line and card outlines.

The accent colour determines the colour used in email notifications.

Header background colour

Set the background colour of the main navigation bar at the top of the page.

This setting can be accessed by expanding the More colours section.

Header text colour

Set the text colour on the main navigation bar at the top of the page.

This setting can be accessed by expanding the More colours section.

Page text colour

Set the colour of text on the site.

This setting can be accessed by expanding the More colours section.

Footer background colour

Set the background colour of the site footer.

This setting can be accessed by expanding the More colours section.

Footer text colour

Set the colour of text in the site footer.

This setting can be accessed by expanding the More colours section.

Images

Core: Display login page image

Enable this setting to display an image of your choice on your site's login page. You will need to upload an image for the Login page background setting.

-

Core: Login page background

Upload an image to use as the background for your site's login page. The Display login page image setting must be enabled.

We recommend using a 1200px x 1200px image, as the image may be cropped depending on screen size. JPEG, PNG and SVG file formats are accepted, and PNG files are preferred for illustrative images. We recommend keeping the file size as small as possible (without sacrificing quality), with a minimum DPI of 150.

Learn: Course

Upload an image to change the default course image.

-

Learn: Program

Upload an image to change the default program image.

-

Learn: Certification

Upload an image to change the default certification image.

-

Engage: Resource

Upload an image to change the default resource image.

-

Engage: Workspace

Upload an image to change the default workspace image.

-

Custom styles

Custom CSS

Here you can enter CSS code to override the styles for specific site components.

Any CSS added here will be applied after all other styles.

Custom footer

Enter text to display in the site footer when this theme is used.

Text added to the footer is centre-aligned by default. You can also add HTML code to this section to customise the footer.

Tenant themes

If you are using Totara's multitenancy functionality have multiple tenants set up, you can choose to use the default site theme or create specific themes for each tenant.

To configure the default look and feel of the site click Edit site brand.

In the Tenant branding table you can see a list of all of the tenants on your site, along with their unique Tenant identifier. The Branding column indicates whether each tenant is using the default Site branding or its own Custom branding. To edit a tenant's theme, click the pencil icon () in the Actions column. 

When Custom tenant branding is enabled for a tenant, changes to the site branding will no longer be applied to the tenant. When custom branding is first enabled for a specific tenant the current site settings will be used as default for that tenant. If custom tenant branding is enabled, later disabled, and even enabled again, the tenant branding used will be the same as it would have been without disabling and re-enabling it, regardless of whether any changes were made to the site settings since enabling it the first time.

By default, each tenant will use the Site branding, but enabling the Custom tenant branding setting allows you to configure the following settings.

SettingDescriptionNotes

Brand

Logo

Upload an image to be used as the tenant's logo in the main navigation.

-

Logo alternative text

Add the name of the site to function as a text alternative to the logo image. This is recommended to make your site more accessible.

-

Favicon

Here you can upload a small icon which will display in the browser tab next to the page name. The favicon allows users to see which site is open in the tab at a glance.

The favicon image should be 16 x 16 px and in the .ico format.

Brand - email notifications

Header HTMLAdd custom HTML to brand the header of email notifications sent from the tenant. 

Note that the brand colour used in email notifications is set by the Accent colour setting.

Multi-language content is not supported.

Footer HTMLAdd custom HTML to brand the footer of email notifications sent from the tenant.

Note that the brand colour used in email notifications is set by the Accent colour setting.

Multi-language content is not supported.

Footer plain textAdd standard text that will appear in plain-text email notifications sent from the tenant, such as legal disclaimers or contact details.
-
Test email notificationUse this button to send a test email notification to see how your changes look.
-

Colour

Primary colour

Use the colour picker or enter a hex code for the colour you want to use for any interactive elements within the tenant, e.g. hyperlinks and buttons.

-

Use overriding colours

If you want to configure the colour of interactive elements in more detail you can enable this setting. With Use overriding colours enabled you can set the following colours individually:

  • Primary button colour: Select the fill colour of buttons
  • Secondary button colour: Select the outline and text colour of buttons
  • Link colour: Select the colour of all hyperlinks within the tenant

-

Accent colour

Set the colour of non-interactive elements, such as the tab highlight line and card outlines.

The accent colour determines the colour used in email notifications.

Header background colour

Set the background colour of the main navigation bar at the top of the page.

This setting can be accessed by expanding the More colours section.

Header text colour

Set the text colour on the main navigation bar at the top of the page.

This setting can be accessed by expanding the More colours section.

Page text colour

Set the colour of text on the site.

This setting can be accessed by expanding the More colours section.

Footer background colour

Set the background colour of the site footer.

This setting can be accessed by expanding the More colours section.

Footer text colour

Set the colour of text in the site footer.

This setting can be accessed by expanding the More colours section.

Images

Display login page image

Enable this setting to display an image of your choice on this tenant's login page. You will need to upload an image for the Login page background setting.

Note that this setting will only be available if you have enabled the Enable pre-login tenant themes setting (Quick-access menu > Tenants > Settings).

Login page background

Upload an image to use as the background for this tenant's login page. The Display login page image setting must be enabled.

Note that this setting will only be available if you have enabled the Enable pre-login tenant themes setting (Quick-access menu > Tenants > Settings).

We recommend using a 1200px x 1200px image, as the image may be cropped depending on screen size. JPEG, PNG and SVG file formats are accepted, and PNG files are preferred for illustrative images. We recommend keeping the file size as small as possible (without sacrificing quality), with a minimum DPI of 150.

Learn: CourseUpload an image to change the default course image for courses within the tenant.
-
Learn: ProgramUpload an image to change the default program image for programs within the tenant.
-
Learn: CertificationUpload an image to change the default certification image for certifications within the tenant.
-
Engage: ResourceUpload an image to change the default resource image for resources within the tenant.
-
Engage: WorkspaceUpload an image to change the default workspace image for workspaces within the tenant.
-

Custom

Custom footer

Enter text to display in the site footer when this theme is used.

Text added to the footer is centre-aligned by default. You can also add HTML code to this section to customise the footer.

© Copyright 2024 Totara Learning Solutions. All rights reserved.


Was this article helpful?

Changing your password will log you out immediately. Use the new password to log back in.
First name must have atleast 2 characters. Numbers and special characters are not allowed.
Last name must have atleast 1 characters. Numbers and special characters are not allowed.
Enter a valid email
Enter a valid password
Your profile has been successfully updated.