到目前为止，您已经了解了通过 timber 使用 twig 的基本概念，同时构建了模块化 wordpress 主题。我们还基于 dry 原则，使用 twig 研究了块嵌套和多重继承。今天，我们将探讨如何通过 timber 插件使用 twig 在主题中显示附件图像、wordpress 菜单和用户。
木材中的图像
图像是任何 WordPress 主题的重要元素之一。在常规的 WordPress 编码实践中，图像与 PHP 集成在正常的 HTML 图像标签内。但是，Timber 提供了一种相当全面的方法来处理 img（图像）标签，该方法是模块化且干净的。
帖子的缩略图字段中附加了图片。这些可以通过 {{ post.thumbnail }} 通过 Twig 文件轻松检索。就是这么简单！
用法
让我们从一个实际的例子开始。我们的 single.php 文件如下所示：
在这里，出于非常明显的原因，我使用了
TimberPost()函数。它在整个 Timber 中用于表示从 WordPress 检索的帖子，使它们可用于 Twig 模板。由于特色图像附加到帖子数据中，我们现在需要在前端检索它。因此，它的 Twig 文件
single.twig将如下所示：{# Sinlge Template: `single.twig` #} {% extends "base.twig" %} {% block content %}{% endblock %}
在第 9 行，代码
{{ post.thumbnail.src }}检索帖子的特色（缩略图）图像并按如下方式显示：
您可以使用此代码语法检索任意数量的缩略图。
使用 Timber 时，您还可以对这些图像进行更多实验。例如，您还可以通过以下方式调整它们的大小：
 }})
通过使用
resize()函数，您可以向图像添加新尺寸，其中第一个参数是width，第二个参数是高度。如果您想按比例缩放图像，请忽略height属性。现在语法变成： }})
前端显示相同的图像，如下所示：
如果您想探索更多内容，请尝试图像食谱。
使用
TimberImage()考虑这样一个场景：开发者想要通过图像 ID 获取图像，或者想要通过 URL 显示外部图像等。对于这种扩展方法，Timber 提供了一个类，
TimberImage ()，表示从 WordPress 检索到的图像。用法
让我们以
single.php文件为例，现在看起来像这样：这次，我使用
TimberImage()类，该类将图像 ID8作为其参数。编码例程的其余部分是相同的。让我们通过 Twig 文件single.twig检索此图像。
存储在
$contextcustom_img 元素中的值，即{{ custom_img }}，将通过其 ID 检索图像以显示在前端，如下所示：
要通过外部 URL 替换检索图像，您可以遵循以下语法。
这一次，前端显示的不是图像 ID，而是外部图像 URL，如下所示：
要探索此功能的更多功能，您可以查看文档。
木材菜单
现在，您将如何使用 Twig 模板渲染 WordPress 菜单？这是一件很棘手的事情。但是，坚持住！ Timber 为您提供了
TimberMenu()类，它可以帮助您将 Twig 文件内的 WordPress 菜单呈现为完整的循环。我们来看一下。用法
检索菜单项的整个概念都围绕菜单对象。有两种定义其上下文的方法。第一个是将菜单对象添加到全局 get_context() 函数中，使菜单对象在每个页面上可用，就像我在
functions.php文件中所做的那样。其次，您可以通过 ID 为特定 PHP 模板添加特定菜单。无论采用哪种方法，一旦菜单可供 Timber
$context数组使用，您就可以从中检索所有菜单项。但我更喜欢在全球范围内定义它。因此，转到functions.php文件并粘贴以下代码：因此，我在这里定义了一个自定义函数调用
add_to_context。在这个函数内部有一些数据，我希望通过get_context()函数在每个 PHP 模板中都可以使用这些数据。在第 13 行，您可以找到TimberMenu()的实例，该实例针对$data数组中的元素菜单传递。这将使 Twig 模板可以使用标准 WordPress 菜单作为我们可以循环访问的对象。
TimberMenu()函数可以采用菜单项或 ID 等参数。让我们创建一个名为
menu.twig文件的 Twig 模板。{# Menu Template: `menu.twig` #}上面的代码在此 Twig 模板内运行一个循环。第 5 行为每个菜单项运行
for循环，并在无序列表中显示每个菜单item的标题。循环运行，直到menu对象的所有键值对都被迭代并列出在前端。我继续将
menu.twig模板包含在第 11 行的base.twig模板中。{# Base Template: `base.twig` #} {% block html_head_container %} {% include 'header.twig' %} {% endblock %} {% include "menu.twig" %}{% block content %}{% include "footer.twig" %}SORRY! No content found!
{% endblock %}
