在 Eleventy 中维护外部链接
Maintaining external links in Eleventy
我在我的 110 站点中使用 markdown reference links。
与其在每个页面上重复定义链接,不如将它们放在一个地方,然后在我的页面中引用它们。
例如 links.md
可以包含:
[github]: <https://github.com/>
[Whosebug]: <https://whosebug.com/>
然后任何页面都可以引用这些链接。
有人知道这是否可行吗?
如果您想在一个地方定义 link 并在您的模板中全局访问它们,您可以在包含 link 的 _data/*
目录中创建一个 global data file ] 定义,然后在你的 Markdown 文件中引用它们。下面是一个示例全局数据文件 _data/links.json
:
{
"socials": {
"github": "<https://github.com/>",
"Whosebug": "<https://whosebug.com/>",
"twitter": "<https://twitter.com/>",
...
}
}
这样您就可以在整个 11ty 项目中使用 {{ foo }}
等插值访问 _data/links.json
中包含 link 定义的全局数据。如果您想在模板中使用该全局数据,您可以引用全局数据文件的名称 links
,然后根据需要访问对象键,例如 {{ links.socials.key }}
.
不幸的是,使用 [GitHub]({{ links.socials.github }})
是行不通的,但是为了避免在每个页面上添加 link 定义,您总是可以这样做:
---
title: Some title
templateEngineOverride: njk, md
---
<a href="{{ links.socials.github }}">GitHub</a>
或者,如果使用 Nunjucks 作为您的模板引擎,您可以使用 set
为您的社交 link 创建变量,并避免定义 Markdown 引用 link。
---
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>
我在我的 110 站点中使用 markdown reference links。
与其在每个页面上重复定义链接,不如将它们放在一个地方,然后在我的页面中引用它们。
例如 links.md
可以包含:
[github]: <https://github.com/>
[Whosebug]: <https://whosebug.com/>
然后任何页面都可以引用这些链接。
有人知道这是否可行吗?
如果您想在一个地方定义 link 并在您的模板中全局访问它们,您可以在包含 link 的 _data/*
目录中创建一个 global data file ] 定义,然后在你的 Markdown 文件中引用它们。下面是一个示例全局数据文件 _data/links.json
:
{
"socials": {
"github": "<https://github.com/>",
"Whosebug": "<https://whosebug.com/>",
"twitter": "<https://twitter.com/>",
...
}
}
这样您就可以在整个 11ty 项目中使用 {{ foo }}
等插值访问 _data/links.json
中包含 link 定义的全局数据。如果您想在模板中使用该全局数据,您可以引用全局数据文件的名称 links
,然后根据需要访问对象键,例如 {{ links.socials.key }}
.
不幸的是,使用 [GitHub]({{ links.socials.github }})
是行不通的,但是为了避免在每个页面上添加 link 定义,您总是可以这样做:
---
title: Some title
templateEngineOverride: njk, md
---
<a href="{{ links.socials.github }}">GitHub</a>
或者,如果使用 Nunjucks 作为您的模板引擎,您可以使用 set
为您的社交 link 创建变量,并避免定义 Markdown 引用 link。
---
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>