Themes: Elegance

Maintained by Picture of Bas BrandsBas Brands
Elegance is a beautiful two column Moodle theme with robust functionality and lots of custom settings.
989 sites
49 fans
Current versions available: 4


  • Custom "Quick Links" and "Marketing" spots.
  • A Frontpage Carousel.
  • Custom "Front Page Content" and "Footer" content.
  • Custom Colors.
  • Custom log in screen with rotating background images.



  • Please do not use the github version of this theme in a production environment. The current plugin repository version will always be the most stable.
  • Please don't ask for support in the comments section here- there's no easy way for me to discuss with you.  Use the "Discussion" thread under "Useful Links" below.


Screenshot #0
Screenshot #1
Screenshot #2
Screenshot #3


Picture of Bas Brands
Bas Brands (Lead maintainer)
Julian Ridden
Julian Ridden: Original author
Picture of Danny Wahl
Danny Wahl: Previous maintainer
Please login to view contributors details and/or to contact them

Comments RSS


  • Picture of Marcio Caparica
    Sat, Feb 13, 2016, 12:45 AM
    I'm having what appears to be an old problem - the user drop-down menu on the top right corner doesn't open on clicking, only if we click on it and then press the "arrow down" key. I've seen somewhere in this forum that the most recent version of the theme had fixed this, but that's the one we've downloaded, and it doesn't work. Are we doing something wrong? How could I tinker with the javascript to try to fix it by myself? Thank you very much!
  • Picture of David Dumonde
    Fri, Mar 4, 2016, 2:21 AM
    This page indicates that one of the features of the Elegance theme is Google Web Fonts. it seems like that means that it uses the Google font Roboto, but it does not seem to mean that it includes a way to use other Google fonts with the theme.

    So, how do I add Google fonts to Moodle theme Elegance? I'm using Moodle 3.0.x and Elegance 3.0 (2015111500).
  • Picture of Brandon Jimenez
    Fri, Mar 4, 2016, 2:52 AM
    David Dummond, i guess you first need to download any Google Fonts you might want and upload them to the /fonts folder of your theme. Then, you'll need to update the less files (or probably use the custom css, I suppose both would work). Anyway, probably Bas will have a better advice. Have fun!
  • Picture of David Dumonde
    Wed, Mar 9, 2016, 6:37 AM
    Thanks for the reply, Brandon. Since I posted my previous comment about adding Google Fonts to the Elegance theme, I have dug deeper into the css and less files, and think I can probably hack my way to a solution with @font-face. But if Bas (or anyone else) has any suggestions that would point me more directly to a solution, it would be appreciated.
  • Picture of Bas Brands
    Wed, Mar 9, 2016, 3:26 PM
    Hi David,

    Newer versions of elegance use the less/elements/fonts.less file to add fonts to the CSS. Look a that file for customising your fonts. Hope that works for you. If not please use the Moodle Theme Forums to ask for help.
  • Picture of David Dumonde
    Wed, Mar 9, 2016, 9:52 PM
    That actually helps nudge me in the right direction, Bas. Thanks for responding.
  • Picture of Susmita Dhar
    Thu, Mar 10, 2016, 3:15 PM
    After install elegance theme in moodle, course page after "Turn editing on" activity not moving. Please check this issue.
  • Picture of Martijn Menting
    Fri, May 20, 2016, 2:37 PM
    I installed this Theme on Moodle 3.0.3. The problem is that the Pull Down menu on the right Top is not aviable. When i click on the pull down menu (my Name) then nothing happend. What can be the problem. It accured at Firefox and IE
  • Picture of Bas Brands
    Fri, May 20, 2016, 4:13 PM
    Hi Martijn.

    Could you please report this on : ?

    When reporting please include a screenshot showing the page with the JavaScript console opened and the page re-loaded.

  • Picture of Annick F
    Tue, Jun 14, 2016, 7:00 PM
    First, I just one to say this is one of the best Moodle theme I have seen.

    I am having a few issues that I don’t seem to be able to resolve:

    1-when using IE, the login screen does not display background images – It works fine when using Chrome or Firefox.

    2-The marketing spots and quick links will not show before login when selecting : “Always Show” or “ show before login only”.

    3-When using the collapsed topic I can only display one column, I understand some work has already been done on it ( but not sure how to use the github. Where can I download the latest version of the theme?



  • Picture of Martijn Menting
    Wed, Jun 15, 2016, 6:22 PM
    How can i change the height of the footer. I changed the Custom.css but nothing occures. Can you give me a hint to do this?
  • Picture of Bas Brands
    Wed, Jun 15, 2016, 6:27 PM
    @annick, @martijn:

    Thanks for using elegance and please report issues on the bugtracker:
  • Picture of Sean Marx
    Thu, Jul 7, 2016, 2:55 PM
    Thanks for a really good theme. Most of my clients have an Elegance theme with a few small tweaks.

    A client theme built using Elegance:
  • Picture of Victor Santos
    Fri, Jul 22, 2016, 7:48 PM
    Thanks for this great theme!
    I have a small issue! I set the Max page width to 1400 px (I need this size). I inserted a slide image with the dimensions of 1400x400px
    But the image doesn't fit well, it cuts the bottom, you can see in this screenshot:
    Is there a fix for this issue?
    Thank you
  • Picture of Brent Lancaster
    Tue, Jul 26, 2016, 5:54 AM
    I love this theme but would love to upgrade to 3.1. Can anyyone tell me when/if this will be available for 3.1 or if I can use the 3.0 version? My developer suggested I wait.
Please login to post comments