Theming

Override an Existing Single Directory Component for Drupal 10, 11

Last updated
Categories
Up-to-date with minor version
11.0.x

Overriding Single Directory Components (SDCs) allows you to safely customize the functionality and appearance of components provided by contrib modules or themes. Instead of editing the original files, copy a component into your theme, declare that it replaces the original, and then make the necessary adjustments. This approach ensures our changes are upgrade-safe and easy to maintain.

In this tutorial, we will:

  • Copy an existing SDC into a theme.
  • Use the replaces: key in the component metadata to declare the override.
  • Modify the component Twig, CSS, or JavaScript and confirm the changes appear on our site.

By the end of this tutorial, you should be able to override SDCs safely and maintain your customizations in an upgrade-safe manner.

Frontend Theming