鍍金池/ 教程/ Java/ 創(chuàng)建頁面
Assets
相關(guān)資源
創(chuàng)建頁面
基本用法
常見問題
模板
升級
配置
部署方法
使用 Jekyll 的站點(diǎn)
頭信息
插件
博客遷移
永久鏈接
使用草稿
貢獻(xiàn)
分頁功能
安裝
目錄結(jié)構(gòu)
Data Files
常用變量
GitHub Pages
撰寫博客
快速指南
附加功能

創(chuàng)建頁面

作為寫文章的補(bǔ)充,Jekyll 還可以創(chuàng)建靜態(tài)頁面。 利用 Jekyll 帶來的便利,你只需要復(fù)制文件或文件夾,就是這么簡單。

主頁

像任何網(wǎng)站的配置一樣,需要按約定在站點(diǎn)的要目錄下找到 index.html 文件, 這個(gè)文件將被做為主頁顯示出來。除非你的站點(diǎn)設(shè)置了其它的文件作為默認(rèn)文件, 這個(gè)文件就將是你的 Jekyll 生成站點(diǎn)的主頁。

提示?: 在主頁上使用布局

站點(diǎn)上任何 HTML 文件,包括主頁,都可以使用布局和 include 中的內(nèi)容一般共用的內(nèi)容,如頁面的 header 和 footer. 將合適的部分抽出放到布局中。

其它的頁面的位置

將 HTML 文件放在哪里取決于你想讓它們?nèi)绾喂ぷ?。有兩種方式可以創(chuàng)建頁面:

  • 命名 HTML 文件:將命名好的為頁面準(zhǔn)備的 HTML 文件放在站點(diǎn)的根目錄下。
  • 命名文件夾:在站點(diǎn)的根目錄下為每一個(gè)頁面創(chuàng)建一個(gè)文件夾,并把 index.html 文件放在每個(gè)文件夾里。 這兩種方法都可以工作(并且可以混合使用),它們唯一的區(qū)別就是訪問的 URL 樣式不同。

命名 HTML 文件

增加一個(gè)新頁面的最簡單方法就是把給 HTML 文件起一個(gè)適當(dāng)?shù)拿植⒎旁诟夸浵隆?一般來說,一個(gè)站點(diǎn)下通常會(huì)有:主頁 (homepage), 關(guān)于 (about), 和一個(gè)聯(lián)系 (contact) 頁。根目錄下的文件結(jié)構(gòu)和對應(yīng)生成的 URL 會(huì)是下面的樣子:

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

命名一個(gè)文件夾并包含一個(gè) index.html 文件

上面的方法可以很好的工作,但是有些人不喜歡在 URL 中顯示文件的擴(kuò)展名。用 Jekyll 達(dá) 到這種效果,你只需要為每個(gè)頂級頁面創(chuàng)建一個(gè)文件夾,并包含一個(gè) index.html 文件。 這樣,每個(gè) URL 就將以文件夾的名字作為結(jié)尾,網(wǎng)站服務(wù)器會(huì)將對應(yīng)的 index.html 展示給用戶。下面是一個(gè)示例來展示這種結(jié)構(gòu)的樣子:

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

這種方式可能不適合每個(gè)人,對那些喜歡干凈 URL 的人這是一種簡單有效的方法。 最終選擇哪種方法完全由你來決定!

上一篇:博客遷移下一篇:Data Files