Edx platform template modification

Tom Morten Berge

unread,

Feb 9, 2014, 6:36:22 PM2/9/14

to edx-...@googlegroups.com

Hi,

Just installed Edx on an EC2 instance today. And finally looks to be working. :) Looking really good!

I'm pretty new to this, but I have manged to setup a class. Now I was wondering if there is a way to change the EdX logo? Also is there a way to remove the demo course that is there, or atleast hide it?

Also there are some footer links (like job, press, faq), is there a way to modify/remove these?

So far I have been looking at the manual found here: http://edx.readthedocs.org/projects/ca/en/latest/read_me.html

Maybe the answers are in there, might just not have found them yet. If not, is there any other resources out there?

Thanks,

tom

Yarko Tymciurak

unread,

Feb 10, 2014, 4:06:36 AM2/10/14

to Tom Morten Berge, edx-...@googlegroups.com

On Sun, Feb 9, 2014 at 5:36 PM, Tom Morten Berge <tomb...@gmail.com> wrote:

Hi,

Just installed Edx on an EC2 instance today. And finally looks to be working. :) Looking really good!

I'm pretty new to this, but I have manged to setup a class. Now I was wondering if there is a way to change the EdX logo? Also is there a way to remove the demo course that is there, or atleast hide it?

Hi Tom -

Welcome to the fun!

For logo / skinning you might start by implementing / getting the Sanford-Online/edx-theme installed.

Do you want a lay of the land also, or just the nitty-gritty?

Lay of the land:

- assets are build with a pipeline of mako (templating engine), coffee[script], and sass (scss processor), and in a somewhat usual django manner, the static assets are collected and placed in one static area.

The "typical" way to hack / try it out is to replace files in the collected space - but this is fools-gold (things will get overridden);

The "quickie" way is to realize that mako, coffee, and sass include edx-platform in their build/search paths (so you could conceivably include a theme in the root of edx-platform for a quick try - but that will get overwritten by any "update" command, so that is a "quicky" - but doesn't buy you much.

The way to do this "for real" involves setting / overriding a couple of ansible variables -

THEME_ACCT: Stanford-Online # Theme repos
edxapp_use_custom_theme: true # false => to disable & use std. theme
```
edxapp_theme_name: stanford
```
edxapp_theme_source_repo: https://{{ COMMON_GIT_MIRROR }}/{{ THEME_ACCT }}/edx-theme.git
edxapp_theme_version: master

Right now, in a fullstack / deployment, the extra variable which are passed on to ansible are in server-vars.yml, which update reads.

You can add the above items to /edx/var/edx_ansible/server-vars.yml and run "update edx-platform" I think you should pull this all in - you can check by looking for the theme in /edx/app/edxapp/themes (which should be created, and contain "stanford").

At the moment (as of last Thursday) I can share these two things from my experience:

regarding the edx-platform relase-2014-02-05 release, one item from the edx-theme (Stanford's) was not showing (I don't think this is a terribly huge deal; I have raised the issue on the edx-theme repo, even though the fix may be on edx-platform, or... TBD).
the required variables / env settings which django sees are not being passed on correctly to rake tasks;

if you add the small changes to 2 files in https://github.com/edx/edx-platform/pull/2387 this should help you (and not otherwise adversly impact anything);
#2387 is either short-lived, or temporary, as paver is in the wings to replace rake, so I will need to test the equivalent in the paver pull request;
this method (see https://gist.github.com/yarko/8818633) works for devstack / vagrant development, so ideally you will create one build_version.yml file which you develop in devstack, test in fullstack, and use in deployment. For that to work, update will need a rewrite (I'm working on my take on that this week, along with the related pulls)

The good news:

You will be able to manipulate and develop a build_version.yml spec which definitively defines your box, which you can version, and inspect on your deployment.

RIght now, for the vagrant bring-ups, one issue is specifying the configuration version also. My current thought is that for devstack, the shell script provisioner which runs on the VM will be better served with a simply python script replacement, which can parse your build_version.yml file and provision with the configuration version you intend. This will be sweet. And require testing. And result in a completely spec'd build.

Let me know if / how this works (or if you find something simpler / easier / better).

Regards,

Yarko

Yarko Tymciurak

unread,

Feb 10, 2014, 1:04:23 PM2/10/14

to edx-...@googlegroups.com, Tom Morten Berge

The good news is - looking at https://github.com/edx/edx-platform/pull/2520, the paver update appears to check for existence of a *.env.json file - so, indirectly, checking that SERVICE_VARIANT is set to at least a default (lms or cms).

The bad news: I'm now slogging thru all the places in configuration / edx-platform which set SERVICE_VARIANT to figure out [1] from what context, and [2] to try and grok if a default is ensured by each path thru the configuration.

On Monday, February 10, 2014 3:06:36 AM UTC-6, Yarko Tymciurak wrote:

Tom Morten Berge

unread,

Feb 10, 2014, 2:32:11 PM2/10/14

to edx-...@googlegroups.com, Tom Morten Berge

Hi,

Thanks for all your help so far.

I got the standford theme pulled in and loaded. got abit lost after that :)

So is it safe to start changing the html and css? What will happen if I pull again later on? will my changes be overwritten? Would it be safe to copy this theme to "mytheme" and then load it as a custom theme?

Alot of noob questions I guess, but trying to learn :)

