Locating template files

If you want to know which template is generating a particular markup element, you can use Twig's debug option.
Besides the name of the template files it also reveals its location.

You enable Twig debugging in sites/default/services.yml. Set the variable debug in the section twig.config to true.

After you have set twig_debug to true, clear the caches.

Template naming conventions

Drupal loads templates based on certain naming conventions. This allows you to override templates by adding them to your theme and giving them specific names.

After replacing a template you must rebuild the cache in order for Drupal to discover your new template.

You can debug Twig templates to figure out which templates are being used to ouput the markup for any given element.

Twig in Drupal 8

Twig is a template engine for PHP and it is part of the Symfony2 framework.

In Drupal 8 Twig replaces PHPTemplate as the default templating engine. One of the results of this change is that all of the theme_* functions and PHPTemplate based *.tpl.php files have been replaced in by *.html.twig template files.

Working With Twig Templates

Drupal allows you to override all of the templates that are used to produce HTML markup so that you can fully control the markup that is being output within a custom theme. There are templates for each page element ranging from the high level HTML to small fields.

Overriding templates

You can override Drupal core templates by adding templates to your theme folder that follow a specific naming convention.

To override templates you:

Theming with Profile2

User-profile.tpl.php

If you are designing a custom template for your user profile pages and are using the Profile2 module, you probably are looking to add your custom fields to the user-profile.tpl.php template. Here is how this can be accomplished.

This assumes that you have a Profile2 profile type called my-profile. You may easily load your fields into your custom user-profile.tpl.php by printing them like this:

Pass the theme path to javascript

Description

This extends Drupal.settings allowing you to get the theme path in a javascript file

Steps

Add a preprocess function to your theme's template.php
Using drupal_add_js we extend Drupal.settings in order to make it a variable that returns the path to the theme

p.s. don't copy the php tags into template.php just what's inside.

Pages

Subscribe with RSS Subscribe to RSS - template