Configuring the Essential Theme

moodleThe Essential theme is a responsive theme for Moodle.  This article describes some of the configurations that you might wish to implement.


To install the Essential Theme for Moodle, you need to start by downloading the compatible version of the Essential Theme for your Moodle site.

  1. Upload and extract the downloaded file to your /themes directory.
  2. Browse to your Moodle site.
  3. Install the Theme as you would any other Moodle module.


Remove the credit link

You might need to remove the link in the footer section. For this article I'm using the Essential theme version

  1. Open the /theme/essential/lib.php file for editing.
  2. Comment out line 234 (not required for version 3).
//  $customcss = str_replace('thecredit', 'themepagefooter', $customcss);


  1. Go to Site Administration > Appearance > Themes > Essential > General.
  2. Add the following line to the custom.css file.


#page-footer .thecredit{visibility:hidden; }

Version 3

#page-footer .themecredit { visibility: hidden; }

The credit link should now be gone.


Google Fonts

This theme allows you to use Google Fonts for Headings and main text.

  1. Start by browsing to Google Fonts, and choose the fonts you'd like to use.
  2. Click the Quick use button, for the font you like.
  3. Select the @import tab, to copy the CSS code for this font.
  4. On your Moodle site, go to Appearance > Themes > Essential > General.
  5. Paste the code into the Custom CSS text box.
  6. Don't forget to include the semi-colon.
  7. Go to Appearance > Themes > Essential > Font.
  8. Enter the exact font name for your Heading and Text fonts.



iOS Home Icons

When you create a shortcut on your iOS device, you might like your own glossy icon.  The theme has a feature of allowing uploading of these files, but I couldn't get it to work.  You can alternatively browse to the following directory and upload your own replacements with the following dimensions:

  • iphone.png 57px x 57px
  • iphone_retina.png 114px x 114px
  • ipad.png 72px x 72px
  • ipad_retina 144px x 144px



  1. Download the latest version of Essential.
  2. Ensure you have the correct version of Moodle. This is essential as the theme relies on underlying core code.
  3. Put Moodle in Maintenance Mode.
  4. Make a backup of your old /theme/essential folder and then delete the folder.
  5. Copy the newly extracted essential folder to /theme/.
  6. Go to Site administration > Notifications and follow the plugin update notification.
  7. If automatic Purge all caches appears not to work by lack of display etc. then perform a manual Purge all caches under Home > Site administration > Development > Purge all caches.
  8. Put Moodle out of Maintenance Mode.


Thanks for visiting.