Themes in Drupal are responsible for the look and feel of your site. They provide the HTML markup, CSS, typography, images, and interactive experience that people encounter when they view your site. Each theme is a set of files including style sheets, Twig templates, Drupal-specific YAML files, images, and more, all contained within a directory. There are hundreds of community-contributed themes available. Themes are often one of the first places you’ll start to modify the code and make your Drupal site truly unique.
Developers can create new themes to customize the look and feel of a site. This can be done by either extending an existing theme and making minor changes, or creating a completely custom design.
There are three different types of themes:
- core themes: themes that are included with Drupal core and live in the /core/themes directory
- contributed themes: themes that are download from Drupal.org, and are typically placed in the /themes/contrib directory
- custom themes: themes that you or a theme developer created specifically for your use case, and are typically placed in the /themes/custom directory
Example tasks
- Install a new theme
- Change the overall appearance of your Drupal site
- Modify the appearance of specific pages, or elements on a page
Confidence
The basic concept of themes, how they are integrated into a Drupal site, and the role they play is unlikely to change. While it is possible to do so, there is little reason to use anything other than Twig as your theme engine.
Drupalize.Me resources
Frontend Theming
Guide
How to edit a theme’s settings to update the color scheme and add a logo.
How to download and install a theme from Drupal.org.
How to manually install a module or theme.
Twig is the default template engine for Drupal. If you want to make changes to the markup that Drupal outputs you're going to need to know at least some Twig. In this tutorial, we will outline the role that Twig now plays in Drupal, how Twig impacts the theming experience, and where to find additional resources for learning Twig.
At the end of this lesson, you'll be able to:
- Describe the role that Twig plays in creating Drupal themes
- Explain how Twig impacts the theming experience in Drupal
- Locate additional resources for learning Twig
Layouts
TopicA layout can describe how various components are arranged on various levels—from an entire page from the header to the footer, to just the “middle” where the dynamic content goes, to individual components. It can apply to templates for managed content or one-off designs for landing pages.
External resources
-
List of all contributed themes (Drupal.org)
- Search through the list of all contributed themes.
-
Drupal User Guide: Finding Themes (Drupal.org)
- Learn how to find and evaluate themes on Drupal.org.
- Drupal User Guide: Downloading and Installing a Theme from Drupal.org (Drupal.org)
- Learn how to download a contributed theme and install it. Includes instructions for downloading with Composer, or manually.
-
Theming Drupal (Drupal.org)
- Primary landing page for Drupal theming documentation.