Module Monday: Magic

Sprinkle your front-end development workflow with a little magic

A number of popular base themes provide many useful tools to help in front-end development. These range from simple things such as disabling the theme registry that alleviates the need to clear cache when adding new templates, functions etc, to giving you complete control over how and where your CSS and JavaScript are added to the page.

The Magic Module consolidates a number of these useful tools into one place.

Picture of the them settings page with Magic module installed

Instead of each of each theme re-implementing useful front-end functionality, Magic moves it all into the module space. Currently, it provides some really handy features for themers including:

  • Enhancements to CSS Aggregation
  • Explicitly exclude CSS and JS files
  • Move JavaScript to the footer
  • Rebuild Theme Registry on Page Reload
  • Display a Viewport Width indicator
  • Backport of Drupal 8 JavaScript handling (Watch Théodore Biadala's DrupalCon Prague presentation on Upgrading your JS to Drupal 8 for a sneak preview)

The module will also allow each of your themes to export a set of Magic settings. Visit the "Settings" page of your theme for an example (e.g. /admin/appearance/settings/bartik).

Now your custom themes can quickly and easily take advantage of a whole host of front-end development tools!

Get in touch with us

Tell us about your project or drop us a line. We'd love to hear from you!