Theming

Movie Project: Create a Custom Theme for Drupal 7

Last updated February 28, 2020
Categories
Up-to-date with minor version
7.x

Check your version

This tutorial covers a topic in Drupal 7 which may or may not be the version you're using. We're keeping this tutorial online as a courtesy to users of Drupal 7, but we consider it archived.

In this exercise you will demonstrate your ability to create a custom theme as a subtheme based on Zen and use Sass.

Goal

Create custom theme for the site.

Prerequisites

You will need the following knowledge and skills. If you need a review, check out the Additional resources section at the bottom of this page.

  1. Download the Zen theme and create a subtheme.
  2. Use Sass to generate the CSS.

Tasks

Install the Zen theme.

Read the README file and create a custom subtheme named movie.

Alter the info file according to the theme name.

Enable the subtheme.

Compile the Sass into CSS.

Recap

  • It’s easier to write a theme from a "bare bones" starter theme.
  • Some themes are pre-installed with more functionality than others, e.g. Bootstrap.

Further your understanding

Additional resources

Creative Commons License

Drupal Training Resources by Damian Robinson are licensed under a Creative Commons Attribution-ShareAlike 4.0 International License. Based on a work at http://www.damianrobinson.co.uk.

Hands-On Exercises: Movie Project