基础篇24. 自定义区块,include模板

这就是上一节中我们为网站做的首页。在设计上,这还仅仅是一个初稿,但是,相比之前的样子,已经好很多了。

让我们再来看一下page模板。前面已经提过,大部分的时候,我们并不会把这些文字内容直接写在模板文件中,因为这样就无法通过drupal来管理这些文字。

所以,我们来创建一个自定义区块,把模板中的代码和文字放到区块中,并在模板中删除对应的代码。这样,如果我们需要修改这段文字,就不需要在模板中修改了。

在这里,我们创建了一个“底部广告”的自定义区块,然后我们把页面底部的这一对p标签以及其中的内容拷贝到区块的正文中。保存之后,在区块布局页面中找到“footer”区域,然后点击“放置区块”按钮,并在弹出来的窗口中选择我们刚才创建的区块,再次点击“放置区块”按钮。在接下来的窗口中,把显示标题前面的钩取消,因为我们不需要显示标题,然后保存。

然后我们回到之前的两个模板文件中,把相应的p标签和他的内容删除掉。回到首页,刷新之后,我们可以看到整个p标签都被打印出来了。我们自定义的这个“底部广告”区块是通过上一节中讲过的代码:

{{ page.footer }}

打印到页面上的,但是必须再次强调的是,这个代码实际上打印的是区域,由于此时区域中的三个区块,只有“底部广告”区块处于启用状态,因此只打印了这个区块。其他两个区块“powered by drupal”和“footer menu”都被禁用了。

我们再次回到“自定义区块”列表,编辑这个区块,这里的文本格式是basic html,他会自动过滤掉一些东西,比如class类名,所以这里我们选择full html,然后点击源代码,把之前的语句以源代码的方式黏贴上来,然后再次保存。

我们检查元素可以看到,之前在模板中的p标签、类名和文字内容都正常输出了。在两个page模板中,页面底部的footer区域都使用了相同的代码。其实我们可以单独为footer区域创建一个footer.html.twig的模板,然后在两个page模板中通过文档中的命令来引用这个footer模板。在这个代码中,斜杠前面的是主题名称,后面是要引入的模板名。

{% include '@nowicode/footer.html.twig' %}

这样,如果我们需要修改footer的代码时,我们就不需要去修改每一个模板,我们只要直接修改footer模板即可。

关于上面这个语句的解释:当你安装或者创建一个主题或者模块的时候,Drupal8会自动为主题和模块注册一个Twig名字空间路径,它指向的是主题的template文件夹。因此,在Twig include中的"@theme_name"指的就是这个路径,即"your_site.com/themes/theme_name/templates/" 

然后我们回到footer模板中,随意添加一个类名,刷新页面之后,我们可以看到这个类名被输出到源代码中,这说明,我们的模板生效了。这里,有一个细节,那就是,twig debug模式不会为由include的方式引入的模板生成帮助信息。
 

本书共102小节。


目前全部收费内容共235.00元。购买全部

评论 (0)