如果您想在一个位置定义链接并在模板中全局访问它们,您可以在包含链接定义的_data/* 目录中创建一个global data file,然后在您的 Markdown 文件中引用它们。下面是一个示例全局数据文件_data/links.json:
{
"socials": {
"github": "<https://github.com/>",
"stackoverflow": "<https://stackoverflow.com/>",
"twitter": "<https://twitter.com/>",
...
}
}
通过这种方式,您可以使用 {{ foo }} 之类的插值在整个 11ty 项目中访问包含全局链接定义的 _data/links.json 中的数据。如果您想在模板中使用该全局数据,请引用全局数据文件的名称 links,然后根据需要访问对象键,例如 {{ links.socials.key }}。
很遗憾,使用[GitHub]({{ links.socials.github }}) 不起作用,但为避免在每个页面上添加链接定义,您始终可以执行以下操作:
---
title: Some title
templateEngineOverride: njk, md
---
<a href="{{ links.socials.github }}">GitHub</a>
或者,如果使用 Nunjucks 作为您的模板引擎,您可以使用 set 为您的社交链接创建变量,并避免定义 Markdown 参考链接。
---
title: Some title
---
{% set github = links.socials.github %}
[Link to my GitHub]({{ github }})
最后,使用短代码与全局数据配对并不是一个坏主意。
module.exports = function(eleventyConfig) {
eleventyConfig.addShortCode("socialLink", function(linkName, url) {
return `<a href="${url}">${linkName}</a>`;
});
}
// Template Usage (.md or .njk etc)
{% socialLink "GitHub", links.socials.github %}
// outputs: <a href="<https://github.com>">GitHub</a>