Customize Courses and Lessons Using Custom CSS
Overview
This SOP outlines the step-by-step process to add a script or customize CSS in a specific course and lesson in Tevello. Customizing your lesson and course allows you to align them with your brand, enhancing the user experience and maintaining brand consistency.
Table of content
Customize Lessons
Customize Courses
Customize Lesson
Go to the Tevello app and select Courses.
![](https://storage.crisp.chat/users/helpdesk/website/e916a79d3dced000/01-setting_1olhmh4.png)
Select the course where you want to add the code.
![](https://storage.crisp.chat/users/helpdesk/website/e916a79d3dced000/02-select-the-course_mfwr1n.png)
Select a lesson or create a new one.
![](https://storage.crisp.chat/users/helpdesk/website/e916a79d3dced000/03-select-the-lesson_r3app.png)
In the lesson, click on the Add button, from the dropdown menu, click on Add HTML
![](https://storage.crisp.chat/users/helpdesk/website/e916a79d3dced000/04-select-html_9sy1vd.png)
In the HTML box, add the code.
![](https://storage.crisp.chat/users/helpdesk/website/e916a79d3dced000/05-add-script_1ruykno.png)
Click on Save.
![](https://storage.crisp.chat/users/helpdesk/website/e916a79d3dced000/06-save_17ezir9.png)
Customize Courses
Go to the Tevello app then select Settings.
![](https://storage.crisp.chat/users/helpdesk/website/e916a79d3dced000/01-settings_1wfxe25.png)
Under Design, you will see Custom CSS, paste the CSS code.
![](https://storage.crisp.chat/users/helpdesk/website/e916a79d3dced000/02-code_j64pqk.png)
Click on Save.
![](https://storage.crisp.chat/users/helpdesk/website/e916a79d3dced000/03-save_1vm4el1.png)
It usually takes about a minute or two to update since Shopify caches the custom CSS.
Updated on: 03/07/2024
Thank you!