Setup to develop a custom theme in devstack

Development
1

Hi,

I have setup devstack on my laptop running windows 10 (using Docker Toolbox) and I want to use it to work on a custom theme. Currently, I can modify the scss files and see the changes just fine but not when I change the template files.

I initially tried to configure comprehensive theming using the lms.env.json files but it didn’t work

devstack_docker.py:
COMPREHENSIVE_THEME_DIRS = [

  • “/edx/app/edx-themes/edx.custom-theme/themes”,*
    ]
    DEFAULT_SITE_THEME = ‘custom-theme’
    ENABLE_COMPREHENSIVE_THEMING = True

After changing the files I run the following:
make lms-static
make lms-restart

And the CSS changes are reflected but not the html changes.

I’ve tried the same changes (e.g. changing index_overlay.html) on a native installation and it worked fine.

It’s probably something to do with my setup, I am looking for pointers on where to look to figure out what’s going on.

Thank you!

3 Likes
2

Hi @BbrSofiane,

Check official documentation to set theme.

1 Like
3

@jramnai Thanks for the reply!

I’ve gone through the official documentation before and I’ve used this theme as a starting point. I’ve also set the DEFAULT_SITE_THEME parameter to the theme I want (and the CSS is applied).

Is there anything else specific to devstack I should have a look at?

Thanks

4

You need to set it here:
(lms.env.json file is a directory above edx-platform so, you can reach there from lms-shell)

/edx/app/edxapp/lms.env.json

What you need to set:

“COMPREHENSIVE_THEME_DIRS”: [
“/edx/app/edxapp/edx-platform/themes”
],
“ENABLE_COMPREHENSIVE_THEMING”: true,
“DEFAULT_SITE_THEME”: “my-theme”,

Then make lms-stastic. No need to restart lms service AFAIK.

Also check this.

2 Likes
5

Hi

So I did the following:

  1. Set the parameters in /edx/app/edxapp/lms.env.json
  2. Change the ownership of the folder
  3. run make lms-static

But when running make lms-static, I notice the following in the output:

Skipping theme asset compilation: enable theming to process themed assets

When I check the file ownership:
image

And when I check the lms.env.json all the parameters as expected.
image

That’s why I started setting the parameters for comprehensive theming in devstack_docker.py. Any idea why the config change is not picked up? Or any idea where I could look to investigate further?

Thanks

6

So I found that to get the configuration right, I have to make the changes in /edx/etc/lms.yml!

Is this the intended method?

7

Are you on Ironwood release? I haven’t done theming on Ironwood release.

And you can check your settings in LMS shell:

make lms-shell
python manage.py lms shell --settings devstack_docker
from django.conf import settings
settings.DEFAULT_SITE_THEME

You can check any setting using this.

1 Like
8

Yes, I am using Ironwood (sorry I should have mentioned).

Thanks for the tip!

1 Like
9

Hi, can you explain what changes did you make in /edx/etc/lms.yml file?
Thanks

10

Hi,
I just made the changes that are described in the documentation for setting up and enabling comprehensive theming.

“COMPREHENSIVE_THEME_DIRS”: [
“/edx/app/edxapp/edx-platform/themes”
],
“ENABLE_COMPREHENSIVE_THEMING”: true,
“DEFAULT_SITE_THEME”: “my-theme”,
11

Do you mean to add these lines at the end of /edx/etc/lms.yml file? But lms service not works in that case!

12

No, I don’t add the lines at the end. These variables are already in the file, all I do is change their value (e.g. point to the right directory and use my real theme name).
And then I run:
make lms-restart

1 Like
13

Thanks a lot. It works for me.:slightly_smiling_face:

14

Thank you very much @BbrSofiane . I was stuck at this. I don’t know why devstack contributors are ignoring this major problem. Every article out there just ask to edit ‘lms.env.json’ file. But lms.yml file is the main culprit. I’ve wasted so much time in it. Just wanted to say Thank You, you should definitely write a blog post for devstack users.

15

For anyone having issues overriding a comprehensive theme template file on devstack plus look at this article. I ran into this issue and want others to be aware.

cc: @BbrSofiane

1 Like
16

please help i didnt resolve @akrami65 @mohit741