Adapt Learning Community: Authoring tool customisation changes

Skip to main content

Hi all I am using the AUTHORING_TOOL.

I wanted to change some colours and widths etc so I went to

"C:\adapt_authoring\adapt_framework\src\theme\adapt-contrib-vanilla\less\variables.less" and changed some values for primary colour etc.

But now no matter what I do I cannot get them to show up. I try all sorts of grunt build in all locations and also running a new node server but nothing seems to make them show up. I think maybe a lot of talk on here is for the raw framework and I'm getting confused as to how to customise things in the interfaced authoring_tool?

Can anyone assist?

Thank you!

Helen

Hi Helen,

A better approach would be as follows:

Make a copy of the vanilla theme, change the name and displayName in bower.json and package.json to something new.
Make your LESS variable change, save everything and zip up the folder.
Use Plugin Management > Upload Plugins menu option to upload this zip file.
If your new theme has uploaded successfully go to your course and select your new menu from Menu Picker when editing.
Hit Preview/Publish.

The build is actually run from the /temp/{tenantId{/adapt_framework folder. Following the steps above will deploy your theme to this location.

Regards,

Brian

Show parent | Reply

Brian,

Seems much more straightforward! Thank you I'll go give that a try :)

*edit* Ohmyword it WORKED! Between yourseld and Aniket I have finally cracked customising my course. Thank you all so much for your help I can get on with my project now!!!

Helen

Show parent | Reply

Brian - one more query.

When I make a second change, zip up and try to upload I get the message cannot upload plugin - already exists! What do I need to do to ensure I can upload it again?

* EDIT* nevermind - if I delete the new theme folder first and run the Upload Plugin, even though i get an error it does update the file, I just need to go in and pick it again in the Theme Picker before previewing.

Thanks

Helen

Show parent | Reply

Brian,

I tried out these steps you listed, but I get an error message that says something like "Error: failed to upload plugin."

I modified a theme in the Adapt Framework, and was trying to import it into the Authoring Tool (following the steps above). Is that the correct way of going about it? Or should I be making a copy of the vanilla theme in the Authoring Tool source code itself, and then upload it via the plugin manager?

Are there any troubleshooting tips you might have? I haven't been able to find any explicit instructions on installing/removing themes in the authoring tool. Are there any resources that you could recommend?

Michael

Show parent | Reply

Michael,

What I did :

1. Open yourfilelocation\adapt_authoring\temp\randomidhere\adapt_framework\src\theme folder
2. Make a copy of adapt-contrib-vanilla
3. Call the new folder adapt-contrib-yourthemename
4. immediately make a zip file of that folder
5. Go to the Upload plugin button and upload it
6. Go back to that folder in step 3 and make all your changes within that. You no longer need to keep the zip
7. Whenever you make a change to your new theme you may need to go and apply it to your course again in Theme Picker before you click Preview.

Hope I remembered it correctly and that it works - let us know if not.

Helen

Show parent | Reply

Micahel,

I forgot to mention that you need to change a couple of details of the files inside to make it work :

Please follow the info that Chuck has posted at :

https://github.com/adaptlearning/adapt_authoring/wiki/Modifying-the-Vanilla-Theme

to do what you want to do!

Helen

Two files must be updated: bower.json andpackage.json. At a minimum, the 'displayName' (bower.json) and the 'name' (package.json) must be changed to reflect your theme. However, it is a good time to update as much of these files as you can (e.g., "version": "0.0.1") Two files must be updated: bower.json andpackage.json. At a minimum, the 'displayName' (bower.json) and the 'name' (package.json) must be changed to reflect your theme. However, it is a good time to update as much of these files as you can (e.g., "version": "0.0.1")

Show parent | Reply

Yes, the questions and answers in this thread made it easy to write up a wiki page so more people could benefit from your experience. (Thanks for sharing!)

Modifying the Vanilla Theme is a technique written for use with the Adapt authoring tool. Because building plug-ins is a task associated with developers, it is linked in the sidebar topic Developer's Guide: Themes.

Show parent | Reply

Chuck and Helen,

Thank you so much for the help! I was able to successfully upload it following these guidelines.

As for the file compression on a Mac, is there a recommended work-around? I have a virtual installation of Windows on my computer, and was able to compress the folder with that. But if there is an alternate method, that would be somewhat easier.

Michael

Show parent | Reply

Michael,

I use a Mac as well and found that creating a zip file from the terminal works.

Example:

cd /path/to/theme/folder

zip -r custom_theme.zip my_custom_theme

This will create a the 'custom_theme.zip' file that you can then upload without encountering the compression method issue.

Chris

Show parent | Reply

Works for me! Great. I'll update the wiki. Thank you very much for your contribution, Chris.

Show parent | Reply

Great! Thanks for finding the solution, Chris. That makes life easier.

Show parent | Reply

I'm getting an error here while following the methods above. When I click 'upload' an alert says:

There was an error uploading the plugin.

cannot find module [Path to a temp folder]\1f95bc350d6bbde33f476b309f8aca31_unzipped\LICENSE\bower.json

It seems to be looking for a bower.json file within the LICENSE file as if the LICENSE file were a folder.

If i delete the LICENSE file it tries to look for bower.json inside README.md as if that is a folder.

This is while zipping the contents of the folder, if i try zipping the folder itself, then i get the error

'Unrecognised plugin type for package [filename]'

I get the same results using either 7zip or windows' send to compressed folder function

Show parent | Reply

Hi Gavin,

You need to zip the theme from the outside, so you get an extra level in the folder structure. Can you confirm that you've zipped the files in the following way:

folder.zip/

- theme root folder/

- assets/

- fonts/

... etc.

Rather than:

folder.zip/

- assets/

- fonts/

... etc.

This is related to an issue we're currently looking at, see here: https://github.com/adaptlearning/adapt_authoring/issues/706

Show parent | Reply

Chuck, your wiki has 1 problem. it does not tell us how to make these changes.

when you make a new theme you need to fiddle around with the settings somewhat.
So you do not want to have to upload a new plugin, to see every small change. It would be best if you can try the changes on your course before you do that.

Helen has described a work around by editing the theme in the tenants folder and reapplying it, but that is not advised.

can you make a wiki on how to do this without the need to constantly upload a new plugin?

Show parent | Reply

Hi Sander,

I completely agree with you: I don't want to upload a new version to see every small change. That gets old real quickly. My experience tells me that most theme development is done using the Adapt framework. With grunt commands such as 'dev', it can handle the iterative process much more effectively. Maybe some who are modifying themes within the authoring tool can share other techniques.

Sounds like Helen's technique is similar to the one Greg discusses in this thread: https://community.adaptlearning.org/mod/forum/discuss.php?d=502#p2435 Hone in on what Greg describes in relation to the "2." location and what Dennis Heaney says in his response.

You should be able to preview your changes with this technique, but I'm not of the opinion that it belongs in the wiki. What you want to see happen within the authoring tool IMO is a reasonable expectation. But the tool is young--first official public release in April 2015 (and it was a minor version release at that). More flexibility with theming will come as the tool matures, but it's just not there yet. Putting this technique in the wiki makes it seem like it is the process intended by the core developers.

The vanilla theme is being overhauled as part of the v2.0 release. With its release you can expect some more documented insights into working with themes; but, Sander, it will focus on using the theme with the framework not the authoring tool (reference once again Dennis Heaney's comments). Currently energy is being spent trying to document how to work with the new theme, not the one that will be "replaced". Not that this is necessarily convenient for someone who is working with the current version; but, I hope, somewhat understandable.

Chuck

Show parent | Reply

Sander,

Acknowledging that I just noticed you had posted on https://community.adaptlearning.org/mod/forum/discuss.php?d=502 and so are aware of its contents. Sorry for not seeing that earlier.

Chuck

Show parent | Reply

Chuck, that is completely OK.

I am happy with your answers, and understand the development that is still going on. My problem is more with the documentation at this point. but on the other hand, their should be some thought on how to develop themes. we have agreed in our company to use the builder to create the courses, but since the look and feel of the course is so much intertwined with the theme, it is very hard to develop this.

As far as I know, a course created in the builder can not be edited by using the framework methods (as described in the documentation at least) and the builder can not be used to edit the theme. this means that when you develop the theme, you can not access your content (articles, blocks, components etc). so now people are understandably using workarounds, which only work if you have access to the files. but our builder tool is located on a webserver, to which we do not have direct access.

Yes off course this is all due to the immaturity of the tool, and it will be better. but hopefully you can see this as a usecase.

regards

sander

Show parent | Reply

Hi Helen,

The bower.json file is the only config file that's used by the authoring tool when uploading plugins, so you should only need to make sure that the following fields are updated when creating a new theme:

name
version
displayName
theme

Show parent | Reply