Yarko Tymciurak

unread,

Feb 10, 2014, 3:49:37 PM2/10/14

to Tom Morten Berge, edx-...@googlegroups.com

Sorry. Forgot reply-all

On Feb 10, 2014 1:56 PM, "Yarko Tymciurak" wrote:

>
>
> On Feb 10, 2014 1:32 PM, "Tom Morten Berge" wrote:
> >
> > Hi,
> >

> > Thanks for all your help so far.
> > I got the standford theme pulled in and loaded. got abit lost after that :)
>

> If by loaded, you mean you fired up lms, and saw the Stanford theme - great!
>
> You can check it visually against http:/online.Stanford.edu (I'm on mobile, so I think that's the URL; plus I think Stanford changes specific details on their deploy). On current edx-platform, I was not seeing the background image - but these things get fixed up quickly. (see https://github.com/Stanford-Online/edx-theme/issues/3 for details).

>
> > So is it safe to start changing the html and css? What will happen if I pull again later on? will my changes be overwritten? Would it be safe to copy this theme to "mytheme" and then load it as a custom theme?
>

> So, once you have the basics looking right, it means you've nailed the edx configuration for theming basics.
>
> Next steps:
> Fork Stanford-Online/edx-theme to your own repo, and perhaps create a development branch.
>
> Before you change any theme code, you can check your fork+branch which you're now working off of:
>
> Change the appropriate variables in the ansible extra vars which you (for now) copied into server-vars.yml
>
> E.g. change THEME_ACCT to your github acct, and the version to your branch name.
>
> You might as well change the theme name - this should just change the name of where it gets pulled into under /edx/app/edxapp/themes
>
> Do another update and check the themes directory for evidence, and bring 'er up!
>
> If all well, start making changes.

>
> > Alot of noob questions I guess, but trying to learn :)
> >
>

> No worries - no one has done any more than hack in the themes to date, I think (save Stanford, and MIT).
>
> We, the independent edx devs, are just trying to get this into place.
>
> Welcome,and let's have lots of fun!
>
> - Yarko

Yarko Tymciurak

unread,

Feb 10, 2014, 3:50:57 PM2/10/14

to Tom Morten Berge, edx-...@googlegroups.com

Sorry - forgot reply-all.

On Feb 10, 2014 2:06 PM, "Yarko Tymciurak" wrote:
>
> The thing to remember:
>
> You want to change the *.scss (or *.scss.mako), files, as these get processed by rake (soon to be paver) commands.
>
> For the HTML, you want to update mako templates (*.HTML files in the templates directory). If you want to update templates which are in edx-platform, copy those to your theme and change them there.

>
> On Feb 10, 2014 1:56 PM, "Yarko Tymciurak" wrote:
>>
>>

>> On Feb 10, 2014 1:32 PM, "Tom Morten Berge" wrote:
>> >
>> > Hi,
>> >

>> > Thanks for all your help so far.
>> > I got the standford theme pulled in and loaded. got abit lost after that :)
>>

