日韩无码专区无码一级三级片|91人人爱网站中日韩无码电影|厨房大战丰满熟妇|AV高清无码在线免费观看|另类AV日韩少妇熟女|中文日本大黄一级黄色片|色情在线视频免费|亚洲成人特黄a片|黄片wwwav色图欧美|欧亚乱色一区二区三区

RELATEED CONSULTING
相關咨詢
選擇下列產品馬上在線溝通
服務時間:8:30-17:00
你可能遇到了下面的問題
關閉右側工具欄

新聞中心

這里有您想知道的互聯(lián)網(wǎng)營銷解決方案
使用Jekyll構建你的網(wǎng)站

Jekyll 是一個開源的靜態(tài)網(wǎng)站生成器。你可以使用 Markdown 編寫內容,使用 HTML/CSS 來構建和展示,Jekyll 會將其編譯為靜態(tài)的 HTML。

近年來開始流行靜態(tài)網(wǎng)站生成器和 JAMStack,而且理由很充分,它們不需要復雜的后端,只需要靜態(tài)的 HTML、CSS 和 Javascript。沒有后端意味著更好的安全性、更低的運營開銷和更便宜的托管。雙贏!

在本文中,我將討論 Jekyll。在撰寫本文時,我的個人網(wǎng)站使用的是 Jekyll。Jekyll 使用 Ruby 引擎將用 Markdown 編寫的文章轉換成 HTML。Sass 可以將復雜的 CSS 規(guī)則應用到普通文本文件中。Liquid 允許對靜態(tài)內容進行編程控制。

安裝 Jekyll

Jekyll 網(wǎng)站 提供了 Linux、MacOS 和 Windows 安裝說明。安裝完成之后,快速引導 將會安裝一個基礎的 Hello-World 項目。

現(xiàn)在在你的瀏覽器訪問 http://localhost:4000,你可以看到你的默認“真棒”博客。

Default "awesome" blog

目錄結構

這個默認站點包含以下的文件和文件夾:

  • _posts: 你的博客文章。
  • _site: 最終編譯成的靜態(tài)網(wǎng)站文件。
  • about.markdown: “關于頁”的內容。
  • index.markdown: “主頁”的內容。
  • 404.html: “404 頁”的內容。
  • _config.yml: Jekyll 的全站配置文件。

創(chuàng)建新的博客帖子

創(chuàng)建帖子很簡單。你需要做的就是在 _post 目錄下使用正確的格式和擴展名創(chuàng)建一個新文件,這樣就完成了。

有效的文件名像 2021-08-29-welcome-to-jekyll.markdown 這樣。一個博客文件必須包含 Jekyll 所謂的 YAML 卷首塊Front Matter。它是文件開頭的一個包含元數(shù)據(jù)的特殊部分。如果你查看默認的帖子,你可以看到以下內容:

 
 
 
 
  1. ---
  2. layout: post
  3. title: "Welcome to Jekyll!"
  4. date:  2021-08-29 11:28:12 +0530
  5. categories: jekyll update
  6. ---

Jekyll 會使用上面的元數(shù)據(jù),你也可以自定義 key: value 鍵值對。如果你需要一些提示,請查看我的網(wǎng)站的卷首。除了前面的問題,你還可以 使用內置的 Jekyll 變量 來自定義你的網(wǎng)站。

讓我們創(chuàng)建一個新的帖子。在 _posts 文件夾下創(chuàng)建 2021-08-29-ayushsharma.markdown。內容如下:

 
 
 
 
  1. ---
  2. layout: post
  3. title:  "Check out ayushsharma.in!"
  4. date:   2021-08-29 12:00:00 +0530
  5. categories: mycategory
  6. ---
  7. This is my first post.
  8.  
  9. # This is a heading.
  10.  
  11. ## This is another heading.
  12.  
  13. This is a [link]()
  14.  
  15. This is my category:

如果 jekyll serve 命令仍在運行,刷新頁面,你將看到下面的新帖子。

New blog entry

恭喜你創(chuàng)建了你的第一篇帖子!這個過程看起來很簡單,但是你可以通過 Jekyll 做很多事情。使用簡單的 Markdown,你可以歸檔博客、高亮顯示代碼片段以及分類管理帖子。

草稿

如果你還沒準備好發(fā)布你的內容,你可以創(chuàng)建一個 _drafts 文件夾。此文件夾中的 Markdown 文件僅通過傳遞 --drafts-- 參數(shù)來呈現(xiàn)。

布局和包含

請注意 _post 文件夾中兩篇文章的卷首塊,你將在其中看到 layout: post。_layout 文件夾中包含所有布局。你不會在源代碼中找到它們,因為 Jekyll 默認加載它們。Jekyll 使用的默認源代碼在 這里。如果你點擊該鏈接,你可以看到 post 的布局使用了默認(default)布局。默認布局包含的代碼 {{ content }} 是注入內容的地方。布局文件還將包含 include 指令。它們從 include 文件夾 加載文件,并使用不同的組件組成頁面。

總的來說,這就是布局的工作方式:你在卷首塊定義它們并將你的內容注入其中。而包含則提供了頁面的其它部分以組成整個頁面。這是一種標準的網(wǎng)頁設計技術:定義頁眉、頁腳、旁白和內容元素,然后在其中注入內容。這就是靜態(tài)站點生成器的真正威力,完全以編程的方式控制,將你的網(wǎng)站組裝起來并最終編譯成靜態(tài)的 HTML。

頁面

你網(wǎng)站上的所有內容并不都是文章或博客。你需要“關于”頁面、“聯(lián)系”頁面、“項目”頁面或“作品”頁面。這就是“頁面”的用武之地。它們的工作方式與“帖子”完全一樣,這意味著它們是帶有卷首塊的 Markdown 文件。但它們不會放到 _posts 目錄。它們要么保留在你的項目根目錄中,要么保留在它們自己的文件夾中。對于布局和包含,你可以使用與帖子相同的布局或創(chuàng)建新帖子。 Jekyll 非常靈活,你可以隨心所欲地發(fā)揮你的創(chuàng)意!你的默認博客已經有 index.markdown 和 about.markdown。請隨意自定義它們。

數(shù)據(jù)文件

數(shù)據(jù)文件位于 _data 目錄中,可以是 .yml.json、.csv 等格式的文件。例如,一個 _data/members.yml 文件可能包含:

 
 
 
 
  1. - name: A
  2.  github: a@a
  3.  
  4. - name: B
  5.  github: b@b
  6.  
  7. - name: C
  8.  github: c@c

Jekyll 在網(wǎng)站生成的時候讀取這些內容。你可以通過 site.data.members 訪問它們。

 
 
 
 

永久鏈接

你的 _config.yml 文件定義了永久鏈接的格式。你可以使用各種默認變量來組合你自己的自定義永久鏈接。

構建你最終的網(wǎng)站

命令 jekyll serve 非常適合本地測試。但是一旦你完成了本地測試,你將需要構建要發(fā)布的最終工作。命令 jekyll build --source source_dir --destination destination_dir 將你的網(wǎng)站構建到 _site 文件夾中。請注意,此文件夾在每次構建之前都會被清理,所以不要將重要的東西放在那里。生成內容后,你可以將其托管在你的靜態(tài)托管服務上。

你現(xiàn)在應該對 Jekyll 的功能以及主要部分的功能有一個全面的了解。如果你正在尋找靈感,官方 JAMStack 網(wǎng)站上有一些很棒的例子。

Example Jekyll sites from JAMStack

編碼快樂。


文章題目:使用Jekyll構建你的網(wǎng)站
本文路徑:http://www.5511xx.com/article/cdpjdij.html