Proposal for a Unified CSS Customization Interface in Open edX Courses – Seeking Existing Solutions

Greetings Open edX Community,

I’m reaching out to propose an enhancement and seek insights into existing solutions within the Open edX framework. Our current system allows for individual course customization through the upload of custom CSS files. This flexibility, however, often leads to a lack of uniformity in course design across the platform.

We are contemplating the introduction of a “Course Elements Palette” view, an interface offering a curated selection of standard HTML elements (like buttons, headers, etc.) with predefined CSS styles. Course editors can select from these options, aiming for a more cohesive look across courses.

Before delving into the development of this new feature, I want to inquire:

  • Does a similar view or feature currently exist within the Open edX ecosystem that allows for a standardized approach to CSS customization?
  • If such a feature exists, how might we adapt or improve it to meet our goal of achieving visual consistency while maintaining some level of customization flexibility?

The goals of this proposed feature include:

  1. Consistency: Establishing a uniform, professional appearance across all courses.
  2. Ease of Use: Simplifying the design process, especially for those with limited CSS knowledge.
  3. Maintainability: Facilitating easier updates and maintenance of styles platform-wide.

Your feedback is invaluable. I am particularly interested in hearing your thoughts on:

  • The types of elements that should be included in the “Course Elements Palette.”
  • Balancing customization with a consistent visual theme.
  • Challenges in implementing such a feature and potential solutions.

This discussion could reveal existing resources we can leverage, saving time and effort. I look forward to your insights and suggestions, as they are crucial for making this idea a reality.

Thank you for your time and input!

I don’t know of any course-specific CSS “templates” or “template managers” course authors can utilize. Things which are adjacent to this concept are paragon’s themeing and site themes within the platform. There could be some inspiration (design tokens, etc) that comes from paragon’s approaches here in particular I would talk to the paragon WG, if not for an existing solution, then for help building your own.

Thank you for your insights on Paragon’s theming and site themes. Although these are relevant, they primarily focus on platform-wide customization and require technical expertise. Our goal is to provide a simple way for non-technical course content editors to apply unique styles to their courses.

Based on our specific needs for course-specific customization, we are considering the possibility of developing an approach tailored to enable course-by-course styling. This would offer a more user-friendly interface for individual course customization.