generaledx

Enable and apply a custom theme

NOTE: We are in the process of modifying the file structure and configuration for many Bitnami stacks. On account of these changes, the file paths stated in this guide may change depending on whether your Bitnami stack uses native Linux system packages (Approach A), or if it is a self-contained installation (Approach B). To identify your Bitnami installation type and what approach to follow, run the command below:

 $ test ! -f "/opt/bitnami/common/bin/openssl" && echo "Approach A: Using system packages." || echo "Approach B: Self-contained installation."

The output of the command indicates which approach (A or B) is used by the installation, and will allow you to identify the paths, configuration and commands to use in this guide. Refer to the FAQ for more information on these changes.

In order to enable and apply custom themes for edX, you need to follow these steps in the sequence shown:

Enable a custom theme

  • Place your theme in the /opt/bitnami/edx/var/themes/edx-platform directory (example).

  • To enable a custom theme, open the LMS and/or Studio CMS configuration files, set ENABLE_COMPREHENSIVE_THEMING to True and COMPREHENSIVE_THEME_DIRS to the absolute path of the directory where the theme was stored.

    NOTE: Depending on your installation type, the LMS and Studio CMS configuration files will be located in the following paths, respectively:

    • Approach A (Bitnami installations using system packages): /opt/bitnami/edx/etc/lms.yml and /opt/bitnami/edx/etc/studio.yml.

    • Approach B (Self-contained Bitnami installations): /opt/bitnami/apps/edx/conf/lms.yml and /opt/bitnami/apps/edx/conf/cms.yml.

Example settings for an edX theme

Custom theme folder structure

Themes should have the following folder structure:

-/opt/bitnami/apps/edx/var/themes
  |-my-custom-theme/
    |-cms/
      |-static/
      |-templates/
    |-lms/
      |-static/
      |-templates/

Custom theme configuration

The lms.yml and cms.yml configuration files should contain the following:

COMPREHENSIVE_THEME_DIRS:
- /path/to/edx-platform/themes
- /opt/bitnami/edx/var/themes/edx-platform
...
ENABLE_COMPREHENSIVE_THEMING: True

Apply a custom theme

  • Access the Django administration console. Check the Django Admin Console instructions for more information.

  • Browse to “Theming -> Site themes -> Add site theme”.

  • From the “Site menu”, select the site you want to apply a theme to.

  • Enter the identifier of the theme (same as its directory name) and click on “Save”.

    Add site and theme

    The theme will be enabled for the specified site as it shown below:

    Theme enabled

Build assets for a custom theme

  • Run the following command to update assets:

      $ sudo edxapp-update-assets
    

    NOTE: If the previous command throws edxapp-update-assets: command not found, execute the following commands instead:

    $ sudo edxapp-update-assets-lms
    $ sudo edxapp-update-assets-cms
    
  • Restart the Apache server:

      $ sudo /opt/bitnami/ctlscript.sh restart apache
    
Last modification November 10, 2021