Jekyll:动态 CSS 类 的 Liquid 自定义输出语句
Jekyll: Liquid custom output statement for dynamic CSS classes
我的 Jekyll 网站有两种内容:个人和专业。
我想强调访问者当前正在使用动态阅读的内容类型 CSS classes:
- 如果访问者在标记为 "personal" 的页面上,我的
<main>
元素的 class 应该是 "personal-content"
.
- 如果访问者在标记为 "professional" 的页面上,我的
<main>
元素的 class 应该是 "professional-content"
.
- 否则,class 应该是
"site-content"
。
在每个页面的开头,我创建了一个输出语句,我将其设置为 "personal"
或 "professional"
,例如:
---
content: "personal"
----
然后我在我的标签中使用这个输出语句,如下所示:(为了阅读目的而缩进)
<main
{% if page.content %}
class="{{ page.content }}-content"
{% else %}
class="site-content"
{% endif %}
>
但是我只看到 site-content
class 的样式。我做错了什么?
感谢上面的评论,我修复了它!
问题是我没有像我想的那样使用自定义输出语句:{{ content }}
已经被 Jekyll 用于将降价文章包含到 HTML 布局。
所以我将 {{ page.content }}
切换为 {{ page.contenttype }}
,效果很好!
警告:
我还必须更改我为输出语句提供的值。 professional
工作正常,但由于某种原因 personal
正在返回 nil
。所以我只是将它们切换为 pro
和 perso
瞧瞧。
我的 Jekyll 网站有两种内容:个人和专业。
我想强调访问者当前正在使用动态阅读的内容类型 CSS classes:
- 如果访问者在标记为 "personal" 的页面上,我的
<main>
元素的 class 应该是"personal-content"
. - 如果访问者在标记为 "professional" 的页面上,我的
<main>
元素的 class 应该是"professional-content"
. - 否则,class 应该是
"site-content"
。
在每个页面的开头,我创建了一个输出语句,我将其设置为 "personal"
或 "professional"
,例如:
---
content: "personal"
----
然后我在我的标签中使用这个输出语句,如下所示:(为了阅读目的而缩进)
<main
{% if page.content %}
class="{{ page.content }}-content"
{% else %}
class="site-content"
{% endif %}
>
但是我只看到 site-content
class 的样式。我做错了什么?
感谢上面的评论,我修复了它!
问题是我没有像我想的那样使用自定义输出语句:{{ content }}
已经被 Jekyll 用于将降价文章包含到 HTML 布局。
所以我将 {{ page.content }}
切换为 {{ page.contenttype }}
,效果很好!
警告:
我还必须更改我为输出语句提供的值。 professional
工作正常,但由于某种原因 personal
正在返回 nil
。所以我只是将它们切换为 pro
和 perso
瞧瞧。