Module 3.2 – Theming Concepts

By saroj 19 December, 2025 Difficulty: Intermediate

Module 3.2 tests whether you understand how Drupal renders output, not just how to write Twig. Acquia focuses on your ability to:

  • Choose the correct theming layer
  • Understand render arrays vs templates
  • Use configuration before code
  • Keep logic out of Twig

Most wrong answers come from misunderstanding where a change should be made.

The Drupal render pipeline (core concept)

Drupal rendering follows this simplified flow:

  1. Data is loaded (entities, views, blocks)
  2. Data is converted into render arrays
  3. Theme system selects templates
  4. Twig renders HTML
  5. CSS and JS are attached via libraries

Themes only work with render arrays, never raw database data.

Render arrays

A render array is a structured PHP array that describes:

  • What to render
  • How to render it
  • Which cache metadata applies

Example (conceptual):

  • #theme → which template to use
  • #markup → HTML output
  • #cache → cacheability info

Exam signal:
If a question mentions output, templates, or caching, render arrays are involved.

Twig’s role in Drupal

Twig is a presentation layer only.

Twig can:

  • Print variables
  • Loop over items
  • Apply filters

Twig must not:

  • Query data
  • Contain business logic
  • Decide access or permissions

If a question suggests logic in Twig, that answer is usually wrong.

Template suggestions (important concept)

Drupal selects templates using template suggestions.

Examples:

  • node.html.twig
  • node--article.html.twig
  • node--article--teaser.html.twig

Drupal chooses the most specific available template.

Exam signal:
If different output is needed for a specific content type or view mode, template suggestions are the correct tool.

View modes and theming (strong connection)

View modes are the preferred way to control what data appears.

Themes then control how it appears.

Correct pattern:

  • Configure fields per view mode
  • Theme the view mode template

Incorrect pattern:

  • Hide fields in Twig
  • Use conditional logic for display

Preprocess functions (what they are really for)

Preprocess functions prepare variables for Twig.

They are used to:

  • Add computed values
  • Rename variables
  • Attach libraries conditionally

They should not:

  • Load entities unnecessarily
  • Replace Views or controllers

Exam signal:
If Twig needs a new variable, preprocess is usually the correct answer.

Attaching libraries (CSS/JS)

Assets should be attached using libraries.

Correct places:

  • Global theme library
  • Template-level attachment
  • Preprocess attachment

Incorrect places:

  • Inline <style> or <script> tags
  • Hardcoded asset paths

Regions, blocks, and themes

Themes define regions.

Blocks are placed into regions via configuration.

Themes should:

  • Define meaningful regions
  • Not assume block placement

This allows site builders to control layout.

Layout Builder and theming

Layout Builder changes how content is assembled, but not how it is themed.

Themes still:

  • Style blocks
  • Style sections
  • Style view modes

Themes should not hardcode layout decisions that conflict with Layout Builder.

Accessibility (A11y) considerations

Drupal core themes prioritize accessibility.

Theming best practices:

  • Use semantic HTML
  • Avoid removing ARIA attributes
  • Ensure focus styles remain visible

Exam signal:
If accessibility is mentioned, avoid custom JS-heavy navigation.

Performance considerations

Good theming improves performance:

  • Use view modes
  • Minimize Twig logic
  • Reuse templates
  • Leverage caching metadata

Bad theming hurts performance:

  • Conditional-heavy Twig
  • Inline assets
  • Duplicated templates

Security considerations

Twig auto-escapes output by default.

Theming rules:

  • Avoid |raw unless absolutely necessary
  • Never trust user input
  • Keep validation and access in modules

Exam signal:
If sanitization or validation is mentioned, theming is not the solution.

Site Builder perspective

Site builders:

  • Configure view modes
  • Place blocks
  • Use Layout Builder

Themes must support these configurations.

Frontend developer perspective

Frontend developers:

  • Work with Twig variables
  • Style view modes and blocks
  • Attach assets correctly

They rely on preprocess and configuration.

Backend developer perspective

Backend developers:

  • Provide clean render arrays
  • Avoid pushing logic into themes

Themes consume, not compute.

Common exam traps in Module 3.2

  • Writing logic in Twig
  • Hiding fields in templates
  • Querying data in preprocess
  • Using JS for layout decisions
  • Ignoring view modes

Correct answers favor clear separation of concerns.

Key exam takeaways

  • Render arrays drive theming
  • Twig is presentation-only
  • View modes control data
  • Templates control markup
  • Preprocess prepares variables
  • Configuration comes before code