Pluto LMS offers a custom CSS editor which enables you the ability to add your own CSS code to customize your LMS theme.
STEP 1: NAVIGATE TO THE EDITOR
Step 1.1: Click on "Site admin" > "Site branding":
Step 1.2: Then you select "Primary Theme Settings" under "Primary Branding"
Step 1.3: Click on "Custom CSS":
STEP 2: UNDERSTANDING CSS
CSS is a styling language used to customize your website appearance (style an HTML document). For more help on CSS, click here.
You may require a developer to implement CSS changes for you.
STEP 3: A BASIC EXAMPLE
Let's say you would like to change the colour of your course card background, you can use custom CSS to do this.
This is the standard Pluto LMS visual of a course card without any custom CSS applied:
Perhaps you would like a turquoise card background instead of white as shown above. Let's show you some basic steps to achieve this.
Step 3.1: You will need to go into inspect mode within a browser like Google Chrome:
Shortcut when on applicable browser page:
Windows and Linux: Ctrl+Shift+C
OR right click and then select "Inspect" on your browser page.
Step 3.2: Select the element of interest:
As we can see, the HTML class (learn more) for this element is "card-body". This class will need to be referenced when applying custom CSS.
Step 3.3: Enter your custom CSS code into the code editor as shown below:
Note: Additional ID and CLASS references were made in order to isolate the CSS target. In this example, we want to isolate the custom CSS to course cards only and not ALL card across your site. By referencing multiple parent IDs and CLASSES, this can be achieved.
This will then update your card-body background to turquoise as shown below:
OVERVIEW You can customize your site's logo, favicon, brand colour and much more by updating your primary (site) and secondary theme branding settings in Site admin. SITE BRANDING SETTINGS Click on "Site admin", followed by "Site branding", then ...
OVERVIEW In Site admin, site administrators can perform various tasks relating to the management and organization of user accounts, courses, site wide reports, integrations, branding and badges. The most important site admin actions when getting ...
SETUP CUSTOM DOMAIN Step 1: Click on "Site Admin", followed by "Site branding" and then "Setup custom domain." Step 2: Follow the prompts to make the request. Once you have submitted your request, you will receive an email with instructions needed ...
OVERVIEW The Custom Reports module allows you to create custom reports to supplement the native Pluto LMS reports. Note: This may require the assistance of a developer. CREATE A CUSTOM REPORT Step 1: Click on "Site admin", followed by "Site ...