>> If by loaded, you mean you fired up lms, and saw the Stanford theme - great!
>>
>> You can check it visually against http:/online.Stanford.edu (I'm on mobile, so I think that's the URL; plus I think Stanford changes specific details on their deploy). On current edx-platform, I was not seeing the background image - but these things get fixed up quickly. (see https://github.com/Stanford-Online/edx-theme/issues/3 for details).
>>

>> > So is it safe to start changing the html and css? What will happen if I pull again later on? will my changes be overwritten? Would it be safe to copy this theme to "mytheme" and then load it as a custom theme?
>>

>> So, once you have the basics looking right, it means you've nailed the edx configuration for theming basics.
>>
>> Next steps:
>> Fork Stanford-Online/edx-theme to your own repo, and perhaps create a development branch.
>>
>> Before you change any theme code, you can check your fork+branch which you're now working off of:
>>
>> Change the appropriate variables in the ansible extra vars which you (for now) copied into server-vars.yml
>>
>> E.g. change THEME_ACCT to your github acct, and the version to your branch name.
>>
>> You might as well change the theme name - this should just change the name of where it gets pulled into under /edx/app/edxapp/themes
>>
>> Do another update and check the themes directory for evidence, and bring 'er up!
>>
>> If all well, start making changes.
>>

>> > Alot of noob questions I guess, but trying to learn :)
>> >
>>

>> No worries - no one has done any more than hack in the themes to date, I think (save Stanford, and MIT).
>>
>> We, the independent edx devs, are just trying to get this into place.
>>
>> Welcome,and let's have lots of fun!
>>
>> - Yarko
>>
>> >
>> >

Tom Morten Berge

unread,

Feb 10, 2014, 4:53:48 PM2/10/14

to edx-...@googlegroups.com, Tom Morten Berge

Hi,

One step done, one step fail :)

so I deleted the stanford folder under themes, then forked https://github.com/Stanford-Online/edx-theme into my own github account.

Then clones it (no new branch, operating on master), so I have now a theme edx-theme under the themes direcotry. Then added https://github.com/Stanford-Online/edx-theme to my upstream, and checked in my git config file that origin points to my github.

In server-vars.yml, I now have the following:

THEME_ACCT: norsecode/edx-theme # Theme repos

edxapp_use_custom_theme: true # false => to disable & use std. theme

edxapp_theme_name: edx-theme

edxapp_theme_source_repo: https://{{ COMMON_GIT_MIRROR }}/{{ THEME_ACCT }}/edx-theme.git

edxapp_theme_version: master

This looks ok to me. Now I wanted to try the update script: /update edx-platform master

This step that fails is this: TASK: [edxapp | gather static assets with rake]

getting the following errors (seems to be related to the theme I tried to clone in form my fork)

failed: [localhost] => (item=lms) => {"changed": true, "cmd": "SERVICE_VARIANT=lms rake lms:gather_assets:aws ", "delta": "0:00:24.875345", "end": "2014-02-10 21:34:05.029888", "item": "lms", "rc": 1, "start": "2014-02-10 21:33:40.154543"}

stderr: mkdir -p /edx/app/edxapp/edx-platform/.ws_migrations_complete

./manage.py lms --settings aws preprocess_assets --traceback

xmodule_assets common/static/xmodule

2014-02-10 16:33:43,791 INFO 4812 [dd.dogapi] dog_stats_api.py:66 - Initializing dog api to use statsd: localhost, 8125

node_modules/.bin/coffee --compile `find lms/ cms/ common/ -type f -name *.coffee`

sass --style compressed --cache-location /tmp/sass-cache --load-path ./common/static/sass /edx/app/edxapp/themes/edx-theme/static/sass --update -E utf-8 */static /edx/app/edxapp/themes/edx-theme/static/sass

rake aborted!

Command failed with status (1): [sass --style compressed --cache-location /...]

/edx/app/edxapp/.gem/gems/rake-10.0.4/lib/rake/file_utils.rb:53:in `block in create_shell_runner'

/edx/app/edxapp/.gem/gems/rake-10.0.4/lib/rake/file_utils.rb:45:in `call'

/edx/app/edxapp/.gem/gems/rake-10.0.4/lib/rake/file_utils.rb:45:in `sh'

/edx/app/edxapp/.gem/gems/rake-10.0.4/lib/rake/file_utils_ext.rb:37:in `sh'

/edx/app/edxapp/edx-platform/rakelib/assets.rake:87:in `block (3 levels) in <top (required)>'

/edx/app/edxapp/.gem/gems/rake-10.0.4/lib/rake/task.rb:246:in `call'

