`
sunxboy
  • 浏览: 2877767 次
  • 性别: Icon_minigender_1
  • 来自: 武汉
社区版块
存档分类
最新评论

使用jekyll写博客 基本知识

 
阅读更多

撰写博客

Jeklly 的一个最好的特点是『关注 blog 本身』。这是指什么呢?简单的说就是写博客的过程被铸造进了 Jekyll 的功能中。你只需简单的管理你电脑中的一个文件夹下的文本文件就可以写文章并方便的在线上发布。与繁琐的配置和维护数据库和基于网站的内容管理系统 (CMS) 相比,这是一个非常受欢迎的改变。

文章文件夹

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

创建文章的文件

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

年-月-日-标题.MARKUP

在这里,是4位数字,都是2位数字。MARKUP扩展名代表了这篇文章是用什么格式写的。下面是一些合法的文件名的例子:

2011-12-31-new-years-eve-is-awesome.md
2012-09-12-how-to-write-a-blog.textile

内容格式

所有博客文章顶部必须有一段YAML头信息(YAML front- matter)。在它下面,就可以选择你喜欢的格式来写文章。Jekyll支持2种流行的标记语言格式:Markdown 和 Textile。这些格式都有自己的方式来标记文章中不同类型的内容,所以你首先需要熟悉这些格式并选择一种最符合你需求的。

引用图片和其它资源

很多时候,你需要在文章中引用图片、下载或其它数字资源。尽管 Markdown 和 Textile 在链接这些资源时的语法并不一样,但你只需要关心在站点的哪些地方保存这些文件。

由于 Jekyll 的灵活性,有很多方式可以解决这个问题。一种常用做法是在工程的根目录下创建一个文件夹,命名为assets 或者 downloads,将图片文件,下载文件或者其它的资源放到这个文件夹下。然后在任何一篇文章中,它们都可以用站点的根目录来进行引用。这和你站点的域名/二级域名和目录的设置相关,下面有一些例子(Markdown 格式)来演示怎样利用site.url变量来解决这个问题。

在文章中引用一个图片

… 从下面的截图可以看到:
![有帮助的截图]({{ site.url }}/assets/screenshot.jpg)

链接一个读者可下载的 PDF 文件:

… 你可以直接 [下载 PDF]({{ site.url }}/assets/mydoc.pdf).
提示™:链接只使用站点的根 URL

如果你确信你的站点只在域名的根 URL 下做展示,你可以不使用 {{ site.url }}变量。在这种情况下, 直接使用/path/file.jpg即可。

文章的目录

所有文章都在一个目录中是没有问题的,但是如果你不将文章列表列出来博客文章是不会被人看到。在另一个页面上创建文章的列表(或者使用模版)是很简单的。感谢 Liquid 模版语言和它的标记,下面是如何创建文章列表的简单例子:

<ul>
  {% for post in site.posts %}
    <li>
      <a href="{{ post.url }}">{{ post.title }}</a>
    </li>
  {% endfor %}
</ul>

当然,你可以完全控制怎样(在哪里)显示你的文章,如何管理你的站点。如果你想了解更多你需要读一下 Jekyll 的模版是怎样工作的这篇文章。

文章摘要

Jekyll 会自动取每篇文章从开头到第一次出现excerpt_separator的地方作为文章的摘要,并将此内容保存到变量post.excerpt中。拿上面生成文章列表的例子,你可能想在每个标题下给出文章内容的提示,你可以在每篇文章的第一段加上如下的代码:

<ul>
  {% for post in site.posts %}
    <li>
      <a href="{{ post.url }}">{{ post.title }}</a>
      <p>{{ post.excerpt }}</p>
    </li>
  {% endfor %}
</ul>

如果你不喜欢自动生成摘要,你可以在文章的YAML中增加excerpt来覆盖它。完全禁止掉可以将excerpt_separator设置成"".

高亮代码片段

Jekyll 自带语法高亮功能,它是由 Pygments 来实现的。在文章中插入一段高亮代码非常容易,只需使用下面的 Liquid 标记:

{% highlight ruby %}
def show
  @widget = Widget(params[:id])
  respond_to do |format|
    format.html # show.html.erb
    format.json { render json: @widget }
  end
end
{% endhighlight %}

将输出下面的效果:

def show
  @widget = Widget(params[:id])
  respond_to do |format|
    format.html # show.html.erb
    format.json { render json: @widget }
  end
end
提示™:显示行数

你可以在代码片段中增加关键字linenos来显示行数。 这样完整的高亮开始标记将会是:{% highlight ruby linenos %}

有了这些基础知识就可以开始你的第一篇文章了。当你准备更深入的了解还可以做什么的时候,你可能会对如何定制文章的永久链接 或在文章和站点的其它位置中使用定制变量感兴趣。

 

使用草稿

草稿是没有日期的文章。它们是你还在创作中而暂时不想发表的文章。想要开始使用草稿,你需要在网站根目录下创建一个名为 _drafts 的文件夹(如在目录结构章节里描述的),并新建你的第一份草稿:

|-- _drafts/
|   |-- a-draft-post.md

 

为了预览你拥有草稿的网站,运行 jekyll serve 或者带有 --drafts 配置选项的 jekyll build。此两种方法皆会将 Time.now 的值赋予草稿文章,作为其发布日期,所以你将看到草稿文章作为最新文章被生成。

分享到:
评论
2 楼 sunxboy 2015-08-18  
Create a Post
rake post title="Hello World"

Create a Page
rake page name="about.md"

nested page:
rake page name="pages/about.md"

with a path:
rake page name="pages/about"
# this will create the file: ./pages/about/index.html
1 楼 sunxboy 2015-01-03  
使用命令创建一个post:
rake post title="your post title"

相关推荐

    githubpage+jekyll构建博客的解决方案.docx

    这个解决方案包括了githubpage和jekyll的基本概念、githubpage上的博客构建步骤、jekyll的配置和使用、markdown写作的基本语法等内容。通过这个解决方案,用户可以快速构建自己的博客,分享自己的知识和经验。 一、...

    基于Jekyll的Qt个人博客.zip

    【标题】"基于Jekyll的Qt个人博客"指的是一个使用Qt框架开发的个人博客系统,该系统结合了Jekyll静态网站生成器的功能。Qt是一个跨平台的C++库,广泛用于开发图形用户界面应用程序,而Jekyll是一款用Ruby语言编写的...

    Jekyll-Blog:Jekyll博客胆量

    在Jekyll博客中,我们通常使用Markdown编写文章。例如,`_posts` 文件夹下的每篇文章都是一个Markdown文件,其中包含YAML Front Matter和正文。Markdown支持的语法包括标题、列表、代码块、链接、图片等。 ### 5. ...

    jekyllminimaltheme的中文简体化一款极简风格的jekyll主题

    在使用 Jekyll Minimal Theme 创建个人博客或网站时,用户需要熟悉 Jekyll 的基本配置,例如在 `_config.yml` 文件中设置站点元数据,如站点标题、作者信息、URL 等。此外,了解 Markdown 和 Liquid 模板语言的基本...

    HackFreeStuff:使用Jekyll的个人博客

    在GitHub上,`gh-pages`分支常用来托管静态网站,意味着这个压缩包可能包含了一个完整的Jekyll博客源代码,包括Markdown文章、布局文件、样式表和其他资源。 **总结** 通过使用Jekyll,你可以轻松地创建和维护一个...

    insite:官方 Insite 设计实验室博客 - 运行 Jekyll

    下面将详细介绍 Jekyll 的相关知识及其在创建网站和博客中的应用。 1. **Jekyll 简介**: Jekyll 是一个开源的静态站点生成器,由 Ruby 编写。它遵循“内容为王”的理念,允许用户专注于撰写 Markdown 或 Textile ...

    jekyll-plate:个人使用的基本Jekyll模板

    Jekyll 最初由GitHub创始人Tom Preston-Werner开发,是GitHub Pages的默认构建工具,因此在个人博客和项目页面的搭建中非常流行。 **HTML基础知识** HTML(HyperText Markup Language)是网页内容的结构化标记语言...

    jekyll-blog:Jekyll 博客课程与 Ajinkya

    对于标签"JavaScript",在Jekyll博客中,你可以使用JavaScript来增强动态功能。虽然Jekyll生成的是静态页面,但仍然可以在HTML文件中引入JavaScript库或脚本来实现交互效果。例如,你可以添加Google Analytics追踪...

    Daktilo是一个Jekyll主题一个最小的设计灵感来自打字机

    在深入探讨 Daktilo 主题之前,我们先了解一下 Jekyll 的基本概念。Jekyll 是由 GitHub 推出的开源项目,它能够将文本格式化的文件转换成静态网站,特别适合个人博客、项目文档或小型企业网站。Jekyll 使用 YAML 头...

    一页:简单的单页jekyll博客主题

    **一页:简单的单页Jekyll博客主题** "一页"是一个专为Jekyll设计的简洁、高效的单页博客主题。Jekyll是一种静态站点生成器,它允许用户使用Markdown或Textile等标记语言编写内容,然后通过模板引擎将这些内容转换...

    Jekyll静态网站后台引擎使用教程

    7. **创建新博客**:运行`jekyll new Blog`来创建一个新的Jekyll博客项目,然后进入项目目录`cd Blog`。启动服务`jekyll serve`,可以在浏览器中访问`localhost:4000`预览博客模板。 在搭建过程中,可能会遇到一些...

    blog:我的博客(Jekyll)

    在Jekyll博客中,用户通常会遇到以下几个核心概念: 1. **配置文件**:`_config.yml`,用于设置博客的基本信息,如站点标题、作者、URL和社交媒体链接等。 2. **布局(Layouts)**:定义博客的通用结构,如头部、...

    sangeeta.io:Jekyll博客

    【描述】:“sangeeta.io Github页面上使用私人Jekyll博客 :party_popper: :sparkles:” 这个描述表明博主通过GitHub Pages服务托管了自己的Jekyll博客。GitHub Pages是一个免费的服务,允许用户发布静态网站,非常...

    davidplumridge.github.io:使用Jekyll和Github Pages建立的个人网站和简单博客

    标题 "davidplumridge.github.io:使用Jekyll和Github Pages建立的个人网站和简单博客" 描述了一位名叫David Plumridge的人使用Jekyll和GitHub Pages创建的个人网站和博客。这种技术组合允许用户轻松地托管静态网站,...

    jekyll-modes-源码.rar

    《Jekyll 模式解析与应用》 Jekyll 是一个静态站点生成器,它将文本格式的内容转换为静态HTML和CSS文件,适用于...深入学习和掌握这部分知识,将有助于我们在实际工作中更好地利用Jekyll这一强大的静态站点生成器。

    jekyll-blog:尝试按照教程建立一个 jekyll 博客

    总结,创建一个Jekyll博客并不复杂,只需要基本的Markdown和HTML知识,就能打造一个个性化且功能完善的博客。通过不断学习和实践,你可以进一步提升博客的用户体验和技术含量。现在,你已经准备好开始你的Jekyll博客...

    ayansengupta17.github.io:我基于jekyll的博客

    在Jekyll博客中,HTML用于创建网页的基本框架,包括头部、主体和页脚等部分。开发者通常会用HTML编写自定义模板,以便在多个页面中保持一致的设计风格。 Jekyll支持 Liquid 模板语言,这是一种用于生成动态内容的...

    jaimedearcos.github.io:基于Jaime de Arcos Jekyll的博客

    "基于Jaime de Arcos Jekyll的博客" 指出Jaime de Arcos的博客是使用Jekyll构建的,Jekyll是一款静态站点生成器,特别适合用于构建博客和简单的静态网站。 **描述解读:** 描述提到Jaime de Arcos的博客是可以访问...

    Jekyll_blog:每日博客

    本篇文章将深入探讨Jekyll博客的创建、配置和使用,以及如何利用JavaScript增强博客功能。 首先,我们要了解Jekyll的核心概念。Jekyll是一款静态站点生成器,它将文本格式的内容(如Markdown或Textile)转换成静态...

    osunguk.github.io:jekyll博客

    标题 "osunguk.github.io:jekyll博客" 暗示了这是一个基于Jekyll构建的个人开发博客。Jekyll是一款静态站点生成器,它能够将文本格式的内容转换为静态HTML和CSS,便于在Web上发布。这个博客很可能托管在GitHub ...

Global site tag (gtag.js) - Google Analytics