【问题标题】:Parse liquid variables in YAML front matter in Jekyll before processing the page在处理页面之前在 Jekyll 中解析 YAML 前端的液体变量
【发布时间】:2019-03-16 14:01:05
【问题描述】:

我正在使用jekyll-postfiles 插件让我的生活更轻松。这个插件允许我在我的博客文章的子文件夹中拥有静态内容。例如:

_posts/
├── 2018-10-10-a.md
└── 2018-10-11-b/
    ├── 2018-10-11-b.md
    └── b.png

我可以将图像用作降价中的本地文件:![](b.png) 中的 2018-10-11-b.md。这个插件使复制文件和使链接正常工作的所有魔力。

但现在我想使用jekyll-seo-tag 并且我想像这样设置 YAML 变量:

---
image: "{{ page.url }}b.png"
---

这只是为了在 HTML 文件中创建自定义元数据,我没有在我的博客文章中使用该变量。但我无法完成这项工作。 page.urlliquid 变量未展开,最终元数据如下所示:

<meta property="og:image" content="myBlog/%7B%7B%20page.url%20%7D%7D%2Fmap.png" />

代替:

<meta property="og:image" content="myBlog/2018/10/11/b/b.png" />

此属性位于 html 页面的head 中。 StackOverflow 中的一些问题展示了如何从前端获取变量 并解析文档正文中的液体标记。我需要的是在处理markdown文件之前解析液体标记。

是否可以让 YAML 前端在处理文件之前解析液体变量?

【问题讨论】:

标签: jekyll liquid


【解决方案1】:

我不清楚为什么前面的内容应该包含一个变量。

在大多数情况下,您不需要在前面添加变量。我认为您的情况也是如此。我会将 front matter 变量移动到布局文件中。因此,布局文件应如下所示:

<meta property="og:image" content="myBlog/{{ page.url }}/{{ page.image }}" />

...前面的内容应该是这样的:

---
image: "b.png"
---

搜索引擎优化插件可以通过SEO without plugin轻松交换,由我编写。很容易根据您的需要进行调整。这是它添加到头部的代码:

<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">

<title>{% if page.title %}{{ page.title }} | {% endif %}{{ site.title }}</title>
{% assign pagecontent_description = page.content | markdownify | replace: '.', '. ' | replace: '</h2>', ': ' | replace: '</h3>', ': ' | replace: '</h4>', ': ' | strip_html | strip_newlines | replace: '  ', ' ' | truncate: 160 %}
<meta name="description" content="{% if pagecontent_description.size > 10 %}{{ pagecontent_description }}{% else %}{{ site.description }}{% endif %}">

<link rel="shortcut icon" type="image/png" href="/img/icon-196x196.png">
<link rel="shortcut icon" sizes="196x196" href="/img/icon-196x196.png">
<link rel="apple-touch-icon" href="/img/icon-196x196.png">

<!-- Facebook and Twitter integration -->
<meta property="og:title" content="{{ page.title }}"/>
{% if page.image %}<meta property="og:image" content="{{ page.image }}"/>{% endif %}
<meta property="og:url" content="{{ site.url }}{{ page.url }}"/>
<meta property="og:type" content="article">
<meta property="og:image" content="{{ site.url }}{{ page.image }}"/>
<meta property="og:site_name" content="{{ site.title }}"/>
<meta property="og:description" content="{% if pagecontent_description.size > 10 %}{{ pagecontent_description }}{% else %}{{ site.description }}{% endif %}"/>

<meta name="twitter:card" content="summary">
<meta name="twitter:site" content="@{{ site.twitter_url }}">
<meta name="twitter:title" content="{{ page.title }}" />
{% if page.image %}<meta name="twitter:image" content="{{ site.url }}{{ page.image }}" />{% endif %}
<meta name="twitter:url" content="{{ site.url }}{{ page.url }}" />
<meta name="twitter:description" content="{% if pagecontent_description.size > 10 %}{{ pagecontent_description }}{% else %}{{ site.description }}{% endif %}" />

<link rel="canonical" href="{{ page.url | replace:'index.html','' | prepend: site.baseurl | prepend: site.url }}">
<link rel="alternate" type="application/rss+xml" title="{{ site.title }}" href="{{ "/feed.xml" | prepend: site.baseurl | prepend: site.url }}">
<link rel="sitemap" type="application/xml" title="Sitemap" href="{{ "/sitemap.xml" | prepend: site.baseurl | prepend: site.url }}" />

如果您有任何问题,请告诉我。

【讨论】:

  • 在这种情况下,前面的内容应该包含一个变量,因为我有一个插件可以根据每个页面创建所有 HTML &lt;meta properties&gt;。如果我改变布局,我会重写插件......
  • 你用一个插件在你的脑海里写了几行HTML,当它没有达到你想要的效果时你拒绝放弃或重写它?你认为解决方案是把变量放在你的前面吗?我很抱歉,但这不是要走的路。你走错了路。
  • 注意不能在前面使用变量:stackoverflow.com/questions/37512696/…
  • 哦,这个没有插件的SEO黑魔法正是我所需要的!
  • And you think the solution is to put variables in your front matter? 如果 Jekyll 支持前端变量,我肯定会在前端使用变量,因为它比重写插件更简单。
猜你喜欢
  • 2016-05-10
  • 2013-01-07
  • 2012-07-30
  • 2016-12-28
  • 2017-01-08
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多