Drupal Drupal Theming & Frontend Development 1 — Questions and Answers
Question 1: What file is required in every Drupal theme to declare its name, regions, and base theme?
- theme_name.theme
- theme_name.info.yml (Correct answer)
- theme_name.libraries.yml
- theme_name.breakpoints.yml
Correct answer: theme_name.info.yml
Every Drupal theme must have a .info.yml file declaring its name, type: theme, core_version_requirement, regions, and optional base theme.
Question 2: How do you attach a CSS or JS library to a specific Twig template in Drupal?
- Use @import in CSS files
- Add {{ attach_library('mytheme/library-name') }} in the Twig file (Correct answer)
- List the file in the .info.yml css section
- Call drupal_add_css() in the theme's .theme file
Correct answer: Add {{ attach_library('mytheme/library-name') }} in the Twig file
The attach_library() Twig function loads a named library (defined in libraries.yml) only on pages where that template renders, avoiding global CSS/JS bloat.
Question 3: In Drupal theming, what is the purpose of a 'preprocess function' in a .theme file?
- Compile SCSS to CSS before the theme renders
- Add or modify variables available inside a Twig template (Correct answer)
- Override a core module's block output
- Cache theme suggestion arrays per user role
Correct answer: Add or modify variables available inside a Twig template
Preprocess functions (e.g., THEME_preprocess_node()) allow theme PHP code to add, modify, or compute variables that are then passed into corresponding Twig templates.
Question 4: What is a 'theme suggestion' in Drupal and how does it enable template overrides?
- A CSS class automatically applied to body tags based on content type
- A prioritized list of template filenames Drupal tries before falling back to defaults (Correct answer)
- A configuration flag that enables dark-mode theming
- A Twig macro that suggests reusable partial templates
Correct answer: A prioritized list of template filenames Drupal tries before falling back to defaults
Theme suggestions give Drupal an ordered list of template filenames to try (e.g., node--article.html.twig before node.html.twig), enabling granular per-bundle overrides.
Question 5: Which Drupal core theme is commonly used as a base theme for building administration-style custom themes?
- Bartik
- Claro
- Stable9 (Correct answer)
- Seven
Correct answer: Stable9
Stable9 (previously Stable) provides empty template files and no CSS, making it the cleanest base theme for fully custom themes that need no inherited styles.
Question 6: What is the correct format for defining a JavaScript library with a dependency on jQuery in a Drupal libraries.yml file?
- dependencies: [jquery]
- dependencies: - core/jquery (Correct answer)
- requires: jquery/core
- import: jquery from core
Correct answer: dependencies: - core/jquery
In Drupal's libraries.yml, dependencies are listed as 'package/library-name' strings under the dependencies key, and Drupal's jQuery is referenced as 'core/jquery'.
What file is required in every Drupal theme to declare its name, regions, and base theme?