StarterKit Theme In Drupal 10: A Complete Theme Guide ⋆ Appic Softwares

StarterKit Theme In Drupal 10: A Complete Theme Guide

StarterKit Theme In Drupal

With the release of Drupal 10, frontend developers and themes will soon learn some intriguing new developments. It’s almost time for the new starterkit theme! Despite the fact that it has been tested since Drupal 9.5.

Let’s start with the fundamentals and speak about themes. The overall structure and style of your Drupal website is essentially built on themes. It is the layer of the website that visitors view, and it contains design elements like fonts, color schemes, headers, and footers as well as other aesthetics of the site.

Sub-theming has long been a fundamental component of Drupal. A parent theme’s resources are inherited through the process of sub-theming. In order to employ publicly available markup and styling, Drupal sub-themes have traditionally been created manually by inheriting from a core theme (Classy) or any contributed theme. The Drupal Starter Kit will fundamentally alter how developers view sub-theming. Continue reading to learn how to use the new Starterkit theme and get step-by-step instructions.

Why Use StarterKit Theme In Drupal?

Subtheme support has been available in Drupal for some time. But recently, it has come to our attention that the Classy theme has not received any updates since Drupal 8.0.0. This is because it needs to preserve backward compatibility, and any modifications could break it. 

When you sub-theme a core theme, it makes use of the parent theme’s shared HTML and CSS. Additionally, since Classy needs to maintain backward compatibility, you won’t have many options if your Drupal site depends on a base theme like Classy. For this reason, Drupal 10 core now uses the novel idea of a Starterkit theme.

New StarterKit Theme Features

The version of Starterkit that Drupal has released is 10.0.0-beta1. It has taken the place of Classy, a project that is currently supported.

  • Starterkit will serve as a starting point to generate themes, as the name suggests. It can be copied onto the new theme instead of needing to be expanded as a base theme.
  • The default markup and CSS in Drupal’s core will receive regular upgrades, which will benefit front-end developers.
  • The option to create subthemes will still be available through sub-theming. When themes inherit common CSS and markup from the default Drupal theme, this is crucial.
  • A theme may continue to use the donated classy theme in place of the core Classy theme if it is already utilizing the Classy theme.
  • The command line interface utility enables you to create a new theme.

How To Generate A New StarterKit Theme In CLI?

To build a theme inside the theme folder, use this command in the appropriate (Drupal, docroot, web) folder.

php core/scripts/drupal generate-theme my_new_theme

Add your theme name in place of my_new_theme.

For example-

php core/scripts/drupal generate-theme test

The theme is generated when this command is run outside of the custom folder.

As a result, you must add the file folder’s path as follows in order to build themes inside the custom folder:

php core/scripts/drupal generate-theme test –path themes/custom

This is how the output would look like:

If you wish to see all the configuration options, you can reference the help from here-

php core/scripts/drupal generate-theme –help

Customizing The StarterKit

The freedom to utilize a donated or personalized theme as the parent theme is offered by starterkit tools. To do this, you must first add starterkit: true; to the theme in which you wish to build a starter theme or sub-theme, and then add source_theme_name to the command line (which you can get from –help). (After producing the theme, remove starterkit: true)

Finally, the command will appear as follows:

php core/scripts/drupal generate-theme my_new_them –path [path_of_file_folder] –starterkit source_theme_name 

For Example-

php core/scripts/drupal generate-theme demotheme –path theme/custom –starterkit bartik

After doing all these, this is how your theme would look like:

The info.yml file for this theme, which was created using the Bartik theme, can be viewed.

The produced theme’s name, code, and other elements can be changed to suit your needs.

Tracking Upstream Changes

You should look for any impending changes in the Starterkit core when the theme is generated, especially in regards to features, bug patches, etc. When you use Starterkit as your foundation theme, this is equally crucial.

Verify the Starterkit theme’s core version.

You must verify the starterkit’s version after creating a theme from Drupal core. You can look for it in the generator key’s info.yml file.

theme:9.3.0 starterkit generator

Now that you have this, you may use Git or the Drupal core repository to compare the theme’s version.

Syntax

Version_1 to Version_2 in git <path_to_core_starterkit_theme>

Example: 

git diff core/themes/classy 9.3.0 9.4.0

View the issue-by-issue list of theme changes.

You can evaluate the changes from the list if you discover an excessive number of problems. Use the command below to look over the list of problems:

 

Syntax

Version_1 vs Version_2 of the Git log <path_to_core_starterkit_theme>

Example: 

core/themes/classy/git log 9.4.0 9.3.0

Conclusion

With the Starterkit being a huge improvement, especially for front-end developers, Drupal 10 offers a lot to look forward to. Enhancements and issue solvers like the Starterkit demonstrate how Drupal is a CMS that is actually always improving and that it is headed in the right direction for adoption. You may rely on our specialists to use Drupal in the best way possible for your upcoming project because we are a Drupal development company only. 

Moreover, you can even hire dedicated Drupal developers from us and manage your project development. 

So what are you waiting for? 

Contact Us Now!

Get Free Consultation Now!


    Our Engagment Model

    •   Hourly Hiring

    •   Fixed Hiring

    •   Dedicated Team

    Contact Us

    Consult us today to develop your application.

      Get in touch with us


      Skype Whatsapp Gmail Phone