/edx/app/edxapp/.gem/gems/rake-10.0.4/lib/rake/task.rb:246:in `block in execute'

/edx/app/edxapp/.gem/gems/rake-10.0.4/lib/rake/task.rb:241:in `each'

/edx/app/edxapp/.gem/gems/rake-10.0.4/lib/rake/task.rb:241:in `execute'

/edx/app/edxapp/.gem/gems/rake-10.0.4/lib/rake/task.rb:184:in `block in invoke_with_call_chain'

/edx/app/edxapp/.gem/gems/rake-10.0.4/lib/rake/task.rb:177:in `invoke_with_call_chain'

/edx/app/edxapp/.gem/gems/rake-10.0.4/lib/rake/task.rb:215:in `block (2 levels) in invoke_prerequisites_concurrently'

/edx/app/edxapp/.gem/gems/rake-10.0.4/lib/rake/promise.rb:63:in `call'

/edx/app/edxapp/.gem/gems/rake-10.0.4/lib/rake/promise.rb:63:in `chore'

/edx/app/edxapp/.gem/gems/rake-10.0.4/lib/rake/promise.rb:45:in `work'

/edx/app/edxapp/.gem/gems/rake-10.0.4/lib/rake/thread_pool.rb:103:in `process_queue_item'

/edx/app/edxapp/.gem/gems/rake-10.0.4/lib/rake/thread_pool.rb:117:in `block (2 levels) in start_thread'

Tasks: TOP => gather_assets => assets => assets:all => assets:sass

(See full trace by running task with --trace)

stdout: overwrite cms/static/sass/style-app-extend1.css

overwrite cms/static/sass/style-app.css

overwrite cms/static/sass/style-xmodule.css

error lms/static/sass/application-extend1.scss (Line 23: File to import not found or unreadable: edx-theme.

Load paths:

/edx/app/edxapp/edx-platform

/edx/app/edxapp/edx-platform/common/static/sass

/edx/app/edxapp/themes/edx-theme/static/sass

/edx/app/edxapp/edx-platform/cms/static

/edx/app/edxapp/edx-platform/common/static

/edx/app/edxapp/edx-platform/lms/static

/edx/app/edxapp/themes/edx-theme/static/sass)

error lms/static/sass/application-extend2.scss (Line 23: File to import not found or unreadable: edx-theme.

Load paths:

/edx/app/edxapp/edx-platform

/edx/app/edxapp/edx-platform/common/static/sass

/edx/app/edxapp/themes/edx-theme/static/sass

/edx/app/edxapp/edx-platform/cms/static

/edx/app/edxapp/edx-platform/common/static

/edx/app/edxapp/edx-platform/lms/static

/edx/app/edxapp/themes/edx-theme/static/sass)

error lms/static/sass/application.scss (Line 22: File to import not found or unreadable: edx-theme.

Load paths:

/edx/app/edxapp/edx-platform

/edx/app/edxapp/edx-platform/common/static/sass

/edx/app/edxapp/themes/edx-theme/static/sass

/edx/app/edxapp/edx-platform/cms/static

/edx/app/edxapp/edx-platform/common/static

/edx/app/edxapp/edx-platform/lms/static

/edx/app/edxapp/themes/edx-theme/static/sass)

error lms/static/sass/course.scss (Line 14: File to import not found or unreadable: edx-theme.

Load paths:

/edx/app/edxapp/edx-platform

/edx/app/edxapp/edx-platform/common/static/sass

/edx/app/edxapp/themes/edx-theme/static/sass

/edx/app/edxapp/edx-platform/cms/static

/edx/app/edxapp/edx-platform/common/static

/edx/app/edxapp/edx-platform/lms/static

/edx/app/edxapp/themes/edx-theme/static/sass)

overwrite lms/static/sass/ie.css

failed: [localhost] => (item=cms) => {"changed": true, "cmd": "SERVICE_VARIANT=cms rake cms:gather_assets:aws ", "delta": "0:00:17.682840", "end": "2014-02-10 21:34:23.155955", "item": "cms", "rc": 1, "start": "2014-02-10 21:34:05.473115"}

stderr: ./manage.py cms --settings aws preprocess_assets --traceback

xmodule_assets common/static/xmodule

2014-02-10 16:34:08,994 INFO 4895 [dd.dogapi] dog_stats_api.py:66 - Initializing dog api to use statsd: localhost, 8125