Skip to main content

Drupal 8 - How to turn on theme suggestions?

Edit services configuration for your Drupal site, for default location should be:

/sites/default/services.yml

If folder is right, but you don't have services.yml file, rename: default.services.yml to services.yml.

Find twig.config section and change debug parameter to true:

  twig.config:
    # Twig debugging:
    #
    # When debugging is enabled:
    # - The markup of each Twig template is surrounded by HTML comments that
    #   contain theming information, such as template file name suggestions.
    # - Note that this debugging markup will cause automated tests that directly
    #   check rendered HTML to fail. When running automated tests, 'debug'
    #   should be set to FALSE.
    # - The dump() function can be used in Twig templates to output information
    #   about template variables.
    # - Twig templates are automatically recompiled whenever the source code
    #   changes (see auto_reload below).
    #
    # For more information about debugging Twig templates, see
    # https://www.drupal.org/node/1906392.
    #
    # Not recommended in production environments
    # @default false
    debug: true

After clearing the cache you will see html comments for every block etc.

You know location of this option, and you know how to change it, but to do it right way you should use settings.local.php for your development enviroment. If you do, you can find this line there:

/**
 * Enable local development services.
 */
$settings['container_yamls'][] = DRUPAL_ROOT . '/sites/development.services.yml';

Local settings will load development.services.yml file, so you don't need to change anything in main service file. It's more secure to use it this way, so you will not deploy services.yml with twig debugging to your production server.

Pay attention to different path for development.services.yml - this file should be located in main sites directory, not like production service.yml in sites/site-key

Example of development.services with twig debug option:

parameters:
  http.response.debug_cacheability_headers: true
  twig.config:
    debug: true
    auto_reload: true
    cache: false
services:
  cache.backend.null:
    class: Drupal\Core\Cache\NullBackendFactory

Add new comment

CAPTCHA

This question is for testing whether or not you are a human visitor and to prevent automated spam submissions.

We use cookies on our website to enhance your user experience. We also use Google analytics and ads.

Click here to read more I've read it