阅读本文，将学到如何用 Jekyll 做多种类型的页面，并在首页的列表中将这些不同种类的页面合并按日期排序。...（可选）第三步：添加自定义页面类型默认元数据 defaults: - scope: path: "_article" type: "article" values:...（可选）第四步：添加自定义页面类型的页面列表 就像 posts 列表的页面一样制作一个 article 列表。...制作一个合并了博客和其他页面类型的页面列表 我希望在首页中混杂我的博客和胡思乱想，于是必须将两种不同类型的集合合并。...---- 参考资料 Concat arrays in Jekyll(liquid) Sorting & ordering collections · Issue #2515 · jekyll/jekyll
引入页面配置元数据 毕竟博客有多篇，终归要引入配置的。现在我们为这篇文章配置两种语言。（考虑到更通用的情况，我将一种语言定义为一种 version。）.../multi-language-in-jekyll-blog.html 这个配置是要放到博客 markdown 的元数据头里的。...现在，我们把之前写的 select 搬到 post-version-selector.html 文件中，并引入页面中配置好的各语言路径。...liquid 中如果要遍历 key-value 值，需要使用 for 来取出其中的 key 和 value。...---- 参考资料 jekyll - Iterate over hashes in liquid templates - Stack Overflow How can I set the default
pages就是为也解决这个问题而出现，允许开发者自定义一个展示页面，来替代原有的代码列表。...---- 总结一下 对于上面所述的github Pages(以下称gh-Pages)是github给用户提供一个“静态页面的web服务器”,我们可以根据需要把页面上传到指定的仓库中，可以通过github...的支持Liquid 语法,详细参见:Liquid for Designers 4....创建首页，首页是为了显示文章列表的网页，我们需要做的是遍历_post文件夹中的所有文章，然后展现出来,添加简单的代码如下： --- layout: default title:...到这里，我们使用jekyll根据我们写的模板生成了对应的静态页面,下面我们把数据传入到github的gh-pages下面。 git add .
$ cd jekyll_demo $ git init 然后，创建一个没有父节点的分支gh-pages。因为github规定，只有该分支中的页面，才会生成网页文件。 ... {{ page.date | date_to_string }} 每篇文章的头部，必须有一个yaml文件头，用来设置一些元数据。...它用三根短划线”—“，标记开始和结束，里面每一行设置一种元数据。”...这里要注意的是，Liquid模板语言规定，输出内容使用两层大括号，单纯的命令使用一层大括号。至于{{site.baseurl}}就是_config.yml中设置的baseurl变量。...文章页面： ? 第七步，绑定域名。 如果你不想用http://username.github.com/jekyll_demo/这个域名，可以换成自己的域名。
$ cd jekyll_demo $ git init 然后，创建一个没有父节点的分支gh-pages。因为github规定，只有该分支中的页面，才会生成网页文件。 ...> 我的第一篇文章 {{ page.date | date_to_string }} 每篇文章的头部，必须有一个yaml文件头，用来设置一些元数据。...它用三根短划线"---"，标记开始和结束，里面每一行设置一种元数据。"...这里要注意的是，Liquid模板语言规定，输出内容使用两层大括号，单纯的命令使用一层大括号。至于{{site.baseurl}}就是_config.yml中设置的baseurl变量。...文章页面： ? 第七步，绑定域名。 如果你不想用http://username.github.com/jekyll_demo/这个域名，可以换成自己的域名。
Jekyll 是一个简单的免费的静态网页生成工具，不需要数据库支持，可以配合第三方服务，可以免费部署在 Github 上，而且可以绑定自己的域名。...简介 Jekyll 是一个简单的博客形态的静态站点生产机器。...它有一个模版目录，其中包含原始文本格式的文档，通过一个转换器（如 Markdown）和我们的 Liquid 渲染器转化成一个完整的可发布的静态网站，你可以发布在任何你喜爱的服务器上。...Jekyll 也可以运行在 GitHub Page 上，也就是说，你可以使用 GitHub 的服务来搭建你的项目页面、博客或者网站，而且是完全免费的。...bundle exec jekyll serve 打开浏览器 http://localhost:4000 ，可以看到示例页面 更换主题 Jekyll 支持很多主题，列表 我们以 jekyll-theme-yat
第四步:上传博客到Github中即可访问自己的博客。 ---- 二、Jekyll目录和文件结构介绍 文件 / 目录 描述 _config.yml 保存配置数据。...这些文件的格式中都没有 title.MARKUP 数据。学习如何使用 drafts. _includes 你可以加载这些包含部分到你的布局或者文章中以方便重用。...布局可以在 YAML 头信息中根据不同文章进行选择。 这将在下一个部分进行介绍。标签 {{ content }} 可以将content插入页面中。 _posts 这里放的就是你的文章了。...The permalinks 可以在文章中自己定制，但是数据和标记语言都是根据文件名来确定的。...---- 三、相关语法官网 Liquid语法: https://help.shopify.com/themes/liquid Jekyll中文网: http://jekyll.com.cn/ 在本地预览博客效果
灵活多样化：由于其先进模板系统和强大分类系统，Hugo 可以用于创建各种类型的网站，包括企业、政府、非营利组织等官方机构；新闻媒体、事件展示及项目介绍等专题页面；文档库；图片集合与个人博客等。...，方便国际化项目的开发； 模块化设计：可通过 Hugo Modules 与其他项目共享内容、资源、数据和主题等。...Markdown 和 Liquid 模板支持：通过渲染 Markdown 和 Liquid 模板，Jekyll 可以将您提供的内容转换为完整且静态化的可以直接托管在 Apache、Nginx 或其他 Web...内置插件和变量功能：内置 Liquid 扩展，自定义 Permalinks 等特性使得在建立并管理页面时更加简便。...如果你正在寻找一个简单但又功能齐全、容易上手操作与维护、并拥有广泛应用领域 (从个人博客到企业级门户) 静态网站生成器，elevevnty 将会是您理想之选！
它有一个模版目录，其中包含原始文本格式的文档，通过 Markdown 以及 Liquid 转化成一个完整的可发布的静态网站，你可以发布在任何你喜爱的服务器上。...Jekyll、Hugo、Hexo 也可以运行在 码云（Gitee.com） Pages 上，也就是说，你可以使用码云的服务来搭建你的仓库页面、博客或者网站，而且是完全免费的。...但是和WordPress又有很大的不同，原因是jekyll只是一个生成静态网页的工具， 不需要数据库支持。但是可以配合第三方服务,例如Disqus。...官网：http://jekyllrb.com 优点： 1、jekyll是一个静态文件生成器，网站不需要数据库，只要把自己的博客放到对应的目录即可。...（这点本人非常喜欢） 缺点： 1、jekyll用的liquid语法确实不是对程序员友好的，。不过jekyll功能比hexo强大很多，有时间折腾的可以选它。
Eleventy 是一个基于 JavaScript 的 Jekyll 和 Hugo 的替代品，用于构建静态网站。 静态网站生成器是一种基于原始数据和一组模板生成完整的静态 HTML 网站的工具。...它可以自动完成单个 HTML 页面的编码任务，并让这些页面准备好为用户服务。由于 HTML 页面是预先建立的，它们在用户的浏览器中加载得非常快。...由于这些原因，企业经常使用它们来记录应用编程接口 （API）、数据库模式和其他信息。文档是软件开发、设计和其他方面技术的一个重要组成部分。...Eleventy: 一个静态网站生成器 Eleventy（11ty）是一个简单的静态网站生成器，是 Jekyll 和 Hugo 的替代品。...在 Linux 上，你可以使用你的包管理器安装 Node.js： $ sudo dnf install nodejs 如果你的包管理器没有 Node.js，或者你不在 Linux 上，你可以从 Node.js
虽然标签有标签分类，但是因为存在大量重复也不是很方便； 如果想要将文章整理成一个系列或者专题，恐怕比较困难，只能通过建立单独的页面和编写代码的方式生成列表。...实现 代码高亮 Jekyll 代码高亮可以使用 Pygments、Rouge、Prism、Highlight JS等工具实现，据说大部分的高亮博客中基本上都是使用 Pygments。...# prism.rb module Jekyll class PrismBlock < Liquid::Block include Liquid::StandardFilters...其实在 Jekyll 中要做到这个也不是很难，只需要对整个文章的内容进行字符计数即可。...参考资料 让 Jekyll 支持 LaTex 数学公式（MathJax v3） Jekyll 实现文章阅读耗时与字数统计 Jekyll 中如何做中文字数统计 版权声明：如无特别声明，本文版权归 仲儿的自留地
从wordpress导出数据 我参考前面诸位写出来的ruby代码：wordpress2Markdown 这个ruby脚本的功能： 循环匹配多种代码块，替换为 octopress 格式的代码块 替换url...中的汉字为拼音，并去掉不能转换的标点符号等 输出文件到 ansi as utf-8 格式的文件中，避免中文字符乱码 我碰到的问题 第一个: rake aborted!...用上面的语句替代 rake 执行命令 第二个: * * Invoke generate (first_time) * * Execute generate # # Generating Site with Jekyll...后面必须要有空格 第三个： D:\Dray\U\Git\MyOctopressBlogTest>bundle exec rake preview Starting to watch source with Jekyll...Liquid Exception: incompatible character encodings: UTF-8 and CP850 in atom.xml Liquid Exception: incompatible
Jekyll是一个用Ruby编写的静态站点生成器，支持博客并与Github页面整合。因为Github只负责托管，这种设置使数据分析共享和可视化变得简单。...本节中的步骤可以从本地计算机或使用Jekyll博客的Linode完成。如果您使用Linode，则可以使用ngrok查看笔记本。...Iris数据集将用作生成本指南中输出的示例。 1.打开感兴趣的笔记本，或使用下面的代码创建示例笔记本。运行所有相关单元格，以便在页面上显示你想要在Jekyll博客上显示的内容。...如果日期格式不正确，帖子可能不会出现在博客上： touch YYYY-MM-DD-example-post.md 4.markdown文件应以三个破折号开头并包含标题，这些标题为Jekyll提供了适当的页面数据以便填充帖子的信息...博客，您应该会看到指向新帖子的标题链接（示例中为“超赞的数据可视化”）。
继上一轮改造过后，比较拖页面加载速度的主要有三点： 页面首个请求响应时间； 图片资源加载时间； 站内搜索引用的 JSON 资源加载时间。...第 1 点在页面仍然托管在 GitHub Pages 的前提下，似乎没有什么好办法能产生质的飞跃；本篇主要改善了第 2 点和第 3 点。...当然也有，我们从 Jekyll 的 layout 机制来想办法。...Jekyll 的 layout 可以理解为页面模板，它是可以继承的，比如我的博客的所有页面模板有一个共同的祖先模板 _layouts/default.html，模板里可以使用 Liquid 语法对内容进行处理...0x02 站内搜索引用的 JSON 资源加速 我是使用 Simple-Jekyll-Search 这个 JavaScript 库来实现站内搜索的，它的搜索数据是来自一个动态生成的 JSON 文件。
它有一个模版目录，其中包含原始文本格式的文档，通过一个转换器（如 Markdown）和我们的 Liquid 渲染器转化成一个完整的可发布的静态网站，你可以发布在任何你喜爱的服务器上。...由于系统默认Ruby安装过程中容易出现各种问题，因此建议自定义安装新的Ruby。关于卸载及重装 Ruby 和 Jekyll的详细内容，也可以参考文章iMac搭建Jekyll本地环境。...我选择直接从Github下载我的博客相关的内容（对应地址为：https://github.com/bihe0832/bihe0832.github.io） 对于基于Jekyll的静态站点的目录结构，可以参考官网提供的...如下图，点击新建环境，然后在弹框中输入你自定义的环境名称，选择付费模式，然后点击下方的「立即开通」。 qcloud_jekyll_evn.png 之后就进入了环境的初始化阶段，初始化比较久。...是否同意 Cloudbase CLI 收集您的使用数据以改进产品？
它有一个模版目录，其中包含原始文本格式的文档，通过一个转换器（如 Markdown）和我们的 Liquid 渲染器转化成一个完整的可发布的静态网站，你可以发布在任何你喜爱的服务器上。...Jekyll 也可以运行在 GitHub Page 上，也就是说，你可以使用 GitHub 的服务来搭建你的项目页面、博客或者网站，而且是完全免费的。...但如果我们只是在 GitHub 上面使用的话，到不需要知道 Jekyll 的语法，一般 Github 会自动将我们写的 Markdown 文件转换成静态页面。...构建一个技术博客很简单，基本上步骤就是网上找一个自己喜欢的主题，直接 Fork 到自己的 Github ，然后在删掉原博客中的内容，在上传自己的文章即可，以我自己的博客为例。...仍然把博客托管在 Github 上面，每次提交完代码后，在腾讯云上面执行一个脚本，这个脚本会自动从 Github 拉取最新更新的文件，并自动生产静态的 Html 文件推送到 Nginx 目录，域名重新指向这台服务器
它有一个模版目录，其中包含原始文本格式的文档，通过一个转换器（如 Markdown）和我们的 Liquid 渲染器转化成一个完整的可发布的静态网站，你可以发布在任何你喜爱的服务器上。...Jekyll 也可以运行在 GitHub Pages 上，也就是说，你可以使用 GitHub 的服务来搭建你的项目页面、博客或者网站，而且是完全免费的。...GitHub Pages 是一个静态网站托管服务，直接从github仓库托管你个人、公司或者项目页面 ，并且不需要你写任何后端语言来支持。...我在对这个模板进行改造的过程中也慢慢熟悉了 jekyll 的目录结构和操作方式。...这些文件的格式中都没有title.MARKUP数据。
在互联网中，博客是诞生比较早的载体，然而随着时代的发展，越来越多的博客平台已经关闭，在这个时候人们逐渐意识到，拥有一个自己的博客无论是对自己，还是对自己的后代都是非常有帮助意义的。...博客有很多种类型，有静态博客，就是内容是通过文档记录的，还有动态博客，就是内容是通过数据库记录的。今天我们主要讨论下静态博客，以及那些生成静态博客的工具。...jekyll 使用ruby语言开发的静态博客系统，它内嵌liquid语言模板引擎，支持标签和过滤器。...它支持自定义url地址，同时，它还支持页面的自定义布局设计，更重要的一点，如果你之前使用了其它的博客系统，它是支持博客迁移的，也就是它会提供给你从其它博客迁移到jekyll的完整帮助。...总结 静态博客系统的优点就是它不需要数据库，只需要静态文件就可以提供浏览，这样它可以提供非常大的并发访问。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
即时通信 IM
ICP备案
对象存储
实时音视频
