原文地址:https://www.drupal.org/docs/8/theming/drupal-twig-conversion-instructions-tplphp-to-htmltwig
Drupal 模板引擎Twig 转换说明(由tpl.php到html.twig)
这篇文档常用于drupal8 Twig模板转换过程,对于在drupal8中用Twig模板引擎更新主题和模块来说也是很有帮助的。
说明:在Drupal的核心问题中Twig的工作已经完成,只是用Twig的转换沙箱找到以前转换的模板和函数。
关键步骤:
- 找到核心问题打补丁
- 不能在沙箱中打补丁
- 不能给沙箱创建补丁
- 只用沙箱测试或检索以前的转换代码
- 首先,在优酷视频网上观看这个过程的概览
安装
首先下载
git clone -b 8.0.x的下载地址: http://git.drupal.org/project/drupal.git d8
将当前版本的安装在文件夹(文件夹的名字可以自己指定)
- 正常安装Drupal(使用标准的安装文件)
- 在services.yml中设置twig的3个属性(debugging, cache, auto_reload)的值为True
转换
主题函数
将主题函数转换成模板文件和预处理函数:
- 确定主题函数文件的路径:(theme.inc? a core/modules/color/?)
- 为主题函数创建一个模板文件X.html.twig
- 正确命名新文件
- 移除函数开始的"theme_", 以" .html.twig"的文件名结尾
- 将下划线“_”转换成中间线”-”
- 例如:
- theme_link()变成link.html.twig
- theme_user_signature()变成user-signature.html.twig
- 将新的Twig模板放在stark主题的模板文件夹中(沙箱中):
来自特定的模块stark/templates/comment, etc
来自theme.inc, stark/templates/theme.inc
来自form.inc, stark/templates/form.inc
- 在the Drupal 8 API的文档中搜索函数
电子表格中有所有函数的链接
- 在文件的头部添加PHP格式的代码块{##},并包装在Twig的评论中
- 在每行的开头增加@file标记
- 在@file行下面复制函数的定义,用“Default theme implementation ...”替换“Returns HTML ...”,写在一行上。
- 增加“Available variables:”行(替换 @param 变量)
- 在api.drupal.org上的参数文档中,复制指定的变量
- 如果有@see template_preprocess()行,就删除它
- 增加@see template_preprocess_THEME_HOOK()行
- 增加@ingroup themeable行(见下面的代码块示例)
- 在下面的代码块中复制函数的源代码(见下面的示例)
- 将PHP代码转换成常见的HTML代码,并注释说明)
- )在HTML代码中删除PHP代码,例如:
function whatever() {
// …
return $output; }
- )删除PHP的注释说明并用{{ }}代替,
把转换为简单的名字:$variables['title'] 变成 {{ title }}
用点语法代替数组语法:$variables['page']['tabs'] 变成 {{ page.tabs }}
- )用twig的{% %}代替PHP的<?php ?>
- )用twig的注释语法{##}代替php的注释
- )用t 过滤器代替文字函数:{{ 'text in quotes'|t }}
- )移除预处理函数变量的PHP格式(见下面的预处理说明)
8.做了这些之后,如果你要改进将冗余的模板合并成一个,或者改进标记或者变量名这些事,就要在电子表格中做注释,或者在沙箱中做一个焦点,例如:http://drupal.org/node/180591
转换或者合并预处理函数
说明;
- 预处理函数将替代所有的模板函数
- 如果模板文件中有PHP的语法影响输出变量,这些代码需要移动到预处理函数中
- 如果模板以主题函数开始,主题函数需要转换成预处理函数
- 如果主题函数已经有相关的预处理函数,主题函数中处理代码的变量需要移动到预处理函数中
- 不要在hook_theme的实现中加一条线表明drupal使用模板文件而不是主题函数
- 说明
- 将template_preprocess_YOURFUNCTION重命名为template_preprocess_YOURFUNCTION
- 通过加&传递变量,关键是theme_select($variables)变成template_preprocess_select(&$variables)
- 编辑函数处理变量的处理逻辑,去掉任何标记(关键是 $output)
如果在模板中有丢失的函数
如果在模板中需要的过滤器或者函数的入口还没有工作,把它加在开放的焦点里。记住大部分或者函数应该移动到预处理函数中。只有你认为主题驱动需要这个函数的入口,那么此函数应该留在模板中。
简单的转换示例
function theme_link($variables) { return '' . ($variables['options']['html'] ? $variables['text'] : check_plain($variables['text'])) . ''; }
- 模板(文件名:link.html.twig)
{# /** * @file * Default theme implementation to display a link. * * Available variables: * - text: The link text for the anchor tag. * - url: The complete URL being linked to, such as * "/node/34" or "http://example.com/foo". * - attributes: Remaining HTML attributes for the containing element. * * @see template_preprocess_link() * * @ingroup themeable */ #} <a href="{{ url }}" class="{{ attributes.class }}"{{ attributes }}>{{ text }}</a>
改成预处理函数
/** * Prepares variables for link templates. * * Default template: link.html.twig. * * @param array $variables * An associative array containing: * - text: The translated link text for the anchor tag. * - path: The internal path or external URL being linked to. * - options: An associative array of additional options. */ function template_preprocess_link(&$variables) { $variables['url'] = url($variables['path'], $variables['options']); }
评论:
Andriy Podanenko: http://drupal.org/node/1783130如何重命名变量
- 以 {# 和 #}为开始和结束的标志
- 标准的PHP代码块标记生成器要遵循Twig注释标记标准
- 从api.drupal.org复制粘贴这个定义
James Wilson:如果从函数中复制这个定义,应该用"Default theme implementation"重写"Returns HTML ..."
- 从api.drupal.org复制粘贴参数
James Wilson:如果需要从文档中引用另一个变量块,变量要使用单引号,在变量名称中去掉$标志,。(见讨论http://drupal.org/node/1804710])
- 在twig中使用{{ }}语法输出变量
- 可以参考属性可以修改的类
- 像url()一样大部分函数可以从模板文件中移动到预处理函数中