Theme Starter Kit Drupal 10

 

Sub-theming has been a core part of Drupal since the early days. Creation of a sub-theme has generally been a manual process by typically inheriting from a core theme or any contrib theme to use some already available markup and styling. The Drupal Starter kit will completely change the perspective of the sub-theme (Child theme) for the developers.


Why use THEME Starter Kit


Drupal has been providing the subtheme concept for many years. But recently we all have noticed about the classy theme that it's not receiving any updates from drupal 8.0.0 and our earlier site is dependent on classy.


The concept of sub-theme is known for using some common makeup and CSS of the parent theme and our site is dependent on classy and also needs updates. Sometimes sites are not able to restart from scrap(Very beginning). So drupal comes with the new concept of THEME STARTER KIT DRUPAL 10.


Drupal has introduced starterkit in branch 10.0.x and the version is  10.0.0-beta1.



Features

  1. Drupal will provide frequent updates on default markup and css from core of drupal so these features will become very helpful for Front-end developers.

  2. After starter kit sub-theming will be still an existing option to create subthemes. This is important in cases where themes are inheriting some common css and markup from core of drupal themes.

  3. The theme which is already using the classy theme will continue with the contributed classy theme.

Generating a new theme using command line


Run this command in the respective (drupal, docroot, web) folder to create a theme inside them folder.

Syntax→ php core/scripts/drupal generate-theme my_new_theme

  (theme name on the place of my_new_theme)
Eg: php core/scripts/drupal generate-theme test


By this command, the theme is generated outside of the custom folder.

 

So to generate themes inside the custom folder need to add the path of the file folder.

use the following command.

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

And output will look like


Reference the help to see all configuration options:

Syntax→ php core/scripts/drupal generate-theme --help


Eg: php core/scripts/drupal generate-theme --help


Customize according to requirements

Starter kit tools provide the freedom to use contrib or custom theme as the parent theme. To use that, the developer needs to add source_theme_name in command (which can we get a demo form --help) and then add starterkit: true; in that theme which they want as create starter theme or sub-theme. (Remove starterkit: true; after generated theme)

So in the end the command will look like:

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


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


And the theme will look like


This theme is generated using Bartik theme and can be checked in info.yml file of the theme


We can change the generated theme name, code, files etc according to our requirements.



Tracking upstream changes

When the theme is generated, the user needs to check the upcoming changes in the starter kit core about features, bug fixes etc. This is important too when you are using a starter kit as your base theme


  • Check versions of the core Starterkit theme


When you have generated a theme from Drupal core you need to check the version on the starter kit so you can check it on the info.yml file in the generator key.

generator: starterkit_theme:9.3.0


With this now you are able to compare the version of the theme using git or drupal core repository.

Syntax→ git diff <version_1> <version_2> <path_to_core_starterkit_theme>


Eg: git diff 9.3.0 9.4.0 core/themes/classy/


  • Check the list of theme changes by issue

Users can check the list of issues by using the below command. If found too many issues then the user can review the changes from the list.


Syntax→ git log <version_1> <version_2> <path_to_core_starterkit_theme>


Eg: git log 9.4.0 9.3.0 core/themes/classy/


References


https://www.drupal.org/about/core/blog/new-starterkit-will-change-how-you-create-themes-in-drupal-10


https://www.drupal.org/docs/core-modules-and-themes/core-themes/starterkit-theme


Popular posts from this blog

Drupal for beginner Basic required tool and data With some basic instructions.