New Tutorial: Start a New Theme with Starterkit

We just added a new tutorial all about starting a new theme with Starterkit. Learn how to use it, how it works, and what prompted its addition to Drupal core.

Starterkit enables you to learn by example

I'm a big fan of learning from reading example code. I think it helps to put things into context, makes it easier to visualize where files are supposed to be in the filesystem, and how all the different parts relate together. It also often exposes things that I didn't realize I was going to need to learn when I run across a line of code, or a file, that I wasn't expecting and now I'm down the rabbit hole trying to figure out what it does.

If you're just getting started with Drupal theming I highly recommend checking out the new Starterkit feature. You can use it to generate a new theme, including an info file, asset libraries, and template files. Rather than an empty directory you'll start with a directory populated with all the things you can expect to find in any Drupal theme. They might not do exactly what you want them to do, but you can edit them. And learn as you go.

As an example, here's a list of files for a theme, reboot, generated by Starterkit:

.
├── README.md
├── css
│   ├── components
├── images
│   └── icons
├── logo.svg
├── reboot.info.yml
├── reboot.libraries.yml
├── reboot.theme
├── screenshot.png
├── src
│   └── StarterKit.php
└── templates
    ├── block
    ├── content
    ├── content-edit
    ├── dataset
    ├── field
    ├── form
    ├── layout
    ├── misc
    ├── navigation
    ├── user
    └── views

Starterkit: Not only for beginners

Starterkit is also great for experienced theme developers. It replaces the Classy base theme in Drupal 10. And helps to create custom themes that are more explicit about what templates they are overriding, and in the long run, easier to reason about.

Learn how to use Starterkit

Learn more about using Starterkit in our new tutorial, Start a New Theme with Starterkit.

Add new comment

Filtered HTML

  • Web page addresses and email addresses turn into links automatically.
  • Allowed HTML tags: <a href hreflang> <em> <strong> <cite> <code class> <ul type> <ol start type> <li> <dl> <dt> <dd><h3 id> <p>
  • Lines and paragraphs break automatically.

About us

Drupalize.Me is the best resource for learning Drupal online. We have an extensive library covering multiple versions of Drupal and we are the most accurate and up-to-date Drupal resource. Learn more