How to Configure Portal Themes and Branding in the LMS

Summary

Learn how to customize the LMS portal appearance using predefined or custom themes. This article explains how to set up colors, upload images, and configure custom branding to match your organization’s visual identity.

Introduction

This LMS feature enables admins to customize the portal's appearance by selecting from a variety of themes. The entire process is quick, taking just one minute within the LMS, and doesn’t require any design or development expertise. With ready-made patterns and a selection of themes, admins can easily change the interface to suit their brand book, enhancing the overall experience.

Requirements

List any conditions that must be met before following the steps.

✅ The user must have Admin permissions to modify interface settings.
✅ The Customization features must be enabled at the system level.
✅ Available themes and templates should already be configured in the LMS.

Steps to Follow

Step 1: Accessing Interface Settings

1. Log in to the LMS using an Super administrator account.

2. Navigate to the Portal Settings> Website branding> Portal Theme section.

Step 2: Selecting a Theme

1. Choose one of the available pre-installed themes under the “Portal theme”, such as "Default," "Kaleidoscope," "Impulse," "Dynamics" or “Custom”.

   

2. Once a theme is selected, the changes will be applied immediately, and you will see how they affect the appearance of the portal in real-time. A preview of the chosen colors (Primary, Secondary, and Footer), including the updated design and color scheme for key areas like the "Home" and "Sign In" pages (can be switch between each other by clicking on Home page and Sign in buttons in preview window) is instantly visible in the LMS interface. The Home page preview is scrollable, allowing you to explore and review how the settings are applied across the entire page, providing a comprehensive view of the new design.

   1. Switching color codes: The customizable color can be set in HEX format or switched to other codes, such as RGB, HSL, using the dropdown menu.

   2. Font Color: The text color is automatically adjusted for optimal contrast with the background.

1. The selected colors will be applied to some blocks on the homepage, buttons, and links.

2. After viewing the changes and, if everything suits you, save the settings.

Step 3: Custom Theme Configuration

1. If you want to create your own unique theme, select the "Custom" option from the list of themes.

1. An interface will open, allowing you to choose colors and other visual elements. On the screen, you can see several customization options which allows a user to select primary, secondary, and footer colors, Portal corner radius, Add image to the Background in “Featured Category“, “Sign In” Window and “App Banner” instead of a solid color, and use customized color for font in the “Featured Category“, “Sign in” Window, and “App Banner”.

Other Customizations

In Featured Categories section under Settings>Portal settings>General> Featured categories, a user can change the title and subtitle in all portal languages.

Once you have configured the theme to your satisfaction, review the preview to ensure everything looks as expected. The preview on the right side of the interface will allow you to see how the changes affect the portal's appearance in real-time. If everything is as expected, click "Save changes" to apply your custom theme settings across the portal.

Expected Result

After saving, the selected theme and customizations are applied immediately across the LMS portal.
Admins and users will see the updated branding on all main pages, including Home, Sign In, Learning Library, and Email Templates.

Troubleshooting