Reusable Paragraphs with Single Directory Components Now Possible in Drupal 11
Rakesh James has published a detailed guide demonstrating how to create reusable paragraphs using Single Directory Components (SDC) in Drupal 11, showcasing how developers can implement modular design systems using custom themes and scoped component architecture.
Using a paragraph type called image_card within a custom theme, James walks through the process of generating SDC components using Drush. The implementation embeds a component template via Twig using simple slot values for image and content. Supporting files such as a YAML metadata file and a Twig template define the structure and logic of the component. Once configured, the image and text content are rendered cleanly and consistently using the SDC system, which also automatically applies associated CSS and JavaScript.
The blog also details how the same component can be rendered inside a custom block plugin using Drupal’s render array format, offering developers flexible placement across content structures. This encapsulation allows developers to write maintainable code while keeping presentation logic modular and isolated from unrelated styles or scripts. The tutorial encourages the use of SDC to reduce redundancy, improve readability, and streamline the theming process in modern Drupal development.
According to Rakesh, the method supports scalable UI design patterns that benefit both large and small projects, especially when consistent styling and behavior are required across multiple paragraph types. With SDC now part of Drupal core, the approach is expected to become a front-end standard moving forward.
To explore the full tutorial, visit Rakesh James’ blog: Building Reusable Paragraphs with SDC in Drupal 11.


