Tutor indigo theme customization

I have recently started working in OpenEdx and have no knowledge of it. Unitl now, i have successfully installed tutor 19.0.4 and enabled plugin indigo. Now i want to make changes in indigo theme and for that i visited lots of online documentation and also take help of chatgpt but no of them were helpful.
I request if anyone could guide me steps for how to add my customized code in tutor.
i had made changes by cloning indigo in my repository and making changes in the branch but those changes are not appearing.
i think i am doing something wrong while integrating it in tutor. Please give me step by step guidance how to succesfully load my branch directory .
i would be grateful for your help

@Vishal welcome!

I tagged your post with tutor-indigo which I’ve been told will get the attention of the Indigo maintainers. Let me know if you don’t hear back by next week.

Here are the high-level steps:

  • Clone Indigo
  • Make changes
  • make a local plugin index
  • add the local plugin index to tutor
  • activate the plugin
  • rebuild the openedx docker container

If you have more questions with specific steps, just ask again.

Kind regards Florian

Hi @FlorianOver, could you please write detail instructions for customizing theme based on Indigio?

Hi @regis I’ve been tagging posts with tutor-indigo as requested but I’m not actually getting any responses from the Indigo maintainers on these posts, is there a better way to get attention?

Hi @vuthehuyht
If it helps, then this is the methodology that I’ve been using to update my logo images and favicon files.
It is a little bit of a chore to have to go and manually update when I’m upgrading to a new release, there’s probably a better way to do it. I haven’t gone too deep into customisation outside of the logos so your mileage may vary.

3 Likes

Let me work with the team on that… I think they were not properly monitoring these topics (and there are many topics to keep track of).

In the meantime, the people that you should tag are the Indigo maintainers: @Ahmed_Khalid and @HammadYousaf01 .They will have the most context about Indigo.

1 Like

Hi @vuthehuyht and @Vishal
I managed to come up with something that you maybe find useful, please feel free to download/use/modify this to your heart’s content :slight_smile:
custom-indigo-branding.zip (16.3 KB)

Instructions:

  1. Start off with a default tutor-indigo.
  • If you’ve been using a fork, uninstall it.
  • Re-install the official version if needed:
tutor plugins install indigo
tutor plugins enable indigo
  1. Copy your custom-indigo-branding plugin into Tutor’s plugin directory:
~/.local/share/tutor-plugins/custom-indigo-branding
  1. Install the Python package in editable mode:
pip install -e ~/.local/share/tutor-plugins/custom-indigo-branding
  1. Verify Tutor sees it:
tutor plugins list

You should see custom_indigo_branding.

  1. Add or replace any files you want to override under:
custom-indigo-branding/custom_indigo_branding/templates/indigo/{lms,cms}/...

Make sure the paths mirror Indigo’s originals.

  1. Enable the plugin:
tutor plugins enable custom_indigo_branding
  1. Rebuild Open edX and restart:
tutor config save
tutor images build openedx
tutor local stop && tutor local start -d

Your new assets will now be copied into:

~/.local/share/tutor/env/build/openedx/themes/indigo/{lms,cms}/.../
  1. To update files in the future, just drop in new files in your plugin’s templates/indigo/... folder, then run:
tutor config save
tutor images build openedx
tutor local stop && tutor local start -d

With this method, you can keep using and upgrading the latest tutor-indigo, while your custombranding plugin (thanks to priority=HIGH in plugin.py) always ensures your files win over Indigo’s defaults.