Jekyll Front Matter详解10个实用示例掌握YAML元数据控制文章与页面【免费下载链接】jekyll:globe_with_meridians: Jekyll is a blog-aware static site generator in Ruby项目地址: https://gitcode.com/gh_mirrors/je/jekyllJekyll Front Matter前置元数据是 Jekyll 静态博客最核心的控制机制只需在 Markdown 或 HTML 文件开头写一段 YAML 格式的元数据就能控制文章的标题、日期、分类、标签、布局、URL 乃至是否发布。本文面向新手通过 10 个实用示例带你快速掌握 Jekyll YAML 元数据的完整用法让你对文章与页面的每一个细节尽在掌控。什么是 Jekyll Front Matter任何文件只要以三个破折号---开头并包裹一段合法的 YAML 文本Jekyll 就会将它识别为 Front Matter并对该文件进行特殊处理--- layout: post title: 我的第一篇文章 --- 正文内容从这里开始……关键规则 Front Matter必须位于文件最开头且必须是---起始Jekyll 源码中的 has_yaml_header? 方法 正是靠检查文件首行是否为---来判断 两行---之间可以是预定义变量也可以是你自创的自定义变量 即使中间留空只要存在空白的---块文件也会被 Jekyll 处理⚠️ 使用 UTF-8 编码时确保文件没有 BOM 头否则会导致意外问题官方说明可参考 Front Matter 文档。10个实用示例从入门到精通示例1用 layout 指定页面布局layout指定该文件使用_layouts目录下的哪个模板文件写文件名、不带扩展名。这是使用频率最高的变量--- layout: default title: 关于我 ---Jekyll 会将页面内容注入到布局的{{ content }}占位符中多个布局还能层层嵌套原理如下图所示内容从 document 逐层注入到最外层布局小技巧写作layout: nil或~可让文章不使用任何布局这在生成 RSS、JSON 等纯数据页面时非常有用。示例2用 permalink 自定义文章 URL默认情况下文章地址为/年/月/日/标题.html。想改成固定路径用permalink--- permalink: /my-first-post/ ---设置后这篇文章最终会被输出到你指定的 URL适合做置顶文章或重要落地页。示例3用 published 控制文章是否发布--- title: 草稿文章 published: false ---设为false后该文章不会出现在生成结果中但本地执行jekyll build --unpublished时仍能看到它非常适合写完先藏着的场景。示例4用 date 覆盖文章日期文章的默认日期取自文件名如2010-01-09-hello.markdown。如果日期写错了不用改文件名直接在 Front Matter 里覆盖即可--- date: 2010-01-10 08:30:00 0800 ---日期格式为YYYY-MM-DD HH:MM:SS /-TTTT时、分、秒、时区偏移均可省略。测试仓库中就有一个真实例子2010-01-09-date-override.markdown。示例5用 categories 指定文章分类不依赖文件夹结构直接声明分类--- categories: - 技术 - Ruby ---支持 YAML 列表也支持空格分隔的字符串写法。测试用例 2009-01-27-array-categories.markdown 展示了这种数组写法。示例6用 tags 为文章打标签与分类类似标签更轻量、更灵活一篇文章可挂多个--- tags: - 前端 - Jekyll - 教程 ---配合标签页、归档页可以做出非常丰富的博客导航。示例7用 excerpt 自定义摘要列表页默认截取文章第一段作为摘要。想自定义在 Front Matter 里直接写--- excerpt: 这里显示我亲手写好的摘要文字 ---参考示例 2013-04-11-custom-excerpt.markdown。示例8创建自定义变量除了预定义变量Front Matter 里的一切内容都是合法 YAML——你可以自由发明变量--- author: 小杰 difficulty: 入门 food: Pizza ---之后在页面、布局、includes 中都能用 Liquid 访问{{ page.author }}、{{ page.food }}。这是实现多作者博客系列文章标记等功能的基石。示例9用 Front Matter Defaults 批量设默认值如果每篇文章都要写layout: post太啰嗦了。Jekyll 允许在_config.yml中用defaults键按作用域批量设置默认元数据defaults: - scope: path: type: posts values: layout: post author: 小杰单篇文章仍可在自己的 Front Matter 中覆盖这些默认值。完整规则请见 Front Matter Defaults 文档。示例10空 Front Matter 也有用有时候你只是想激活 Liquid 语法却不需要任何变量--- ---这样 Jekyll 同样会处理该文件常用于 CSS、RSS 等文件相当于一个开关。常见问题与避坑指南问题解决办法元数据不生效确认---在第一行且前后各有一行---中文乱码/生成异常去掉文件头的 BOM 字符保存为 UTF-8修改后没变化保存为 UTF-8 无 BOM并重启jekyll serve行尾空格允许存在不会报错见 extra-spaces 测试一句话总结预定义变量管全局layout/permalink/published/date/categories/tags/excerpt自定义变量管个性defaults管效率——三者配合Jekyll Front Matter 就能撑起整个站点的元数据中枢。延伸阅读 Front Matter 官方文档 Front Matter Defaults 配置文档 测试用例Front Matter 日期覆盖 测试用例YAML 数组分类【免费下载链接】jekyll:globe_with_meridians: Jekyll is a blog-aware static site generator in Ruby项目地址: https://gitcode.com/gh_mirrors/je/jekyll创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 Jekyll Front Matter详解：10个实用示例掌握YAML元数据控制文章与页面
Jekyll Front Matter详解10个实用示例掌握YAML元数据控制文章与页面【免费下载链接】jekyll:globe_with_meridians: Jekyll is a blog-aware static site generator in Ruby项目地址: https://gitcode.com/gh_mirrors/je/jekyllJekyll Front Matter前置元数据是 Jekyll 静态博客最核心的控制机制只需在 Markdown 或 HTML 文件开头写一段 YAML 格式的元数据就能控制文章的标题、日期、分类、标签、布局、URL 乃至是否发布。本文面向新手通过 10 个实用示例带你快速掌握 Jekyll YAML 元数据的完整用法让你对文章与页面的每一个细节尽在掌控。什么是 Jekyll Front Matter任何文件只要以三个破折号---开头并包裹一段合法的 YAML 文本Jekyll 就会将它识别为 Front Matter并对该文件进行特殊处理--- layout: post title: 我的第一篇文章 --- 正文内容从这里开始……关键规则 Front Matter必须位于文件最开头且必须是---起始Jekyll 源码中的 has_yaml_header? 方法 正是靠检查文件首行是否为---来判断 两行---之间可以是预定义变量也可以是你自创的自定义变量 即使中间留空只要存在空白的---块文件也会被 Jekyll 处理⚠️ 使用 UTF-8 编码时确保文件没有 BOM 头否则会导致意外问题官方说明可参考 Front Matter 文档。10个实用示例从入门到精通示例1用 layout 指定页面布局layout指定该文件使用_layouts目录下的哪个模板文件写文件名、不带扩展名。这是使用频率最高的变量--- layout: default title: 关于我 ---Jekyll 会将页面内容注入到布局的{{ content }}占位符中多个布局还能层层嵌套原理如下图所示内容从 document 逐层注入到最外层布局小技巧写作layout: nil或~可让文章不使用任何布局这在生成 RSS、JSON 等纯数据页面时非常有用。示例2用 permalink 自定义文章 URL默认情况下文章地址为/年/月/日/标题.html。想改成固定路径用permalink--- permalink: /my-first-post/ ---设置后这篇文章最终会被输出到你指定的 URL适合做置顶文章或重要落地页。示例3用 published 控制文章是否发布--- title: 草稿文章 published: false ---设为false后该文章不会出现在生成结果中但本地执行jekyll build --unpublished时仍能看到它非常适合写完先藏着的场景。示例4用 date 覆盖文章日期文章的默认日期取自文件名如2010-01-09-hello.markdown。如果日期写错了不用改文件名直接在 Front Matter 里覆盖即可--- date: 2010-01-10 08:30:00 0800 ---日期格式为YYYY-MM-DD HH:MM:SS /-TTTT时、分、秒、时区偏移均可省略。测试仓库中就有一个真实例子2010-01-09-date-override.markdown。示例5用 categories 指定文章分类不依赖文件夹结构直接声明分类--- categories: - 技术 - Ruby ---支持 YAML 列表也支持空格分隔的字符串写法。测试用例 2009-01-27-array-categories.markdown 展示了这种数组写法。示例6用 tags 为文章打标签与分类类似标签更轻量、更灵活一篇文章可挂多个--- tags: - 前端 - Jekyll - 教程 ---配合标签页、归档页可以做出非常丰富的博客导航。示例7用 excerpt 自定义摘要列表页默认截取文章第一段作为摘要。想自定义在 Front Matter 里直接写--- excerpt: 这里显示我亲手写好的摘要文字 ---参考示例 2013-04-11-custom-excerpt.markdown。示例8创建自定义变量除了预定义变量Front Matter 里的一切内容都是合法 YAML——你可以自由发明变量--- author: 小杰 difficulty: 入门 food: Pizza ---之后在页面、布局、includes 中都能用 Liquid 访问{{ page.author }}、{{ page.food }}。这是实现多作者博客系列文章标记等功能的基石。示例9用 Front Matter Defaults 批量设默认值如果每篇文章都要写layout: post太啰嗦了。Jekyll 允许在_config.yml中用defaults键按作用域批量设置默认元数据defaults: - scope: path: type: posts values: layout: post author: 小杰单篇文章仍可在自己的 Front Matter 中覆盖这些默认值。完整规则请见 Front Matter Defaults 文档。示例10空 Front Matter 也有用有时候你只是想激活 Liquid 语法却不需要任何变量--- ---这样 Jekyll 同样会处理该文件常用于 CSS、RSS 等文件相当于一个开关。常见问题与避坑指南问题解决办法元数据不生效确认---在第一行且前后各有一行---中文乱码/生成异常去掉文件头的 BOM 字符保存为 UTF-8修改后没变化保存为 UTF-8 无 BOM并重启jekyll serve行尾空格允许存在不会报错见 extra-spaces 测试一句话总结预定义变量管全局layout/permalink/published/date/categories/tags/excerpt自定义变量管个性defaults管效率——三者配合Jekyll Front Matter 就能撑起整个站点的元数据中枢。延伸阅读 Front Matter 官方文档 Front Matter Defaults 配置文档 测试用例Front Matter 日期覆盖 测试用例YAML 数组分类【免费下载链接】jekyll:globe_with_meridians: Jekyll is a blog-aware static site generator in Ruby项目地址: https://gitcode.com/gh_mirrors/je/jekyll创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考