Want To Make The Best Moodle LMS Theme Ever? Its Creator Tells You How

538

Are you looking to get into, or up your theme development game? Consider Chris Kenniburg‘s invitation the ultimate challenge.

WIRIS

Developer of the “Fordson” theme, this top-tier Moodler from Michigan Dearborn Schools is sharing all his secrets. “Often I get asked, ‘How do I clone your theme?’ The thing is, ‘Fordson is kind of complicated.”

Step one: Struggle with outdated Moodle Documentation

Getting started is just the warm-up. The official documentation, available at docs.moodle.org, is outdated since Moodle 2.+. Kenniburg recommends you glance at it, then head straight to the “Recipe for the impatient” part of the document.

Locate or download the theme files

You will find Fordson, as well as almost every other free Moodle theme in active development, available for download as a ZIP file at either the Moodle Plugin Directory or their GitHub page, which you can often find on its Moodle page as “Source control URL” under Useful links. In “Fordson”‘s case:

In general, the GitHub source includes a couple added polishes to the latest directory update. In few exceptional cases, a new and untested feature might come along. So either is fine, but if you want to play extra safe download the Moodle directory version.

Unpack, find, rename

The theme’s name, in our case fordson , is set as the name of a few files and variables across documents, starting with the folder of the theme. Define the name for the new, cloned theme. In Kenniburg’s example, the new theme will be named fordson2 .

  • Rename the copied folder to fordson2
  • Open the fordson2folder. On the /lang/en/ subfolder, rename theme_fordson.php to theme_fordson2.php
  • Open the theme_fordson2.php find the following lines, replace Fordson for Fordson2 :
    • $string['configtitle'] = 'Fordson2';
    • $string['pluginname'] = 'Fordson2';
  • Save the theme_fordson2.php file.

Exhaustive search and replace

The process follows as previously, except across multiple files.

To avoid opening each one to do the operation, Kenniburg suggests using a text editor or IDE with folder-wide or multiple file “search and replace” features, such as Notepad++ (open source) or Sublime. UNIX-based system users can also accomplish the bulk search and replace task from the command line, as explained here.

The replacements to be performed are:

  • fordson for fordson2
  • theme_fordson for theme_fordson2 Technically this would be covered by the previous task unless you chose to replice entire words for safety reasons. Also make sure you don’t perform the replacement more than once, otherwise you’ll get a lot of fordson22s
  • fordson_lib.php for fordson2_lib.php (Same notes as above apply)
  • Fordson for Fordson2

The replacement here is complete. Kenniburg, however, adds a tip: If you want to see the existing “Fordson” theme along with your new clone, edit config.php and add a 2 to turn it into

if (page_location2_incourse_themeconfig()){

Install your new clone on your Moodle site

It is highly recommended that you try the installation on a testing or “development” version of your Moodle site first; and that you enable Debugging Mode.

Upload the full fordson2 folder on the theme folder of your Moodle testing site, and log onto it from a web browser. Moodle will detect any file changes and will direct your attention to it. If an error appears, there likely was some error in the replacement operation.

If all goes well, you’ll likely get a “Plugins check” screen listing the “Fordson2” theme and an “Upgrade Moodle database now” button. Click on the option. Moodle will take a few seconds and show a “Success” screen. Upon clicking on “Continue” a “New settings – Fordson2” page will appear before sending you back to the Moodle environment. Note that if you are cloning a different theme, the “New settings” page may not appear.

Turning on Debugging Mode will alert you of any inconsistencies or issues, such as those Kenniburg intentionally introduced in his video. In any case, if all goes well you will find an identical settings page with colors and images to fill out and save.

If the process went through, the last step is to enable your clone! Go to the “Theme selector” menu, available at Site administration → Appearance → Themes. Choose “Fordson2.” Congratulations! You’re now a Moodle theme cloner—future Moodle theme developer!


ecreators logoOur How To content is supported by: eCreators. Moodle for the enterprise, K12 and corporate. Australia and Singapore. To learn more about eCreators, click here.