1

我正在开发一个基于 Eleventy 的博客和网站。社交媒体共享功能，如 Facebook OpenGraph 和Twitter 卡片，需要有一个完整的绝对 URL 来指向图片等资源。Twitter 尤其拒绝任何与图像相关的 URL。

Eleventy 是否提供了一种生成完整 URL 的本地方式？由于 Eleventy 是一个生成的静态站点，与托管的 Web 服务器相反，它不能像其他系统那样从 HTTP 标头中获取此信息。如果 Netlify 提供任何从 JS 生成 URL 的工具，则该站点托管在 Netlify 上。我已经有一些任务来使用 Gulp 生成调整大小的图像。

目前我只是使用我自己的现场配置来生成 Nunjucks 模板中的 URL：

{# page_twitter_image is a site root relative path to the image #}
{% if page_twitter_image %}
<meta name="twitter:image" content="{{ site_base_url }}{{ page_twitter_image }}" />
{% endif %}

有关我的 URL 生成的更多信息在这里。

4

2 回答 2

1

官方RSS 插件包括一个非常简单的 Nunjuck 过滤器absoluteUrl。如果您添加此插件，您的代码可能是：

<meta name="twitter:image" content="{{ page_twitter_image | url | absoluteUrl(site_base_url) }}" />

易读性改进不大，但我想更具前瞻性。

于 2020-02-29T15:47:52.067 回答
1

据我所知（基于文档：https ://www.11ty.dev/docs/data/#page-variable-contents ）答案是否定的。我认为您的解决方案是有道理的。

我正在提交一个 ER，以便可以访问它。我认为它应该可以在页面数据中使用，也可以通过短代码/过滤器使用。

于 2020-02-25T19:26:37.920 回答