Layouto

记录一些测试结果

2023/05/30 GitHub 共 4815 字，约 14 分钟
Layouto

头信息

正是头信息开始让 Jekyll 变的很酷。任何只要包含 YAML 头信息的文件在 Jekyll 中都能被当做一个特殊的文件来处理。头信息必须在文件的开始部分，并且需要按照 YAML 的格式写在两行三虚线之间。下面是一个基本的例子：

---
layout: post
title: Blogging Like a Hacker
---

在这两行的三虚线之间，你可以设置预定义的变量（下面这个例子可以作为参考），甚至创建一个你自己定义的变量。这样在接下来的文件和任意模板中或者在包含这些页面或博客的模板中都可以通过使用 Liquid 标签来访问这些变量。

layout: 如果设置的话，会指定使用该模板文件。指定模板文件时候不需要文件扩展名。模板文件必须放在 _layouts 目录下。

permalink: 如果你需要让你发布的博客的 URL 地址不同于默认值 /year/month/day/title.html，那你就设置这个变量，然后变量值就会作为最终的 URL 地址。

published: 如果你不想在站点生成后展示某篇特定的博文，那么就设置（该博文的）该变量为 false。

date: 这里的日期会覆盖文章名字中的日期。这样就可以用来保障文章排序的正确。日期的具体格式为YYYY-MM-DD HH:MM:SS +/-TTTT；时，分，秒和时区都是可选的。

category/categories:除过将博客文章放在某个文件夹下面外，你还可以指定博客的一个或者多个分类属性。这样当你的站点生成后，这些文章就可以根据这些分类来阅读。categories 可以通过 YAML list，或者以逗号隔开的字符串指定。

tags: 类似分类 categories，一篇文章也可以给它增加一个或者多个标签。同样，tags 可以通过 YAML 列表或者以逗号隔开的字符串指定。

excerpt: 手动输入摘要

集合（Collections）

并非所有的都会是文章或页面。也许您想要记录您开源项目中涉及的各种解决方案，团队成员，或是某次会议记录。集合（Collection）允许您定义一种新的文档类型，它既可以像页面和文章那样工作，也可以拥有它们特有的属性和命名空间。

使用集合

第一步：让 Jekyll 读取您的集合

将下面的代码加入您的 _config.yml 文件，将 my_collection 替换为您集合的名字。

collections:
- my_collection

您也可以在配置中为你的集合加入具体的元数据：

collections:
  my_collection:
    foo: bar

集合也可以设置默认的属性：

defaults:
  - scope:
      path: ""
      type: my_collection
    values:
      layout: page

创建对应的文件夹（如 <source>/_my_collection）并添加文件。若 YAML 头信息存在，他将被作为数据读入，并且其后的任何信息都将被保存在文档的content 属性中。如果没有任何 YAML 头信息存在， Jekyll 将不会在您的集合中生成任何文件。

第三步：选择性渲染你的集合文件为独立文件

如果你希望 Jekyll 对每一个你集合中的文件，都创建一个公开的，渲染后的版本，请在_config.yml中，将你集合的元数据中将output键设置为true：

collections:
  my_collection:
    output: true

这将会依据每一个在集合中的文档创建一个文件。例如，你有一个_my_collection/some_subdir/some_doc.md文件，它将利用 Liquid 以及你选用的 Markdown 转换器创建一个<dest>/my_collection/some_subdir/some_doc.html文件。

如同设置了 Permalinks 属性的文章，这些文件的URL也可以通过对集合的permalink元数据进行设置来自定义。

collections:
  my_collection:
    output: true
    permalink: /awesome/:path/

例如，你有一个_my_collection/some_subdir/some_doc.md文件，它将写入到/awesome/some_subdir/some_doc/index.html路径下。

没有头信息的文件将被视为静态文件，它们仅会被简单拷贝到目的路径下，而不会被处理。

  • collection：所包含集合的标签
  • path： 文档相对于集合文件夹的路径
  • name： 文档的基本文件名，任何空格和非字母数字的字符将被替换为连字符
  • title： 文档的小写字母标题（在 头信息中定义），任何空格和非字母数字的字符将被替换为连字符。如果title在头信息中未定义，该值等同于name。
  • output_ext： 输出文件的文件扩展名

创建页面

作为写文章的补充，Jekyll 还可以创建静态页面。利用 Jekyll 带来的便利，你只需要复制文件或文件夹，就是这么简单。

像任何网站的配置一样，需要按约定在站点的根目录下找到index.html文件，这个文件将被做为主页显示出来。除非你的站点设置了其它的文件作为默认文件，这个文件就将是你的 Jekyll 生成站点的主页。

其它的页面的位置

将 HTML 文件或者 Markdown 放在哪里取决于你想让它们如何工作。有两种方式可以创建页面：

  • 将为页面准备的命名好的 HTML 文件或者 Markdown 文件放在站点的根目录下。
  • 在站点的根目录下为每一个页面创建一个文件夹，并把 index.html 文件或者 index.md 放在每个文件夹里。

这两种方法都可以工作（并且可以混合使用），它们唯一的区别就是访问的 URL 样式不同。

命名 HTML 文件

增加一个新页面的最简单方法就是把给 HTML 文件起一个适当的名字并放在根目录下。一般来说，一个站点下通常会有：主页 (homepage), 关于 (about), 和一个联系 (contact) 页。根目录下的文件结构和对应生成的 URL 会是下面的样子：

.
|-- _config.yml
|-- _includes/
|-- _layouts/
|-- _posts/
|-- _site/
|-- about.html    # => http://example.com/about.html
|-- index.html    # => http://example.com/
|-- other.md      # => http://example.com/other.html
└── contact.html  # => http://example.com/contact.html

上面的方法可以很好的工作，但是有些人不喜欢在 URL 中显示文件的扩展名。用 Jekyll 达到这种效果，你只需要为每个顶级页面创建一个文件夹，并包含一个 index.html 文件。这样，每个 URL 就将以文件夹的名字作为结尾，网站服务器会将对应的 index.html 展示给用户。下面是一个示例来展示这种结构的样子：

.
├── _config.yml
├── _includes/
├── _layouts/
├── _posts/
├── _site/
├── about/
|   └── index.html  # => http://example.com/about/
├── contact/
|   └── index.html  # => http://example.com/contact/
|── other/
|   └── index.md    # => http://example.com/other/
└── index.html      # => http://example.com/

这种方式可能不适合每个人，对那些喜欢干净 URL 的人这是一种简单有效的方法。最终选择哪种方法完全由你来决定！

干净的 URLs 也可以通过在头信息中定义　permalink　实现。就上边的第一个例子而言，在 other.md 文件的头信息中定义：permalink: /other，你就能得到 URL http://example.com/other

文章文件夹

所有的文章都在 _posts 文件夹中。这些文件可以用 Markdown 编写，也可以用 Textile 格式编写。只要文件中有 YAML 头信息，它们就会从源格式转化成 HTML 页面，从而成为你的静态网站的一部分。

创建文章的文件

发表一篇新文章，你所需要做的就是在 _posts 文件夹中创建一个新的文件。文件名的命名非常重要。Jekyll 要求一篇文章的文件名遵循下面的格式：

年-月-日-标题.MARKUP
2011-12-31-new-years-eve-is-awesome.md
2012-09-12-how-to-write-a-blog.textile

格式要求 .md文件文件名要求2023-05-20-标题(一定要用日期吗)

文章基本信息怎么定义 title:这里代表文章标题 categories: 这里代表文章分类 .md文件文件名会作为文章链接名

你可以通用修改 _config.yml文件来轻松的开始搭建自己的博客:

# Site settings
title: Hux Blog             # 你的博客网站标题
SEOTitle: Hux Blog			# 在后面会详细谈到
description: "Cool Blog"    # 随便说点，描述一下

# SNS settings      
github_username: huxpro     # 你的github账号
weibo_username: huxpro      # 你的微博账号，底部链接会自动更新的。

# Build settings
# paginate: 10              # 一页你准备放几篇文章

Jekyll官方网站还有很多的参数可以调，比如设置文章的链接形式…网址在这里：Jekyll - Official Site 中文版的在这里：Jekyll中文.

Comment

博客不仅支持多说Duoshuo评论系统，也支持Disqus评论系统。

Disqus优点是：国际比较流行，界面也很大气、简介，如果有人评论，还能实时通知，直接回复通知的邮件就行了；缺点是：评论必须要去注册一个disqus账号，分享一般只有Facebook和Twitter，另外在墙内加载速度略慢了一点。想要知道长啥样，可以看以前的版本点这里 最下面就可以看到。

多说 优点是：支持国内各主流社交软件(微博，微信，豆瓣，QQ空间 …)一键分享按钮功能，另外登陆比较方便，管理界面也是纯中文的，相对于disqus全英文的要容易操作一些；缺点是：就是界面丑了一点。 当然你是可以自定义界面的css的，详情请看多说开发者文档 http://dev.duoshuo.com/docs/5003ecd94cab3e7250000008 。

首先，你需要去注册一个账号，不管是disqus还是多说的。不要直接使用我的啊！

其次，你只需要在下面的yaml头文件中设置一下就可以了。

duoshuo_username: _你的用户名_
# 或者
disqus_username: _你的用户名_

最后多说是支持分享的，如果你不想分享，请这样设置：duoshuo_share: false。你可以同时使用两个评论系统，不过个人感觉怪怪的。

##安装 Git https://docs.gitlab.cn/jh/topics/git/how_to_install_git/
命令行使用 Git https://docs.gitlab.cn/jh/gitlab-basics/start-using-git.html
git路径 C:\Program Files\Git 先输入：$ git config –global user.name “你的名字” 再输入：$ git config –global user.email “你的邮箱地址”

Jekyll 中文文档

文档信息

Search

    Table of Contents