Grav 快速指南

Grav - 概述

Grav 是一個基於平面檔案的內容管理系統。該系統不使用資料庫來儲存內容，而是使用文字 (.txt) 檔案或 Markdown (.md) 檔案來儲存內容。平面檔案指的是可讀的文字檔案，它以一種簡單易用的方式處理內容，對於開發者來說非常方便。

Grav 由Rocket Theme 團隊開發。它執行在 PHP 上，是一個類似於 Joomla、WordPress 或 Drupal 的開源 CMS。

為什麼選擇 Grav？

Grav 現在是最快的平面檔案內容管理系統。使用 Grav 釋出和管理內容更容易。它允許開發者透過將內容儲存在檔案中（例如文字或 Markdown 檔案），而不是資料庫中，來非常輕鬆地處理內容。

Grav 幫助您構建簡單、易於管理和快速的網站。它的成本低於資料庫驅動的 CMS，並且在您沒有足夠資源的情況下，對於檔案處理的 I/O 非常有用。

Grav 的特點

• 它是一個快速、簡單且強大的平面檔案 Web 平臺。

• 它用於構建網站，無需額外的工具或 HTML 知識。

• 它使用文字檔案或 Markdown 檔案來儲存內容。

• 它不使用資料庫，因此可以減少瓶頸的發生。

• 它使用基於 PHP 的 Twig 模板，直接解析成 PHP，使其速度很快。

優點

• 它不是基於資料庫的 CMS，因此非常易於安裝，將檔案上傳到伺服器後即可使用。

• 它使用 Markdown 文字檔案，使操作更加簡便。使用它，內容會動態轉換為 HTML 並顯示在瀏覽器中。

• 在安全性方面，Grav 沒有管理區域和資料庫。因此，沒有機會入侵帳戶或資料庫來訪問重要資料。

• 您可以輕鬆備份所有檔案以保留網站的備份副本，因為沒有資料庫需要備份。

• 這是一個易於學習的軟體。

缺點

• 您可能會遇到未經授權的使用者可以直接訪問您的檔案內容的情況，因為沒有資料庫來保護檔案。

• 使用 Grav CMS 構建複雜的網站比較困難。

Grav - 安裝

在本章中，我們將瞭解 Grav 的安裝。我們將討論 Grav 的軟體要求以及如何下載它。

Grav 的軟體要求

現在讓我們瞭解 Grav 的軟體要求。

Web 伺服器

• WAMP (Windows)
• LAMP (Linux)
• XAMP (跨平臺)
• MAMP (Macintosh)
• Nginx
• Microsoft IIS

作業系統 - 跨平臺

瀏覽器支援 - IE (Internet Explorer 8+), Firefox, Google Chrome, Safari, Opera

PHP 相容性 - PHP 5.4 或更高版本

文字編輯器

• Sublime Text (Mac / Windows / Linux)
• Atom (Mac / Windows)
• Notepad++ (Windows)
• Bluefish (Mac / Windows / Linux)

下載 Grav

點選此連結 https://getgrav.org/downloads 並按照以下螢幕截圖所示步驟下載 Grav。

將下載的 Grav 檔案解壓縮到您的 Web 伺服器。

安裝嚮導

Grav 的安裝過程非常簡單。請按照以下步驟進行 Grav 設定。

• 下載 zip 檔案並將其解壓縮到您的 Web 伺服器或本地主機。將資料夾重新命名為您要用來引用您的站點的名稱。

• 開啟瀏覽器並導航到localhost/<你的資料夾名稱>，您將被重定向到一個顯示您已成功安裝 Grav 的螢幕，如下面的螢幕截圖所示。

• Grav 帶有一個示例頁面，可以幫助您入門。在上面的螢幕截圖中，您可以看到主頁連結顯示了一個示例頁面。

Grav - 頁面

在本章中，讓我們學習Grav 頁面。頁面可以定義為站點的構建塊。頁面結合了內容和導航；這使得即使對於沒有經驗的使用者來說也能輕鬆完成工作。

首先，讓我們瞭解如何建立一個簡單的頁面。所有使用者內容都將儲存在user/pages/資料夾下。只有一個名為01.home的資料夾。資料夾的數字部分是可選的；它表示頁面的順序（例如，01 在 02 之前），並明確告知 Grav 此頁面應該在選單中可見。

現在讓我們看看如何建立一個新頁面。

步驟 1 - 在/user/pages/下建立一個資料夾；例如，02.about，如下面的螢幕截圖所示。

步驟 2 - 在新建立的02.about資料夾中建立一個名為default.md的檔案，內容如下。

---
title: About Us
---

# About Us Page!

This is the body of **about us page**.

上面的程式碼使用了一些Markdown語法，下面簡要解釋一下。您可以在Markdown章節中詳細學習Markdown。

• --- 指示符之間的內容是頁面標題。

• # 或雜湊語法在Markdown中表示標題，它將轉換為 HTML 中的<h1>標題。

• **標記表示粗體文字或 HTML 中的<b>。

步驟 3 - 重新載入瀏覽器，您可以在選單中看到新頁面，如下面的螢幕截圖所示。

頁面型別

Grav 頁面支援 3 種類型的頁面：

• 標準頁面。
• 列表頁面。
• 模組化頁面。

標準頁面

標準頁面是最基本的頁面型別，例如部落格文章、聯絡表單、錯誤頁面等。預設情況下，頁面被視為標準頁面。下載並安裝 Grav 基本包後，您將看到一個標準頁面。安裝 Grav 基本包後，您將看到以下頁面。

列表頁面

列表頁面是標準頁面的擴充套件，它引用了一組頁面。設定列表頁面的最簡單方法是在列表頁面下建立子頁面。部落格列表頁面就是一個很好的例子。

可以在Grav 下載中找到帶有列表頁面的示例部落格框架。示例如下面的螢幕截圖所示。

模組化頁面

模組化頁面是一種列表頁面的形式，它從其子頁面構建單個頁面。這允許我們從較小的模組化內容頁面構建非常複雜的單頁佈局。這可以透過從頁面主資料夾中找到的多個模組化資料夾構建模組化頁面來實現。

可以在Grav 下載中找到使用模組化頁面的示例單頁框架。示例如下面的螢幕截圖所示。

資料夾

/user/pages資料夾將包含其相應頁面的內容。/user/pages資料夾內的資料夾會被 Grav 自動視為選單，並用於排序。例如，01.home資料夾將被視為主頁。排序也需要保持，即 01.home 將在 02.about 之前。

您應該提供一個入口點，以便在您將瀏覽器指向站點根目錄時指定瀏覽器跳轉的位置。例如，如果您在瀏覽器中輸入 http://mysite.com，Grav 預設情況下會期望一個別名home/，但是您可以透過更改 Grav 配置檔案中的home.alias選項來覆蓋主頁位置。

資料夾名前的下劃線 ( _ ) 被識別為模組化資料夾，這是一種特殊型別的資料夾，僅用於模組化內容。例如，對於pages/02.about之類的資料夾，slug 將預設為about，URL 將為 http://mysite.com/about。

如果資料夾名稱沒有數字字首，則該頁面被視為不可見，並且不會顯示在導航中。例如，如果user/pages/具有/contact資料夾，則不會顯示在導航中。這可以透過在頁面本身的標題部分將 visible 設定為 true 來覆蓋，如下所示，使其在導航中可見。

---
title: contact
visible: true
---

如果周圍的資料夾具有數字字首，則頁面預設情況下在導航中可見。設定可見性的有效值為true或false。

排序

有很多方法可以控制資料夾的排序，其中一種重要的方法是設定頁面配置設定的content.order.by。選項如下所示。

• 預設 − 檔案系統可用於排序，例如，01.home 在 02.about 之前。

• 標題 − 可使用每個頁面中定義的標題進行排序。

• 日期 − 排序可以基於每個頁面中定義的日期。

• 資料夾 − 將刪除任何包含數字字首（例如 01.）的資料夾名稱。

• 基本名稱 − 排序基於字母順序的資料夾，不考慮數字順序。

• 修改時間 − 也可以使用頁面的修改時間戳。

• header.x − 任何頁面標題欄位都可以用於排序。

• 手動 − 可以使用 order_manual 變數進行排序。

• 隨機 − 也可以隨機排序。

手動排序是透過向content.order.custom配置設定提供選項列表來專門定義的。您可以設定pages.order.dir和pages.order.by選項來覆蓋Grav系統配置檔案中的預設行為。

頁面檔案

頁面資料夾內的頁面應建立為.md檔案，即Markdown格式的檔案；它是帶有YAML前端內容的Markdown。default將是主模板的標準名稱，您可以隨意命名。下面顯示了一個簡單頁面的示例：

---
title: Title of the page
taxonomy:
   category: blog page
---
# Title of the page

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque porttitor eu
felis sed ornare. Sed a mauris venenatis, pulvinar velit vel, dictum enim. Phasellus
ac rutrum velit. **Nunc lorem** purus, hendrerit sit amet augue aliquet, iaculis
ultricies nisl. Suspendisse tincidunt euismod risus. Nunc a accumsan purus.	

---標記之間的內容稱為YAML前端內容，此YAML前端內容包含基本的YAML設定。在上面的示例中，我們將標題和分類設定為部落格頁面。---標記對之後的部分是我們網站上實際看到的內容。

摘要大小和分隔符

摘要的預設大小可以在site.yaml中設定，透過page.summary()使用。這對於只需要摘要資訊而不需要完整頁面內容的部落格很有用。您還可以使用手動摘要分隔符，也稱為摘要分隔符：===，並確保將其放在內容中，上下各留空行，如下所示。

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua.

===

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt
ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation
ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in
reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur
sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id
est laborum."

分隔符上面的文字將在page.summary()引用時使用，而完整內容將在page.content()引用時使用。

查詢其他頁面

Grav具有名為find()方法的功能，可以查詢另一個頁面並在該頁面上執行操作。

例如，如果您想在特定頁面上列出所有公司位置，請使用以下Markdown規則：

# Locations 
<ul>
   {% for loc in page.find('/locations').children if loc != page %}
      <li><a href="{{loc.url}}">{{ loc.title }}</a></li>
   {% endfor %}
</ul>

Grav - Markdown 語法

Markdown語法定義為以易於閱讀和易於編寫的格式編寫純文字，之後將其轉換為HTML程式碼。Markdown語法中使用諸如(*)或(`)之類的符號。這些符號用於加粗、建立標題和組織內容。

要使用Markdown語法，必須在user/pages/02.mypage資料夾中建立一個.md檔案。在您的\user\config\system.yaml配置檔案中啟用Markdown語法。

使用Markdown語法有很多好處，其中一些如下所示。

• 易於學習，字元最少。

• 使用Markdown時，出錯的可能性非常小。

• 有效的XHTML輸出。

• 您的內容和視覺顯示保持分離，因此不會影響網站的外觀。

• 您可以使用任何文字編輯器或Markdown應用程式。

在以下部分中，我們將討論Markdown中使用的HTML主要元素。

標題

每個標題標籤都使用#建立，即從h1到h6，#的數量會增加，如下所示。

	#my new Heading
	##my new Heading
	###my new Heading
	####my new Heading
	#####my new Heading
	######my new Heading

在瀏覽器中以localhost/Grav/mypage開啟.md檔案；您將收到以下結果：

註釋

您可以使用以下格式編寫註釋。

<!—
   This is my new comment
-->

在瀏覽器中以localhost/Grav/mypage開啟.md檔案；您將收到以下結果：

水平線

水平線用於在段落之間建立主題斷開。您可以使用以下任何方法在段落之間建立斷開。

• ___ − 三個下劃線

• --- − 三個短橫線

• *** − 三個星號

在瀏覽器中以localhost/Grav/mypage開啟md檔案；您將收到以下結果：

正文

正文可以定義為以Markdown語法中的普通格式編寫文字，不使用(p)標籤

示例

It is a way of writing your plain text in an easy to read and write format, 
which later gets converted into HTML code.

在瀏覽器中以localhost/Grav/mypage開啟.md檔案；您將收到以下結果：

強調

強調是Markdown語法中的編寫格式，用於加粗、斜體或刪除文字的一部分。讓我們在下面討論它們：

加粗

可以使用兩側的兩個(**)符號將文字的一部分加粗。

示例

The newest articles from **Advance Online Publication (AOP)** and the current issue.

在此示例中，我們必須將“Advance Online Publication (AOP)”字詞加粗。

在瀏覽器中以localhost/Grav/mypage開啟.md檔案，您將收到以下結果：

斜體

在單詞的兩側使用“_”（下劃線）符號來使文字斜體。

示例

The newest articles from _Advance Online Publication_ (AOP) and the current issues.

在此示例中，我們必須將“Advance Online Publication” (AOP)字詞斜體。

在瀏覽器中以localhost/Grav/mypage開啟.md檔案。這將為您提供以下結果：

刪除線

在單詞的兩側使用兩個"~~"（波浪號）來刪除單詞。

示例

The newest articles from ~~Advance Online Publication~~ (AOP) and the current issues.

在此示例中，我們必須刪除“Advance Online Publication” (AOP)字詞。

在瀏覽器中以localhost/Grav/mypage開啟.md檔案。這將為您提供以下結果：

塊引用

要建立塊引用，必須在句子或單詞之前新增>符號。

示例

>The newest articles from Advance Online Publication (AOP) and the current issues.

在此示例中，我們在句子之前使用了>符號。

在瀏覽器中以localhost/Grav/mypage開啟.md檔案；您將收到以下結果：

塊引用也可以以下列方式使用：

>The newest articles from Advance Online Publication (AOP) and the current issues.
>>> The newest articles from Advance Online Publication (AOP) and the current issues.

在瀏覽器中以localhost/Grav/mypage開啟.md檔案；您將收到以下結果：

通知

通知可用於告知或通知重要事項。

共有四種類型的通知：黃色、紅色、藍色和綠色。

黃色

在描述!Info或資訊的黃色通知型別之前，必須使用>>>符號。

示例

>>>Neurotransmitter-gated ion channels of the Cys-loop receptor family are essential
mediators of fast neurotransmission throughout the nervous system and are implicated
in many neurological disorders.

紅色

在紅色警告通知之前使用四個>>>>符號。

示例

>>>>Neurotransmitter-gated ion channels of the Cys-loop receptor family are essential
mediators of fast neurotransmission throughout the nervous system and are implicated
in many neurological disorders.

藍色

對於藍色通知型別，使用五個>>>>>符號，這描述了一個註釋。

示例

>>>>>Neurotransmitter-gated ion channels of the Cys-loop receptor family are essential
mediators of fast neurotransmission throughout the nervous system and are implicated
in many neurological disorders.

綠色

在綠色提示型別通知之前使用六個>>>>>>符號。

示例

>>>>>>Neurotransmitter-gated ion channels of the Cys-loop receptor family are essential
mediators of fast neurotransmission throughout the nervous system and are implicated
in many neurological disorders.

在瀏覽器中以localhost/Grav/mypage開啟md檔案；您將收到以下結果：

列表

在本節中，我們將瞭解Grav中無序列表和有序列表的工作原理。

無序列表

在無序列表中，使用專案符號。使用*, - , +符號作為專案符號。在任何文字之前使用帶空格的符號，專案符號將顯示。

示例

+ Bullet
+ Bullet
+ Bullet
   -Bullet
   -Bullet
   -Bullet
   *Bullet

在瀏覽器中以localhost/Grav/mypage開啟.md檔案；您將收到以下結果：

有序列表

列出內容之前新增數字。

示例

1. Coffee
2. Tea
3. Green Tea

在瀏覽器中以localhost/Grav/mypage開啟.md檔案。這將為您提供以下結果：

程式碼

在本節中，我們將瞭解Grav中內聯程式碼和程式碼塊“圍欄”的工作原理。

內聯程式碼

使用(`)建立內聯程式碼，以便在Markdown中使用程式碼。

示例

In the given example, '<section></section>' must be converted into code.

在瀏覽器中以localhost/Grav/mypage開啟.md檔案，您將收到以下結果：

程式碼塊“圍欄”

如果您想阻止多行程式碼，請使用(```)圍欄。

示例

```
You’re Text Here

```

在瀏覽器中以localhost/Grav/mypage開啟.md檔案；您將收到以下結果：

表格

在Grav中，表格是透過在標題部分下使用管道和短橫線建立的。管道不得垂直對齊。

示例

| Number  |    Points       |
| ------  | -----------     |
|   1     | Eve Jackson 94  |
|   2     | John Doe 80     |
|   3     | Adam Johnson 67 |

在瀏覽器中以localhost/Grav/mypage開啟.md檔案；您將收到以下結果：

右對齊文字

要將表格內容放在右側，必須在標題下方的短橫線右側新增冒號。

| Number |     Points      |
| ------:| -----------:    |
|   1    | Eve Jackson 94  |
|   2    | John Doe 80     |
|   3    | Adam Johnson 67 |

在瀏覽器中以localhost/Grav/mypage開啟.md檔案；您將收到以下結果：

連結

在本節中，我們將瞭解連結在Grav中的工作原理。

基本連結

連結是藉助方括號([])和圓括號(())建立的。在[]括號中，必須編寫內容；在()中編寫域名。

示例

[Follow the Given link](http://www.google.com)

在瀏覽器中以localhost/Grav/mypage開啟.md檔案；您將收到以下結果：

新增標題

在本節中，我們將瞭解如何在.md檔案中新增標題。

示例

[Google](https://www.gogle.com/google/ "Visit Google!")

在瀏覽器中以localhost/Grav/mypage開啟.md檔案；您將收到以下結果：

影像

影像類似於連結，但在語法的開頭有一個感嘆號。

示例

![Nature] (/Grav/images/Grav-images.jpg)

在瀏覽器中以localhost/Grav/mypage開啟.md檔案，您將收到以下結果：

Grav - 頁面連結

在本章中，我們將瞭解如何在Grav中連結頁面。您可以簡單地將一個頁面連結到另一個頁面，甚至可以連結遠端頁面。Grav有很多響應式連結選項。如果您之前使用過HTML連結檔案，那麼很容易理解Grav中的頁面連結。

下面是一個Grav站點Pages目錄的基本示例。我們將使用以下目錄作為示例，如圖所示。

下面是Grav連結的一些常見元件。

[Linked Content](../path/slug/page)

• [] − 指定要寫入連結的文字或替代內容。在HTML中，我們使用<a href="">和</a>來放置內容。

• () − URL放置在這個括號中，直接放在方括號之後。

• ../ − 表示向上移動一個目錄。

內容中使用了4種類型的連結，如下所示：

• 相對路徑(Slug)

• 相對目錄路徑

• 絕對路徑

• 遠端路徑

相對路徑(Slug)

內部連結不限於檔案/目錄結構中的某些名稱。Slug可以從標題和回退目錄名稱中提取，這之後可以幫助您輕鬆建立連結，因為無需記住任何特定的檔名，但可以記住相關的Slug。Grav的模板引擎使用檔名來知道要應用哪個模板。

[link](../dog)

上述程式碼為您獲取以下結果：

在上面的示例中，您必須向上移動一個目錄並載入位於pages/01.home/02.nature/item.md目錄中的預設頁面，該頁面來自pages/01.home/02.dog/item.md。item.md檔案沒有分配Slug，因此Grav使用目錄名稱。

接下來，您會找到一個類似的示例，從pages/01.home/01.dog/item.md連結到pages/02.black/01.fish/item.md，但是當它載入item.md檔案時，會為01.fish檔案分配一個Slug。

[link](../../black/fish)

上述程式碼為您提供以下結果：

您現在將看到預設的Slug資料夾名稱將被item.md標題中的black Slug替換。

相對目錄路徑

設定相對的目的地用於連結當前頁面，該頁面可以是影像檔案或任何其他所需檔案。檔案的定位與目的地的定位一樣重要。如果在更改路徑時移動了檔案，則連結可能會斷開。只要檔案保持一致，您就可以在具有不同域名的本地開發伺服器和即時伺服器之間輕鬆切換。連結應該沒有任何問題地工作。

您將直接按名稱指向檔案連結，而不是其目錄或Slug。您可以從pages/01.home/01.dog/item.md建立到pages/02.black/01.fish/item.md的連結，使用如下所示的命令。

[link](../../02.black/01.fish/item.md)

上述程式碼為您提供以下結果：

兩個資料夾都向上移動，如../../所示，然後在底部兩個資料夾中，直接指向item.md檔案。

絕對連結

它類似於相對連結，基於Grav中的/user/pages/目錄。此外，這可以透過兩種方法完成。

• 相對路徑(Slug)樣式

• 相對目錄路徑樣式

相對路徑(Slug)樣式

您可以像相對路徑(Slug)型別一樣操作。它在路徑中使用目錄名稱。它消除了之後透過斷開連結而導致的順序和更改錯誤。它更改了開頭導致連結斷開的資料夾名稱的數量。

下面是一個絕對連結的示例，該連結以/開頭。它指定在Slug樣式中為pages/01.home/01.dog/item.md建立了絕對連結。

[link](/home/nature)

上述程式碼為您提供以下結果：

相對目錄路徑樣式與GitHub等服務一起使用時更一致。它們沒有Grav靈活性的優勢。下面您可以看到使用相對目錄路徑樣式為pages/01.home/01.dog/item.md建立的絕對連結示例。

[link](/01.home/01.dog)

遠端路徑

遠端連結允許您透過其URL直接連結到任何檔案或文件。無需包含您自己網站的內容。

以下示例演示如何連結到TutorialsPoint頁面。

[link](https://tutorialspoint.tw)

上述程式碼為您提供以下結果：

您可以直接連結到任何URL，包括安全的HTTPS連結。

Grav - 圖片連結

在本章中，我們將瞭解Grav中的影像連結。Grav允許您將影像從一個頁面連結到另一個頁面，甚至連結到遠端頁面。如果您使用HTML連結了檔案，那麼很容易理解Grav中的影像連結。

使用此結構，我們將看到如何使用不同型別的連結在頁面中顯示媒體檔案。此結構下的每個資料夾都包含影像，並且/02.green/img01下有一個特殊目錄，它充當頁面，但僅包含媒體檔案。

讓我們瞭解一下 Grav 基於 Markdown 的圖片標籤的一些常用元素。

![Alt Text](../path/image.ext)

• ! − 當你把它放在 Markdown 連結標籤的開頭時，它表示一個圖片標籤。

• [] − 它指定圖片的可選 alt 文字。

• () − 它緊跟在包含檔案路徑的方括號之後。

• ../ − 它表示向上移動一個目錄。

Grav 使用以下五種型別的圖片連結：

• 相對路徑(Slug)

• 相對目錄路徑

• 絕對路徑

• 遠端路徑

• 圖片上的媒體操作

相對路徑(Slug)

它將相對圖片連結設定為當前頁面，並在同一目錄中連結另一個檔案。使用相對連結時，原始檔的位置與目標檔案的位置一樣重要。如果在移動檔案時更改了檔案路徑，則連結可能會斷開。使用這種圖片連結結構的優點是，只要檔案結構保持不變，你就可以在本地開發伺服器和具有不同域名名的即時伺服器之間切換。

示例

![link](../water/img01/img.jpg)

這裡../ 表示你的連結向上移動一個資料夾，然後向下移動一個資料夾，img.jpg 是目標。

當你使用上述路徑時，你將得到以下輸出：

Grav 支援頁面主 Markdown 檔案標題中的 slug，此 slug 將代替給定頁面的資料夾名稱。

如果01.sky資料夾透過其.md檔案設定了 slug，即/pages/01.blue/01.sky/text.md，則檔案的標題將如下所示：

---
title: Sky
slug: test-slug
taxonomy:
   category: blog
---

在上面的程式碼中，我們設定了 slug test-slug，它是可選的。一旦你設定了 slug，你就可以連結到媒體檔案，該檔案將為連結設定相對 Slug 或絕對 URL。

相對目錄路徑

在這種型別的連結中，你可以將目錄相對圖片連結設定為當前頁面。無需使用 URL slug，你可以透過目錄相對圖片連結中的完整路徑及其資料夾名稱進行引用。

示例

![My image](../../blue/img01/img.jpg)

當你使用上述路徑時，它將顯示如下所示的輸出：

絕對路徑

絕對連結與相對連結相同，唯一的區別在於它們相對於站點根目錄，並且位於/user/pages/目錄中。

你可以透過兩種不同的方式使用絕對連結：

• 你可以使用包含 slug 或目錄名稱的相對 Slug 樣式，這在絕對連結中常用。

• 你可以使用絕對連結，它將使用a/開啟連結。

![My image](/blue/img01/img.jpg)

當你使用上述路徑時，你將得到以下輸出：

遠端路徑

遠端圖片連結允許直接透過其 URL 顯示任何媒體檔案。這些連結不包含你自己的網站內容。以下示例顯示瞭如何使用遠端 URL 顯示圖片：

![Remote Image 1](http://www.freedomwallpaper.com/nature-wallpaper/spring_nature-wide.jpg)

當你點選下圖所示的連結時，它將顯示來自給定 URL 的圖片。

圖片上的媒體操作

與頁面關聯的圖片使我們能夠利用Grav 的媒體操作的優勢。在 Grav 中建立內容時，你可以顯示一些媒體檔案，例如圖片、影片和其他檔案。

示例

你可以使用以下格式載入圖片：

![Styling Example](../img01/img.jpg?cropResize = 400, 200)

當你使用上述路徑時，你將收到如下所示的輸出：

Grav - 媒體

媒體檔案包含不同型別的顯示內容，例如圖片、影片和許多其他檔案。Grav 自動查詢和處理這些檔案，以便任何頁面都可以使用。透過使用頁面的內建功能，你可以訪問元資料並動態修改媒體。

Grav 使用智慧快取，在必要時建立快取生成的媒體。這樣，所有人都可以使用快取版本，而不是反覆生成媒體。

支援的媒體檔案

以下是 Grav 支援的媒體檔案型別：

• 圖片 − jpg、jpeg、png

• 動畫圖片 − gif

• 向量化圖片 − svg

• 影片 − mp4、mov、m4v、swf

• 資料/資訊 − txt、doc、pdf、html、zip、gz

顯示模式

以下是 Grav 中幾種型別的顯示模式：

• 源 − 圖片、影片或檔案的視覺化顯示。

• 文字 − 媒體檔案的文字呈現。

• 縮圖 − 媒體檔案的縮圖。

查詢縮圖

你可以使用三個位置查詢縮圖：

• 與你的媒體檔案所在的資料夾相同 − [media-name].[media-extension].thumb.[thumb-extension]; 這裡，media-name 和 media-extension 是實際媒體檔案的名稱和副檔名，thumb-extension 是圖片媒體型別支援的副檔名。

• 使用者資料夾 − user/images/media/thumb-[media-extension].png; 這裡，media-extension 是實際媒體檔案的副檔名。

• 系統資料夾 − system/images/media/thumb-[media-extension].png; 這裡，media-extension 是實際媒體檔案的副檔名。

相簿和連結

Grav 輸出一個錨標記，其中包含相簿外掛讀取的一些元素。如果你想使用相簿庫（未包含在你的外掛中），則可以使用以下屬性建立你自己的外掛。

• rel − 指示相簿連結。值為 lightbox。

• href − 媒體物件的 URL。

• data-width − 設定使用者選擇的相簿寬度。

• data-height − 設定使用者選擇的相簿高度。

• data-srcset − srcset 字串用於圖片媒體。

操作

Grav 中的構建器模式用於處理媒體，以執行多個操作。某些操作適用於所有媒體，而某些操作僅適用於特定媒體。

常規

有 6 種類型的常規操作可用於媒體型別。下面解釋每個操作。

圖片操作

下表列出了一些應用於圖片的操作。

動畫和向量化圖片和影片

對圖片和影片進行動畫和向量化操作。以下是對圖片和影片進行的操作。

組合

Grav 具有圖片處理功能，使處理圖片變得容易。

![My New Image](/images/maxresdefault.jpg?negate&cropZoom = 500, 500&lightbox & cropZoom = 600,
200&contrast = -100&sharp&sepia)

上面的程式碼將生成如下所示的輸出：

響應式圖片

下表列出了一些型別的響應式圖片。

元檔案

image1.jpg、archive.zip或任何其他引用都能夠設定變數或被元檔案覆蓋。然後，這些檔案採用<filename>.meta.yaml的格式。例如，如果你有一個名為image2.jpg的圖片，那麼你的元檔案可以建立為image2.jpg.meta.yaml。內容必須使用 yaml 語法。你可以使用此方法新增任何你喜歡的檔案或元資料。

Grav - 模組化頁面

模組化頁面起初難以理解，但一旦你瞭解了它，使用起來就會非常容易。它能夠從其子頁面建立一個單頁。它能夠從模組化內容頁面構建複雜的單頁佈局。

模組化頁面設定為不可路由的，因為無法透過 URL 直接訪問它們。它們透過資料夾名稱之前的 _（下劃線）來標識。它是按順序顯示在上面的頁面的集合，以獲得單個頁面。例如，user/pages/home/_header.。

資料夾結構

對於單頁框架，你可以在01.home資料夾中找到此頁面。在這裡，你得到一個單一的模組化.md檔案，該檔案說明必須包含哪些頁面以及要顯示頁面的順序。modular.html.twig 可以在你的當前主題資料夾中找到。

在下圖中，你可以看到為模組化頁面建立的資料夾結構。

每個子資料夾都必須包含一個描述 Markdown 檔案的.md檔案。

首先，你必須在/users/pages/01.home資料夾中建立子資料夾。接下來，每個資料夾都必須包含一個.md檔案和一個modular.md檔案。

建立子資料夾時，圖片和檔案都必須位於同一資料夾中。

如何建立模組化頁面

要建立模組化頁面，你必須按照以下步驟操作。

步驟 1 − 在/user/pages/01.home/資料夾中建立一些頁面。在下圖中，你可以看到我們建立了兩個資料夾以及一個 modular.md 檔案。

步驟 2 − 要建立模組化頁面，你必須在每個資料夾中建立一個檔案，並將其命名為text.md。

步驟 3 − 接下來，在text.md檔案中新增你的程式碼，儲存並執行它。

示例

將所有四個頁面儲存為.md檔案。這裡我們建立了 4 個頁面，並命名為 text.md、text1.md、text2.md 和 text3.md。

---
title: Bio-diversity
---

## Bio-diversity

Biodiversity refers to the variety of life. It is seen in the number of species in an 
[ecosystem](https://simple.wikipedia.org/wiki/Ecosystem) or on the entire [Earth]
(https://simple.wikipedia.org/wiki/Earth). Biodiversity gets used as a measure of the
health of biological systems, and to see if there is a danger that too many species
become[extinct](https://simple.wikipedia.org/wiki/Extinct).

現在，建立 4 個頁面，將它們新增到\templates\modular資料夾中，如下所示。

接下來，轉到主頁並重新整理，你可以看到更改。

在新導航欄中，你可以看到四個檔案連結。

Grav - 多語言

多語言定義為在你的網站中使用不同的語言。我們將學習不同的步驟，這些步驟將幫助你在你的 Grav 站點中使用多語言。

多語言基礎知識

基本上，Grav 需要一個 `.md` 檔案來表示任何頁面。啟用多語言支援後，它將查詢類似於 `default.en.md` 或 `default.fr.md` 的檔案。

語言配置

首先，必須在你的 `user/config/system.yaml` 檔案中設定一些基本的語言配置。

Language:
   Supported:
      - en
      - Fr

透過這樣做，你就在 Grav 中啟用了多語言支援。在上面的程式碼中，`en` 表示英語，`fr` 表示法語。這意味著你的網站將支援這兩種語言。這裡預設語言是 `en (英語)`。如果首先寫 `fr (法語)`，那麼它就成為你的預設語言。

多語言頁面

如果你的預設語言設定為`英語`，Grav 將查詢 `default.en.md` 檔案。如果找不到該檔案，Grav 將查詢你設定的另一種語言。如果兩種語言都找不到，則查詢 `default.md` 檔案。

示例

default.en.md 檔案

---
title: Home
---

# Grav is Running!
## You have installed **Grav** successfully

上面的程式碼將生成以下輸出：

對於法語作為預設語言，`default.fr.md` 檔案將是：

---
titre: Accueil
---

# Grav est en marche!
## Vous avez installé ** ** Grav succès

上面的程式碼將生成以下輸出：

透過 URL 啟用語言

如果要使用語言程式碼更新網站的 URL，請按照以下步驟操作：

示例

如果希望你的網站顯示英文，請在瀏覽器中輸入以下內容：

http://www.mysite.com/en

如果希望你的網站顯示法文，請在瀏覽器中輸入以下內容：

http://www.mysite.com/fr 

透過瀏覽器啟用語言

Grav 能夠獲取 `http_accept_language` 值並將其與當前支援的語言進行比較。如果希望此功能生效，請在語言部分啟用 `user/system.yaml` 檔案，如下所示：

language :
   http_accept_language : true

基於語言的主頁

要擁有基於語言的主頁，必須在你的 `site.yaml` 檔案中啟用以下程式碼：

home:
   aliases:
      en: /homepage
      fr: /page-d-accueil

透過這種方式，Grav 將從活動語言中找出要使用的語言。

以下程式碼將強制 Grav 將你重定向到預設語言路由。`include_route` 選項強制在你的 URL 中新增語言程式碼，例如 `http://www.mysite.com/en/home`

languages:
   home_redirect:
      include_lang: true
      include_route: false

基於語言的 Twig 模板

如果你的檔案是 `default.en.md`，Grav 將查詢 `default.html.twig` 模板檔案。當你需要特定語言的 Twig 檔案時，必須將其上傳到語言資料夾的根級別。如果當前主題在 `templates/default.html.twig` 中，則必須建立一個 `templates/en/` 資料夾，並將你的特定於英語的資料夾放在其中，如下所示：`templates/en/default.html.twig`

語言切換器

語言切換器外掛可在 Grav 包管理器 (GPM) 獲取。

透過 Twig 進行翻譯

使用 Twig 過濾器和 `t()` 函式。這兩個函式的功能類似。如果你有另一個 Twig 檔案，它允許你從陣列中進行翻譯。

外掛和主題語言翻譯

透過在主題或外掛的根目錄中建立一個 `languages.yaml` 檔案（例如 `/user/plugins/error/languages.yaml`）來提供外掛和主題中的翻譯，並且必須包含所有支援的語言。

翻譯覆蓋

如果要覆蓋翻譯，則必須將鍵值對放在 `user/languages/` 資料夾中的語言檔案中。

高階

基於環境的語言處理

可以根據 URL 將使用者路由到網站的正確版本。如果你的網站 URL 是 `http://english.yoursite.com`，這是你的標準 `http://www.yoursite.com` 的別名，那麼你可以建立名為 `/user/english.yoursite.com/config/system.yaml` 的配置。

languages:
   supported:
      - fr
      - en

它使用反向語言順序。在上面的程式碼中，`fr` 是預設語言。如果透過將 `en` 放在頂部，`fr` 放在底部來更改順序，則 `en` 成為預設語言。

語言別名路由

在同一頁面的不同語言版本之間切換非常困難，你可以在頁面物件上使用 `Page.rawRoute()` 方法。它獲取單個頁面的不同語言翻譯的相同原始路由。將語言程式碼放在前面以獲取正確的路由。

如果你使用法語頁面，自定義路由為：

/ma-page-francaise-personnalisee

英文頁面具有以下自定義路由：

/my-custom-french-page

你獲得法語頁面的原始頁面，可能是：

/blog/custom/my-page

然後只需新增你想要的語言，這將成為你的新 URL。

/en/blog/custom/my-page

翻譯支援

Grav 提供了一個簡單的機制，用於透過 PHP 在 Twig 中提供翻譯，以便在主題和外掛中使用。它預設啟用，如果未定義特定語言，則使用 `en` 語言。要啟用或停用，請轉到 system.yaml 檔案並進行更改。

languages:
   translations: true

你可以透過多種方式和不同的位置提供翻譯。第一個位置是 system/languages 資料夾。必須建立 `en.yaml`、`fr.yaml` 等格式的檔案。每個 yaml 檔案必須包含鍵值對的陣列或巢狀陣列。

SITE_NAME: My Blog Site
HEADER:
   MAIN_TEXT: Welcome to my new blog site
   SUB_TEXT: Check back daily for the latest news

基於會話的活動語言

你可以啟用基於會話的活動語言儲存。要啟用它，必須在 system.yaml 中設定 `session: enables: true` 並啟用語言設定。

languages:
   session_store_active: true

語言切換器

從 GPM 安裝語言切換外掛。

使用特定語言的域進行設定

進行基於環境的語言處理配置以分配預設語言。將此選項新增到你的 system.yaml；它必須設定為 true。

pages.redirect_default_route: true

將以下內容新增到你的 `.htaccess` 檔案中，並根據你的要求選擇語言片段和域名。

# http://www.cheat-sheets.org/saved-copy/mod_rewrite_cheat_sheet.pdf
# http://www.workingwith.me.uk/articles/scripting/mod_rewrite

# handle top level e.g. http://Grav-site.com/de
RewriteRule ^en/?$ "http://Grav-site.com" [R = 301, L]
RewriteRule ^de/?$ "http://Grav-site.de" [R = 301, L]

# handle sub pages, exclude admin path
RewriteCond %{REQUEST_URI} !(admin) [NC]
RewriteRule ^en/(.*)$ "http://Grav-site.com/$1" [R = 301, L]
RewriteCond %{REQUEST_URI} !(admin) [NC]
RewriteRule ^de/(.*)$ "http://Grav-site.de/$1" [R = 301, L]

Grav - 主題基礎

主題控制 Grav 站點的外觀。Grav 中的主題是使用強大的 Twig 模板引擎 構建的。

內容頁面和 Twig 模板

你建立的頁面透過名稱或為頁面設定模板標題變數來引用特定模板檔案。建議使用頁面名稱，以便更輕鬆地維護。

安裝 Grav 基礎包後，你將在 `user/pages/01.home` 資料夾中找到 `defauld.md` 檔案。檔名（即 `default`）告訴 Grav 此頁面應使用位於 `themes//templates` 資料夾內的 Twig 模板 `default.html.twig` 進行渲染。

例如，如果你有一個名為 `contact.md` 的檔案，它將使用 Twig 模板 `themes//templates/contact.html.twig` 進行渲染。

主題組織

在以下部分，我們將討論主題組織，即它的定義、配置等等。

定義和配置

有關主題的資訊將在 `user/themes/antimatter/blueprints.yaml` 檔案中定義，並且可選地提供要在管理面板中使用的表單定義。你將在 `user/themes/antimatter/blueprints.yaml` 檔案中看到以下內容，用於`Antimatter` 主題。

name: Antimatter
version: 1.6.0
description: "Antimatter is the default theme included with **Grav**"
icon: empire
author:
   name: Team Grav
   email: devs@getgrav.org
   url: http://getgrav.org
homepage: https://github.com/getgrav/grav-theme-antimatter
demo: http://demo.getgrav.org/blog-skeleton
keywords: antimatter, theme, core, modern, fast, responsive, html5, css3
bugs: https://github.com/getgrav/grav-theme-antimatter/issues
license: MIT

form:
   validation: loose
   fields:
      dropdown.enabled:
         type: toggle
         label: Dropdown in navbar
         highlight: 1
         default: 1
         options:
            1: Enabled
            0: Disabled
         validate:
            type: bool

為了使用主題配置選項，你需要在一個名為 `user/themes//.yaml` 的檔案中提供預設設定。

示例

enable: true

主題和外掛事件

主題透過外掛架構與 Grav 互動的能力是 Grav 的另一個強大功能。為此，只需建立 `user/themes//.php`（例如，對於預設的 Antimatter 主題，為 `antimatter.php`）檔案並使用以下格式。

<?php
namespace Grav\Theme;

use Grav\Common\Theme;

class MyTheme extends Theme {
   public static function getSubscribedEvents() {
      return [
         'onThemeInitialized' => ['onThemeInitialized', 0]
      ];
   }
   public function onThemeInitialized() {
      if ($this->isAdmin()) {
         $this->active = false;
         return;
      }
      
      $this->enable([
         'onTwigSiteVariables' => ['onTwigSiteVariables', 0]
      ]);
   }
   public function onTwigSiteVariables() {
      $this->grav['assets']
         ->addCss('plugin://css/mytheme-core.css')
         ->addCss('plugin://css/mytheme-custom.css');

      $this->grav['assets']
         ->add('jquery', 101)
         ->addJs('theme://js/jquery.myscript.min.js');
   }
}

模板

Grav 主題的結構沒有設定規則，只是必須為每種頁面型別的內容在 `templates/` 資料夾中關聯 Twig 模板。

由於頁面內容和 Twig 模板之間存在這種緊密耦合，因此最好根據 下載頁面 中提供的 Skeleton 包建立通用主題。

假設你想在你的主題中支援模組化模板，你必須建立 `modular/` 資料夾並將 Twig 模板檔案儲存在其中。如果要支援表單，則應建立 `form/` 資料夾並將表單模板儲存在其中。

藍圖

要為每個模板檔案的選項和配置定義表單，可以使用 `blueprints/` 資料夾。這些將無法透過 `管理員面板` 進行編輯，並且是可選使用的。即使沒有 `blueprints` 資料夾，主題也能完全正常執行。

SCSS/LESS/CSS

如果要使用 SASS 或 LESS 開發網站，則必須在 `user/themes//scss/` 或 `less/`（如果要使用 LESS）中建立子資料夾，以及一個 `css/` 資料夾。

對於從 SASS 或 LESS 編譯生成的自動生成檔案，將使用 `css-compiled/` 資料夾。在 Antimatter 主題中，使用 SASS 的 `scss` 變體。

請按照以下步驟在你的機器上安裝 SASS。

• 在主題的根目錄下，鍵入以下命令以執行 scss shell 指令碼。

$ ./scss.sh

• 鍵入以下命令直接執行它。

$ scss --sourcemap --watch scss:css-compiled

`css-compiled/` 將包含所有編譯的 scss 檔案，並且 css 檔案將生成在你的主題中。

其他資料夾

建議在你的 `user/themes//` 資料夾中分別建立 `images/`、`fonts/` 和 `js/` 資料夾，用於主題中使用的任何影像、字型和 JavaScript 檔案。

主題示例

到目前為止我們討論的 `Antimatter` 主題的整體資料夾結構如下所示。

Grav - 主題教程

在本章中，讓我們建立一個 Grav 主題來理解這個概念。

Antimatter

安裝 Grav 基礎包時，將安裝預設的 `Antimatter` 主題，該主題使用 `Nucleus`（一組簡單的基本 CSS 樣式）。Nucleus 是一個輕量級的 CSS 框架，包含基本的 CSS 樣式和 HTML 標記，它提供了獨特的外觀和感覺。

Bootstrap

讓我們建立一個使用流行的 Bootstrap 框架 的主題。Bootstrap 是一個開源且最流行的 HTML、CSS 和 JS 框架，它使前端 Web 開發更快更容易。

以下步驟描述了主題的建立：

步驟 1：基本主題設定

正如我們在 主題基礎知識 一章中學習的那樣，Grav 主題有一些關鍵元素，為了建立新主題，必須遵循這些元素。

• 安裝 Grav 基礎包後，在 `user/themes` 資料夾下建立一個名為 bootstrap 的資料夾，如下所示。

• 在 `user/themes/bootstrap` 資料夾內，建立 `css/`、`fonts/`、`images/`、`js/` 和 `templates/`，如下所示。

• 在你的 `user/themes/bootstrap` 資料夾中建立一個名為 `bootstrap.php` 的主題檔案，並將以下內容貼上到其中。

<?php
namespace Grav\Theme;
use Grav\Common\Theme;
class Bootstrap extends Theme {}

• 現在，在 `themes/bootstrap` 資料夾中建立一個主題配置檔案 `bootstrap.yaml`，並在其中寫入以下內容。

enable: true

• 我們將跳過 `blueprints` 資料夾，因為我們沒有配置選項，並將在此章中使用常規 CSS。

步驟 2：新增 Bootstrap

為了建立一個 Bootstrap 主題，你必須在你的主題中包含 Bootstrap。因此，你需要透過單擊此 連結 下載最新的 Bootstrap 包，如下所示。

解壓縮包，你將看到三個資料夾，即 css、fonts 和 js。現在，將這三個資料夾的內容複製到前面建立的 `user/themes/bootstrap` 中名稱相似的資料夾中。

步驟 3：基本模板

正如我們在上一章中學習的那樣，內容儲存在 `default.md` 檔案中，該檔案指示 Grav 查詢名為 `default.html.twig` 的渲染模板。此檔案包含顯示頁面所需的一切。

有一個更好的解決方案，它利用 Twig 的 Extends 標籤，允許你使用 blocks 定義基本佈局。這將允許 Twig 模板擴充套件基本模板併為基本模板中定義的塊提供定義。

請按照以下步驟建立一個簡單的 Bootstrap 基本模板：

• 在 `user/themes/bootstrap/templates` 資料夾中建立一個名為 `partials` 的資料夾。這用於儲存我們的基本模板。

• 在 `partials` 資料夾中，建立一個包含以下內容的 `base.html.twig` 檔案。

<!DOCTYPE html>
<html lang = "en">
   <head>
      {% block head %}
      <meta charset = "utf-8">
      <meta http-equiv = "X-UA-Compatible" content = "IE = edge">
      <meta name = "viewport" content = "width = device-width, initial-scale = 1">
      {% if header.description %}
      <meta name = "description" content = "{{ header.description }}">
      {% else %}
      <meta name = "description" content = "{{ site.description }}">
      {% endif %}
      {% if header.robots %}
      <meta name = "robots" content = "{{ header.robots }}">
      {% endif %}
      <link rel = "icon" type = "image/png" href="{{ theme_url }}/images/favicon.png">

      <title>{% if header.title %}{{ header.title }} | {% endif %}{{ site.title }}</title>

      {% block stylesheets %}
         {# Bootstrap core CSS #}
         {% do assets.add('theme://css/bootstrap.min.css',101) %}

      {# Custom styles for this theme #}
         {% do assets.add('theme://css/bootstrap-custom.css',100) %}

         {{ assets.css() }}
      {% endblock %}

      {% block javascripts %}
         {% do assets.add('https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js', 101) %}
         {% do assets.add('theme://js/bootstrap.min.js') %}

         {% if browser.getBrowser == 'msie' and browser.getVersion >= 8 and browser.getVersion <= 9 %}
            {% do assets.add('https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js') %}
            {% do assets.add('https://oss.maxcdn.com/respond/1.4.2/respond.min.js') %}
         {% endif %}

         {{ assets.js() }}
      {% endblock %}

      {% endblock head %}
   </head>
      <body>
         {# include the header + navigation #}
         {% include 'partials/header.html.twig' %}

         <div class = "container">
            {% block content %}{% endblock %}
         </div>

         <div class = "footer">
            <div class = "container">
               <p class = "text-muted">Bootstrap Theme for <a href = "http://getgrav.org">Grav</a></p>
            </div>
         </div>
      </body>
   {% block bottom %}{% endblock %}
</html>

步驟 4：分解它

讓我們看看 `base.html.twig` 檔案中的程式碼是如何工作的，如下所示。

• {% block head %}{% endblock head %} 語法用於在基礎 Twig 模板中定義一個區域。{% endblock head %} 內部的 head 是可選的。

• if 語句測試頁面標題中是否設定了元描述。如果未設定，則模板應使用user/config/site.yaml檔案中定義的site.description進行渲染。

• 當前主題的路徑由theme_url變數給出。

• 語法{% do assets.add('theme://css/bootstrap.min.css',101) %}用於使用資產管理器。theme://表示當前主題路徑，101表示順序，數值越大優先順序越高。我們也可以顯式提供CDN連結，例如：

{% do assets.addCss('http://fonts.googleapis.com/css?family = Open + Sans') %}

或者：

{% do assets.addJs(' https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js') %}

• 當呼叫{{ assets.css() }}或{{ assets.js() }}時，模板會分別渲染所有 JavaScript 標籤和 CSS 連結標籤。

• 語法{# ... #}用於在 Twig 中編寫註釋。

• 要包含另一個 Twig 模板，可以使用{% include 'partials/header.html.twig' %}標籤。

• 模板的內容由{% block content %}{% endblock %}標籤提供。

• 要新增自定義 JavaScript 初始化或分析程式碼，可以使用{% block bottom %}{% endblock %}標籤作為模板的佔位符。

步驟 5：頁首模板

當執行{% include 'partials/header.html.twig' %}時，Twig 渲染引擎會搜尋 Twig 模板。因此，在user/themes/bootstrap/templates/partials資料夾內建立header.html.twig模板檔案，內容如下。

<nav class = "navbar navbar-default navbar-inverse navbar-static-top" role = "navigation">
   <div class = "container">
      <div class = "navbar-header">
         <button type = "button" class = "navbar-toggle"
            data-toggle = "collapse" data-target = ".navbar-collapse">
               <span class = "sr-only">Toggle navigation</span>
               <span class = "icon-bar"></span>
               <span class = "icon-bar"></span>
               <span class = "icon-bar"></span>
         </button>
         <a class = "navbar-brand" href = "#">Grav</a>
      </div>
      
      <div class = "navbar-collapse collapse">
         <ul class = "nav navbar-nav navbar-right">
            {% for page in pages.children %}
            {% if page.visible %}
            {% set current_page = (page.active or page.activeChild) ? 'active' : '' %}
            <li class = "{{ current_page }}"><a href = "{{ page.url }}">{{ page.menu }}</a></li>
            {% endif %}
            {% endfor %}
         </ul>
      </div>
      
   </div>
</nav>

以上程式碼建立了一個導航欄，並在user/pages資料夾中建立新頁面時自動顯示所有選單項。

每個內容項都有一個特定的檔名，例如default.md，它指示 Grav 搜尋名為default.html.twig的模板檔案。現在讓我們在user/themes/bootstrap/templates/資料夾中建立default.html.twig檔案，內容如下。

{% extends 'partials/base.html.twig' %}
{% block content %}
   {{ page.content }}
{% endblock %}

上面的default.html.twig檔案擴充套件了partials/base.html.twig，並告訴基礎模板對content塊使用{{ page.content }}。

步驟 7：主題 CSS

在partials/base.html.twig檔案中，我們使用assets.add('theme://css/bootstrap-custom.css',100)引用了自定義主題css，其中儲存了站點中使用的任何自定義CSS。

現在讓我們在user/themes/bootstrap/css資料夾中建立一個bootstrap-custom.css檔案，內容如下：

/* Restrict the width */
.container {
   width: auto;
   max-width: 960px;
   padding: 0 12px;
}

/* Place footer text center */
.container .text-muted {
   margin: 18px 0;
   text-align: center;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
   position: relative;
   min-height: 80%;
}

body {
   /* Margin bottom by footer height */
   margin-bottom: 60px;
}

.footer {
   position: absolute;
   bottom: 0;
   width: 100%;
   /* Set the fixed height of the footer here */
   height: 50px;
   background-color: #dcdcdc;
}

/* Typography */
/* Tables */
table {
   width: 100%;
   border: 1px solid #f0f0f0;
   margin: 30px 0;
}

th {
   font-weight: bold;
   background: #f9f9f9;
   padding: 5px;
}

td {
   padding: 5px;
   border: 1px solid #f0f0f0;
}

/* Notice Styles */
blockquote {
   padding: 0 0 0 20px !important;
   font-size: 16px;
   color: #666;
}

blockquote > blockquote > blockquote {
   margin: 0;
}

blockquote > blockquote > blockquote p {
   padding: 15px;
   display: block;
   margin-top: 0rem;
   margin-bottom: 0rem;
   border: 1px solid #f0f0f0;
}

blockquote > blockquote > blockquote > p {
   /* Yellow */
   margin-left: -75px;
   color: #8a6d3b;
   background-color: #fcf8e3;
   border-color: #faebcc;
}

blockquote > blockquote > blockquote > blockquote > p {
   /* Red */
   margin-left: -100px;
   color: #a94442;
   background-color: #f2dede;
   border-color: #ebccd1;
}

blockquote > blockquote > blockquote > blockquote > blockquote > p {
   /* Blue */
   margin-left: -125px;
   color: #31708f;
   background-color: #d9edf7;
   border-color: #bce8f1;
}

blockquote > blockquote > blockquote > blockquote > blockquote > blockquote > p {
   /* Green */
   margin-left: -150px;
   color: #3c763d;
   background-color: #dff0d8;
   border-color: #d6e9c6;
}

步驟 8：測試

將您的預設主題更改為新的bootstrap主題。開啟user/config/system.yaml檔案並編輯包含以下內容的行：

pages:
   themes: antimatter

並將以上程式碼更改為：

pages:
   theme: bootstrap

現在重新載入您的 Grav 站點，您將看到如下所示的新安裝主題。

Grav - Twig 過濾器和函式

在本章中，讓我們學習Twig 過濾器和函式。過濾器用於以所需輸出的方式格式化資料。函式用於生成內容。

Twig 模板是包含表示式和變數的文字檔案，這些表示式和變數由值替換。Twig 使用三種類型的標籤。

• 輸出標籤 - 以下語法用於在此處顯示已計算表示式的結果。

{{  Place Your Output Here  }}

• 操作標籤 - 以下語法用於在此處執行語句。

{%  executable statements are placed here  %}

• 註釋標籤 - 以下語法用於在 Twig 模板檔案中編寫註釋。

{#  write your comment here  #}

Twig 過濾器

Twig 過濾器使用|字元將過濾器應用於 Twig 變數，後跟過濾器名稱。引數可以像 Twig 函式一樣在括號中傳遞。

下表顯示了 Grav 中使用的 Twig 過濾器：

'<img src="/some/path/img.jpg"/>' |absolute_url

<img src="http://learn.getGrav.org/some/path/img.jpg" />

'contact_us'| camelize

ContactUs

'This is some string' | contains('some')

1

set header_image_width = 
page.header.header_image_width|defined(900)

'this is an example for ends-with filter' | ends_with('filter')

True

'field.name'|fieldName

field[name]

'some_text_to_read'|humanize

Some text to read

{% set ritems = {'orange':1, 'apple':2, 'peach':3}|ksort %}
{% for key, value in ritems %}{{ key }}:{{ value }}, {% endfor %}

apple:2, orange:1, peach:3,

'/strip/leading/slash/'|ltrim('/')

strip/leading/slash/

'## some text with markdown'|markdown

some text with markdown

'something'|md5

437b930db84b8079c2dd804a71936b5f

'61'|monthize

2

page.date|nicetime(false)

3 hrs ago

'78'| ordinalize

78th

'child'|pluralize

children

{% set ritems = ['one', 'two', 'three', 'four', 'five', 'six', 'seven', 'eight', 'nine', 'ten']|randomize(3) %}
{% for ritem in ritems %}{{ ritem }}, {% endfor %}

one, two, three, eight, six, five, nine, seven, ten, four,

'/strip/leading/slash/'|rtrim('/')

/strip/leading/slash

'vehicles'|singularize

vehicle

"someoneemailaddress@domain.com"|safe_email

someoneemailaddress@domain.com

{% set people = [{'email':'john@gmail.com', 'id':3}, {'email':'melw@fdd.com', 'id':1}, {'email':'nancy@fb.com', 'id':7}]|sort_by_key('id') %}
{% for person in people %}{{ person.email }}:{{ person.id }}, {% endfor %}

melw@fdd.com:1, john@gmail.com:3, nancy@fb.com:7,

'this is an example for starts-with filter' |starts_with('this')

true

MY_LANGUAGE_KEY_STRING

'Some text in English'

'welcome page'|titleize

Welcome Page

'ContactUs'|underscorize

contact_us

'one sentence. two sentences'|truncate(5)

one s...

'one sentence. two sentences'|truncate(5, true)

one sentence

'<p>one <strong>sentence<strong>. two sentences</p>'|striptags|truncate(5)

one s

Twig 函式

Twig 函式透過傳遞引數直接呼叫。下表列出了這些函式：

array(value)

authorize(['admin.statistics', 'admin.super'])

dump(page.header)

generate_random_string(10)

repeat('Grav ', 10) will repeat Grav 10 times.

ta (23)

url('theme://images/logo.png') | default('http://www.placehold.it/150x100/f4f4f4')

t('SITE_NAME')

Site Name

Grav - 主題變數

在本章中，讓我們瞭解 Grav 中的主題變數。在設計主題時，從 twig 模板訪問物件和變數，這些物件和變數由 Twig 模板框架讀取和操作。

核心物件

Twig 模板有很多核心物件；每個物件都有一組變數和函式。

下表顯示了帶有簡要說明的變數。

config 物件

在configuration.yaml檔案中，config 物件被設定為訪問任何 Grav 配置設定。

{{ config.pages.theme }}

它將返回當前配置的主題。

site 物件

提供對config.site物件的別名，表示在site.yaml檔案中設定的配置。

stylesheets 物件

這些物件提供了一個用於儲存 CSS 樣式表資產的陣列，可以迴圈新增 CSS 到模板。

scripts 物件

這些物件提供一個包含 JavaScript 資產的陣列，該陣列被迴圈遍歷並將 JavaScript 新增到模板。

page 物件

由於 Grav 的結構在pages/資料夾中定義，因此page 物件負責表示每個頁面。page 物件包含有關您當前正在處理的頁面的所有資訊。

下表顯示了 page 物件的方法。

{{ page.summary }}

{{ page.summary(80) }}

{{ page.content }}

title: About Us
author: Johnson

The author of this page is:  {{ page.header.author }}

{% set first_image = page.media|first %}
{% set my_pdf = page.media['myfile.pdf'] %}
{% for image in page.media.images  %}
   {{ image.html }}
{% endfor %}

title: My Page

title: My Blog
menu: my blog page

title: About Us
visible: true

title: My Page
routable: true

my-page

{{ page.url }}  { # could return /myfolder/mypage #}

{{ page.url(true) }}  {# could return http: //mysite.com/ myfolder/mypage #}

{% include 'modular/author-detail.html.twig' with {'page': page.find('/authors/ john-bloggs')} %}

{% for child in page.collection %}
   {% include 'partials /blog_item.html.twig' with {'page':child, 'truncate':true} %}
{% endfor %}

/Users/yourname/sites/ Grav/user/pages/ 01.home/default.md

user/pages/ 01.home/default.md

/Users/yourname /sites/ Grav/user/pages /01.home

pages 物件

Pages 物件表示為頁面物件的巢狀樹。此巢狀樹在建立導航、站點地圖或查詢特定頁面時非常有用。

children 方法

這返回一個由子頁面組成的頁面物件陣列。具有樹狀結構的頁面物件可以迭代資料夾中的每個頁面。

要獲取選單的頂級頁面，請使用以下程式碼。

<ul class = "navigation">
   {% for page in pages.children %}
      {% if page.visible %}
         <li><a href = "{{ page.url }}">{{ page.menu }}</a></li>
      {% endif %}
   {% endfor %}
</ul>

uri 物件

可以使用 Uri 物件的幾種方法訪問當前 URI 的部分。

http://mysite.com/Grav/section/category/page.json/param1:foo/param2:bar/?query1 = baz&query2 = qux:

下表顯示了 Uri 物件的方法。

uri.path = /section/category/page

uri.paths = [section, category, page])

uri.route(true) = http://mysite.com/Grav/ section/category/page

uri.route() = /section/category/page)

uri.params = /param1:foo/param2:bar

uri.param('param1') = foo

uri.query = query1=bar&query2=qux

uri.query('query1') = bar

uri.url(false) = Grav/section/ category/page/param:foo?query = bar

uri.extension = json)

uri.host = mysite.com

uri.base = http://mysite.com

uri.rootUrl() = http://mysite.com/Grav

header 物件

它是原始頁面的page.header()的替代方法。當您遍歷子頁面時，最好使用原始頁面標題。

content 物件

它是原始頁面的page.content()的替代方法。

taxonomy 物件

站點的所有分類法資訊都包含在全域性 taxonomy 物件中。

browser 物件

Grav 使用內建支援以程式設計方式確定使用者的平臺、瀏覽器和版本。

{{ browser.platform}}   # windows
{{ browser.browser}}    # chrome
{{ browser.version}}    # 24

新增自定義變數

自定義變數可以透過多種方式新增。如果您使用的是站點範圍的變數，則將其放在user/config/site.yaml檔案中，您可以按如下所示訪問它。

{{ site.my_variable }}

如果變數僅適用於特定頁面，則可以將其新增到 YAML 前端內容中，並使用page.header物件訪問它。

例如 -

title: My Page
author: John

作者姓名可以訪問為 -

The author of this page is: {{ page.header.author }}

新增自定義物件

使用外掛，您可以向 Twig 物件新增自定義物件。這是一個高階主題，我們將在外掛章節中看到更多資訊。

Grav - 資源管理器

在本節中，讓我們學習資產管理器。資產管理器在 Grav 0.9.0 中引入，用於統一新增和管理JavaScript和CSS等資產的介面。從主題和外掛新增這些資產將提供高階功能，例如排序和資產管道。資產管道用於縮小和壓縮資產，從而減少瀏覽器的需求並減小資產的大小。

資產管理器是一個類，可以透過外掛事件鉤子在 Grav 中使用。您也可以透過使用 Twig 呼叫在主題中直接使用資產管理器類。

配置

資產管理器包含一組配置選項。system.yaml檔案包含預設值；您可以在您的user/config/system.yaml檔案中覆蓋這些值。

assets:                     # Configuration for Assets Manager (JS, CSS)
   css_pipeline: false      # The CSS pipeline is the unification of multiple CSS resources into one file
   css_minify: true         # Minify the CSS during pipelining
   css_rewrite: true        # Rewrite any CSS relative URLs during pipelining
   js_pipeline: false       # The JS pipeline is the unification of multiple JS resources into one file
   js_minify: true          # Minify the JS during pipelining

主題中的資產

安裝 Grav 時，Antimatter 主題作為預設主題提供。它顯示瞭如何在位於此主題中的base.html.twig檔案中新增 CSS 檔案的示例。

{% block stylesheets %}
   {% do assets.addCss('theme://css/pure-0.5.0/grids-min.css', 103) %}
   {% do assets.addCss('theme://css-compiled/nucleus.css',102) %}
   {% do assets.addCss('theme://css-compiled/template.css',101) %}
   {% do assets.addCss('theme://css/custom.css',100) %}
   {% do assets.addCss('theme://css/font-awesome.min.css',100) %}
   {% do assets.addCss('theme://css/slidebars.min.css') %}

   {% if browser.getBrowser == 'msie' and browser.getVersion == 10 %}
      {% do assets.addCss('theme://css/nucleus-ie10.css') %}
   {% endif %}
   {% if browser.getBrowser == 'msie' and browser.getVersion >= 8 and browser.getVersion <= 9 %}
      {% do assets.addCss('theme://css/nucleus-ie9.css') %}
      {% do assets.addJs('theme://js/html5shiv-printshiv.min.js') %}
   {% endif %}
{% endblock %}
{{ assets.css() }}

以上程式碼簡要說明如下。

• 在block twig 標記中定義的區域可以在擴充套件該區域的模板中替換或追加，您可以看到此塊內do assets.addCss()呼叫的數量。

• {% do %}標記允許您處理沒有任何輸出的變數，該變數內置於 Twig 本身。

• 可以使用addCss()方法將 CSS 資產新增到資產管理器。您可以透過傳遞數值作為第二個引數來設定樣式表的優先順序。對addCss()方法的呼叫將從 CSS 資產呈現 HTML 標記。

JavaScript 資產的使用方式與 CSS 資產相同。JavaScript 資產位於如下所示的 `block` Twig 標籤內。

{% block javascripts %}
   {% do assets.addJs('jquery',101) %}
   {% do assets.addJs('theme://js/modernizr.custom.71422.js',100) %}
   {% do assets.addJs('theme://js/antimatter.js') %}
   {% do assets.addJs('theme://js/slidebars.min.js') %}
   {% do assets.addInineJs('alert(\'This is inline!\')') %}
{% endblock %}
{{ assets.js() }}

新增資產

下表列出了不同的新增方法：

選項

有很多選項可以傳遞資產陣列，解釋如下：

對於 CSS

• `priority` - 它接受整數值，預設值為 100。

• `pipeline` - 當資產不包含在流程中時，將其設定為 `false` 值。預設值為 `true`。

對於 JS

• `priority` - 接受整數值，預設值為 100。

• `pipeline` - 當資產不包含在流程中時，設定為 `false`。預設值為 `true`。

• `loading` - 此選項支援三個值：`empty`、`async` 和 `defer`。

• `group` - 它包含一個字串，指定組的唯一名稱。預設值為 `true`。

示例

{% do assets.addJs('theme://js/example.js', 
{'priority':101, 'pipeline':true, 'loading':'async', 'group':'top'}) %}

渲染資產

可以使用以下方法渲染 CSS 和 JS 資產的當前狀態：

css()

`css()` 方法根據已新增到資產管理器的所有 CSS 資產，渲染一個包含 HTML CSS 連結標籤的列表。根據 `pipeline` 屬性，列表可以包含壓縮檔案和單個/組合資產。

js()

`js()` 方法根據已新增到資產管理器的所有 JS 資產，渲染一個包含 HTML JS 連結標籤的列表。根據 `pipeline` 屬性，列表可以包含壓縮檔案和單個/組合資產。

命名資產

Grav 允許您使用名稱註冊 CSS 和 JS 資產的集合，以便您可以使用註冊的名稱將 `add` 資產新增到資產管理器。這可以透過 Grav 的 `命名資產` 功能實現。這些自定義集合在 `system.yaml` 中定義；任何主題或外掛都可以使用這些集合。

assets:
   collections:
      jquery: system://assets/jquery/jquery-2.1.3.min.js
      bootstrap:
         - https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css
         - https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css
         - https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js

`registerCollection()` 方法可以用以下程式碼以程式設計方式使用：

$assets = $this->Grav['assets'];
   $bootstrapper_bits = [https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css,
      https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css,
      https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js];
   $assets->registerCollection('bootstrap', $bootstrap_bits);
$assets->add('bootstrap', 100);

分組資產

Grav 0.9.43 引入了一項名為 `分組資產` 的新功能，允許您在新增資產時傳遞包含可選 `group` 的選項陣列。當您需要頁面特定部分的一些 JS 檔案或內聯 JS 時，此功能非常有用。

使用選項語法，您必須在新增資產時指定組，如下所示。

{% do assets.addJs('theme://js/example.js', {'priority':102, 'group':'bottom'}) %}

如果未為資產設定組，則預設為 `head` 組。如果您希望這些資產在底部組中渲染，則必須在您的主題中新增以下內容。

{{ assets.js('bottom') }}

靜態資產

當您想在不使用資產管理器的情況下引用資產時，可以使用 `url()` 輔助方法。例如，當您想從主題引用影像時，可以使用以下語法。

<img src = "{{ url("theme://" ~ widget.image) }}" alt = "{{ widget.text|e }}" />

`url()` 輔助方法可以選擇第二個引數，使用 `true` 或 `false` 值使 URL 包含域和模式。預設值為 `false`，僅顯示相對 URL。

示例

url("theme://somepath/mycss.css", true)

Grav - 主題定製

本章，我們將學習 `主題定製`。定製主題的方法有很多。Grav 提供了許多功能和一些易於定製主題的功能。

自定義 CSS

您可以提供您自己的 `custom.css` 檔案來定製您的主題。Antimatter 主題透過使用 `資產管理器` 來引用 `css/custom.css` 檔案。如果找不到對 CSS 檔案的引用，則 `資產管理器` 將不會新增對 HTML 的引用。在 Antimatter 的 `css/` 資料夾中建立 CSS 檔案將覆蓋預設 CSS。例如：

custom.css

body a {
   color: #FFFF00;
}

預設連結顏色被覆蓋並設定為黃色。

自定義 SCSS/LESS

提供自定義 CSS 檔案的另一種方法是使用 `custom.scss` 檔案。`SCSS（Syntactically Awesome Style Sheets）` 是一種 CSS 預處理器，允許您透過使用運算子、變數、巢狀結構、匯入、部分和混合來高效地構建 CSS。Antimatter 使用 SCSS 編寫的。

要使用 SCSS，您需要 SCSS 編譯器。您可以使用命令列工具和 GUI 應用程式在任何平臺上安裝 SCSS 編譯器。Antimatter 使用 `scss/` 資料夾來放置所有 `.scss` 檔案。編譯後的檔案儲存在 `css-compiled/` 資料夾中。

應監視 `SCSS` 檔案的任何更新，這可以透過使用以下命令完成：

scss --watch scss:css-compiled

上述命令告訴 SCSS 編譯器監視名為 scss 的目錄，並且每當 `css-compiled` 資料夾更新時，SCSS 編譯器都應對其進行編譯。

您可以將自定義 SCSS 程式碼儲存在 `scss/template/_custom.scss` 檔案中。將程式碼儲存在此檔案中有很多優點。

• SCSS 檔案和其他 CSS 檔案的任何更新都將編譯到 `css-compiled/template.css` 檔案中。

• 您可以訪問主題中使用的任何 SCSS，並利用其中可用的所有變數和混合。

• 為了更輕鬆地進行開發，您可以訪問標準 SCSS 的所有功能。

`_custom.scss` 檔案示例如下：

body {
   a {
      color: darken($core-accent, 20%);
   }
}

升級主題時，所有自定義 css 都會被覆蓋。這是選擇這種方式定製主題的主要缺點。這可以透過主題繼承來解決。

主題繼承

`主題繼承` 是修改或定製主題的最佳方法，可以透過一些設定來實現。基本思想是將主題定義為您繼承的基主題，並且只能修改一些部分，其餘部分由基主題處理。使用主題繼承的優點是，每當更新基主題時，自定義的繼承主題都不會直接受到影響。要實現此目的，您需要按照以下步驟操作。

• 要儲存您的新主題，請在 `/user/themes/` 資料夾內建立一個名為 `mytheme/` 的新資料夾。

• 接下來，您需要在新建的 `/user/themes/mytheme/` 資料夾下建立一個名為 `mytheme.yaml` 的新主題 YAML 檔案，內容如下。

streams:
   schemes:
      theme:
         type: ReadOnlyStream
         prefixes:
            '':
               - user/themes/mytheme
               - user/themes/antimatter

• 在 `/user/themes/mytheme/` 資料夾下建立一個名為 `blueprints.yaml` 的 YAML 檔案，內容如下。

name: MyTheme
version: 1.0.0
description: "Extending Antimatter"
icon: crosshairs
author:
   name: Team Grav
   email: devs@getgrav.org
   url: http://getgrav.org

現在我們將瞭解如何定義包含基本元素的主題 `blueprints.yaml`。可以為表單定義提供更多詳細資訊以控制您的表單功能。可以檢查 `blueprints.yaml` 檔案以獲取有關此方面的更多詳細資訊。

• 在您的 `user/config/system.yaml` 檔案中，編輯 `pages: theme:` 選項以將您的預設主題更改為新主題，如下所示。

pages:
   theme: mytheme

現在建立了新的主題，Antimatter 將成為此新 `mytheme` 主題的基主題。如果您想修改特定的 SCSS，我們需要配置 SCSS 編譯器，以便它首先查詢您的 `mytheme` 主題，其次查詢 Antimatter 主題。

它使用以下設定：

• 首先複製位於 `antimatter/scss/` 資料夾中的 `template.scss` 檔案，並將其貼上到 `mytheme/scss/` 資料夾中。此檔案將包含對各種檔案（如 `template/_custom.scss` 和子檔案）的所有 `@import` 呼叫。

• `load-path` 指向包含大量 SCSS 檔案的 `antimatter/scss/` 資料夾。要執行 SCSS 編譯器，您需要向其提供 `load-path`，如下所示。

scss --load-path ../antimatter/scss --watch scss:css-compiled

• 現在，在 `mytheme/scss/template/` 下建立一個名為 `_custom.scss` 的檔案。此檔案將包含您所有的修改。

更改自定義 SCSS 檔案後，所有 SCSS 檔案都將自動重新編譯到位於 `mytheme/css-compiled/` 資料夾下的 `template.css` 中，然後 Grav 將準確引用它。

Grav - 外掛基礎

本章，我們將瞭解外掛如何在 Grav 中作為附加功能工作。外掛是一段軟體，它提供 Grav 核心功能最初未完成的附加功能。

Grav 外掛可以上傳以擴充套件網站的功能。外掛用於簡化您的工作。依賴注入容器有助於訪問 Grav 中的關鍵物件。在整個生命週期中，藉助Grav 的事件鉤子，我們可以根據需要操作 Grav，也可以訪問 Grav 已知的一切。我們將在第 Grav - 事件鉤子 章中詳細學習 Grav 事件鉤子。

依賴注入是一種軟體設計模式，其中元件被賦予它們的依賴項，而不是在元件內硬編碼它們。

Grav 有許多可用的免費外掛，用於顯示部落格歸檔、站點地圖、搜尋引擎、表單、輕量級滑塊等等。您可以從 這裡 下載外掛。您可以在 Plugin 資料夾中儲存具有唯一名稱的外掛；名稱應與外掛的功能相關，並且不應包含任何大寫字母、下劃線或空格。我們將在第 Grav - 外掛教程 章中學習如何使用外掛。

強大

外掛易於編寫、靈活且強大。共有 46 個外掛，其功能包括顯示站點地圖、提供麵包屑、顯示部落格存檔等。

基本要素

當 Grav 安裝在您的系統上時，您可以在<your_folder_name>/user/plugins 資料夾中看到兩個外掛。

• 錯誤外掛

• 問題外掛

錯誤外掛 - 用於顯示HTTP 錯誤，即當給定 URI 沒有可用的請求頁面時顯示404 頁面未找到。

問題外掛 - 用於檢測許可權、託管設定和缺少資料夾方面的問題。在安裝新的 Grav 時，它有助於識別此類問題。

Grav - 外掛教程

在本節中，我們將深入探討如何設定和配置外掛。此外，我們還將瞭解外掛的結構以及如何顯示隨機頁面。外掛是一段軟體，它提供了 Grav 的核心功能最初未完成的附加功能。

在本文中，我們將使用隨機外掛顯示隨機頁面。在使用此外掛之前，我們將瞭解隨機外掛的一些重要要點。

• 您可以使用此外掛透過使用 URI 為/random 來顯示隨機頁面。

• 建立過濾器以使用頁面中指定的分類法。您可以建立為category: blog。

• 您可以使用過濾器選項顯示隨機頁面；這會通知 Grav 使用要在隨機頁面中顯示的相同內容。

外掛設定

在使用實際外掛之前，請按照以下步驟建立外掛的基本設定。

• 在user/plugins資料夾下建立一個名為random的資料夾。

• 在user/plugins/random資料夾下，建立兩個檔案：

  • random.php 用於外掛程式碼

  • random.yaml 用於配置

外掛配置

要使用隨機外掛，我們需要一些配置選項。我們將在random.yaml檔案中寫入以下幾行。

enabled:true
route:/random
filters:
   category:blog

Random 建立您定義的路由。基於分類法過濾器，它會選擇一個隨機專案。過濾器的預設值為'category: blog'，用於隨機選擇。

外掛結構

以下程式碼可用於外掛結構。

<?php
   namespace Grav\Plugin;
   use Grav\Common\Page\Collection;
   use Grav\Common\Plugin;
   use Grav\Common\Uri;
   use Grav\Common\Taxonomy;
   
   class RandomPlugin extends Plugin {
   }
?>

我們使用use語句在外掛中使用一堆類，這使得它更易於閱讀，並且節省了空間。必須在 PHP 檔案的頂部編寫namespace Grav\Plugin。外掛名稱應以首字母大寫的方式編寫，並應使用Plugin擴充套件。

您可以將函式getSubscribedEvents()訂閱到onPluginsInitialized事件；這決定了外掛訂閱了哪些事件。這樣，您可以使用該事件訂閱其他事件。

public static function getSubscribedEvents() {
   return [
      'onPluginsInitialized' => ['onPluginsInitialized', 0],
   ];
}

現在讓我們使用RandomPlugin類下的onPluginInitialized事件來路由在random.yaml檔案中配置的頁面。

onPluginInitialized()方法包含以下程式碼：

public function onPluginsInitialized() {
   $uri = $this->grav['uri'];
   $route = $this->config->get('plugins.random.route');
   
   if ($route && $route == $uri->path()) {
      $this->enable([
         'onPageInitialized' => ['onPageInitialized', 0]
      ]);
   }
}

Uri物件包含當前uri、關於路由的資訊。config物件指定隨機外掛路由的配置值，並將其儲存在route物件中。

現在我們將比較配置的路由與當前 URI 路徑，這會通知外掛監聽onPageInitialized事件。

顯示隨機頁面

您可以使用以下方法的程式碼顯示隨機頁面：

public function onPageInitialized() {
   $taxonomy_map = $this->grav['taxonomy'];
   $filters = (array) $this->config->get('plugins.random.filters');
   $operator = $this->config->get('plugins.random.filter_combinator', 'and');
   
   if (count($filters)) {
      $collection = new Collection();
      $collection->append($taxonomy_map->findTaxonomy($filters, $operator)->toArray());
      
      if (count($collection)) {
         unset($this->grav['page']);
         $this->grav['page'] = $collection->random()->current();
      }
   }
}

如程式碼所示：

• 將分類法物件賦值給變數$taxonomy_map。

• 獲取使用外掛配置中配置的分類法的過濾器陣列，使用config物件。我們使用專案category: blog。

• 我們使用collection將隨機頁面儲存在$collection中。將匹配過濾器的頁面附加到$collection變數。

• 取消設定當前頁面物件，並將當前頁面設定為在集合中顯示為隨機頁面。

最後，我們將看到顯示隨機頁面的外掛的完整程式碼，如下所示：

<?php
namespace Grav\Plugin;
use Grav\Common\Page\Collection;
use Grav\Common\Plugin;
use Grav\Common\Uri;
use Grav\Common\Taxonomy;

class RandomPlugin extends Plugin {
   public static function getSubscribedEvents() {
      return [
         'onPluginsInitialized' => ['onPluginsInitialized', 0],
      ];
   }
   public function onPluginsInitialized() {
      $uri = $this->grav['uri'];
      $route = $this->config->get('plugins.random.route');
      if ($route && $route == $uri->path()) {
         $this->enable([
            'onPageInitialized' => ['onPageInitialized', 0]
         ]);
      }
   }
   public function onPageInitialized() {
      $taxonomy_map = $this->grav['taxonomy'];
      $filters = (array) $this->config->get('plugins.random.filters');
      $operator = $this->config->get('plugins.random.filter_combinator', 'and');
      
      if (count($filters)) {
         $collection = new Collection();
         $collection->append($taxonomy_map->findTaxonomy($filters, $operator)->toArray());
         
         if (count($collection)) {
            unset($this->grav['page']);
            $this->grav['page'] = $collection->random()->current();
         }
      }
   }
}

開啟您的瀏覽器並輸入localhost/folder_name/random以檢視隨機頁面，如下面的螢幕截圖所示：

Grav - 事件鉤子

在本節中，我們將學習 Grav 中的事件鉤子。在外掛章節中，您將看到外掛的邏輯包含在兩種方法中。這些方法是onPluginsInitialized和onPageInitialized；這些方法類似於事件鉤子。要了解和控制 Grav 外掛的功能，您需要檢查事件鉤子的可用性。事件鉤子與 Grav 從頭到尾都有直接的關係。您必須瞭解鉤子的呼叫順序以及在這些呼叫時可以使用什麼。

下表列出了在頁面處理期間啟用的核心 Grav事件鉤子。

Twig 事件鉤子

Twig 有自己的一組事件鉤子可以使用，如下所示。

集合事件鉤子

下表列出了一個集合事件鉤子。

頁面事件鉤子

下表列出了頁面事件鉤子的集合。

Grav - 管理員介紹

Grav 管理面板外掛是 Grav 的 Web 圖形使用者介面 (GUI)。它可以輕鬆建立和修改頁面。這是一個可選外掛，為了有效工作，Grav 並不會完全依賴於它。管理員提供了有限的檢視，以便輕鬆使用 Grav。

功能

以下是管理面板的功能：

• 啟用或停用外掛管理器列表中存在的外掛。

• 您可以輕鬆建立、編輯、複製和刪除頁面。

• 最新的頁面更新列表顯示在儀表板上。

• 只需單擊一下即可輕鬆檢視最新的可用更新。

• 使用搜索框從列表中查詢特定頁面。

• 它具有忘記密碼的功能。

• 可以使用拖放方法上傳媒體檔案。

• 允許在普通模式和專家模式下透過 yaml 或表單進行編輯。

• 儀表板包含網站活動、最新的頁面更新和維護狀態。

• 它包含基於 Ajax 的備份和清除快取功能。

• 它包含站點和系統配置管理。

• 由 GPM 提供支援的新外掛和主題安裝。

• 在使用者登入期間提供自動密碼加密功能。

• 它提供程式碼編輯器，該編輯器使用即時的 Grav 提供的預覽功能突出顯示強大的語法。

• 可以使用主題管理器完成已安裝主題的列表和配置。

• 它還管理已登入的使用者。

安裝

要訪問管理員外掛，我們需要執行**最新版本的 Grav**。您可以在 CLI（命令列介面）中執行以下命令。

$ bin/gpm selfupgrade -f

**selfupgrade** 用於將 Grav 更新到最新可用版本。**-f** 用於重新整理 GPM（Grav 包管理器）索引。

我們需要安裝**admin**、**form**、**email** 和**login** 外掛才能使您的管理員外掛正常執行。由於所有外掛都有依賴項，因此在安裝管理員外掛時，您需要同意安裝其他外掛的提示；這些外掛可透過 GPM（Grav 包管理器）獲得。我們將在章節Grav - GPM中詳細瞭解 GPM。

以下命令用於使用命令提示符安裝管理員外掛。

$ bin/gpm install admin

手動安裝

我們可以透過分別下載以下外掛來手動安裝管理面板：

• admin
• form
• login
• email

下載所有外掛後，解壓縮所有 zip 檔案並存儲在**<your_folder_name>/user/plugins** 資料夾中。在 Plugin 資料夾中，您可以使用唯一名稱儲存外掛；名稱應與外掛的功能相關。資料夾可以重新命名為**admin/**、**email/**、**form/** 和**login/**。必須將所有四個外掛一起儲存在 Plugin 資料夾中；否則，管理面板將無法正常工作。

建立使用者

我們可以使用命令列介面建立使用者帳戶。使用以下命令建立使用者帳戶。

$bin/grav newuser

或者，您也可以透過編寫以下程式碼行來手動建立使用者帳戶：

email: admin@tutorials.com
access:
   admin:
      login: true
      super: true
   site:
      login: true
fullname: 'Tutorials Point'
title: tp
password: 'Password'

將上述程式碼行儲存到**<your_folder_name>/user/account/admin.yaml** 檔案中。您用來儲存上述程式碼的名稱將是您的登入名**使用者名稱**，即 admin。您可以根據您的要求編輯**email**、**fullname**、**title** 和**password**。

使用

您可以透過將瀏覽器指向**localhost/<your_folder_name>/admin** 來訪問管理面板，您將看到如下所示的螢幕。您可以在 yaml 檔案中設定**使用者名稱**和**密碼**，如**建立使用者**部分所述。

Grav - 管理員控制面板

在本節中，我們將學習 Grav 中的**管理面板儀表盤**。儀表盤充當 Grav 管理面板外掛資訊的中樞神經系統。您可以檢查**流量統計**、**建立新備份**、**Grav 更新**、**維護資訊**，檢視最新的頁面更新，並可以使用此單個頁面清除 Grav 的快取。

**步驟 1** - 您可以為使用者指定許可權並根據需要更改**儀表盤**的內容。儀表盤的螢幕將類似於以下螢幕截圖。

**步驟 2** - 您現在將在儀表盤中看到**快取和更新檢查**的功能。

您將在儀表盤選單頂部看到兩個選項卡。

• 清除快取
• 檢查更新

清除快取

它指定刪除所有快取內容，包括影像和資源的快取。

您可以在下拉選單中看到更多功能，如下所示。

• **所有快取** - 它指定刪除所有快取

• **僅限資源** - 它指定僅刪除資源的快取。

• **僅限影像** - 它指定僅刪除影像的快取。

• **僅限快取** - 它定義為僅刪除快取。

檢查更新

此選項卡指定檢查站點的更新。如果可用新更新，您將在儀表盤上收到通知。您將收到受支援的外掛、主題甚至 Grav 的更新。

維護和統計

此部分允許您瞭解有關您站點的重要的資訊。

維護

此部分為您提供 Grav 功能完全最新的百分比圖表。您將在“維護和統計”部分上方看到所需更新的通知。

• **更新** - 一旦有新更新可用，將出現“更新”按鈕。接下來，您可以點選它並更新您的外掛和主題。您會在通知欄中看到**立即更新 Grav** 按鈕，該按鈕會更新 Grav 的核心部分。

• **備份** - 在此部分，您可以看到顯示您多久沒有備份站點的圖表。這可以透過生成和下載 zip 檔案來執行，將其儲存為站點的備份資料。

統計

它顯示了過去一天、一週和一個月內接收到的站點訪問者流量的簡單快速檢視圖表。它顯示按星期幾分開的條形圖。

**步驟 3** - 接下來，您將看到如下所示的最新頁面更新的詳細資訊。

此部分允許您瞭解有關 Grav 站點中最新修改的頁面內容的更多資訊。接下來，每次重新整理頁面時，它都會為您生成最近更新的列表。

您可以點選列表中頁面的**標題**；這將引導您跳轉到管理部分的頁面編輯器。

**管理頁面**按鈕將引導您跳轉到管理面板的頁面。

Grav - 配置系統

在本節中，我們將學習 Grav 管理面板中的**配置系統**。您可以使用配置頁面直接配置站點系統的設定。此外，您將看到伺服器屬性的簡要說明，包括 PHP、伺服器環境以及其他幾個元件，這些元件會調節站點的效能。

“系統”選項卡允許您修改** /user/config/system.yaml** 檔案中的設定。這會影響 Grav 操作的許多主要系統相關功能。設定可以分為不同的部分，向您顯示 Grav 效能的不同功能。

以下是系統選項卡中顯示的**配置部分**的詳細列表：

內容

在本節中，您可以修復站點的**內容**處理的基本屬性，如下所示。

• **主頁** - 指定要為您的站點顯示的主頁。

• **預設主題** - 顯示站點的預設主題。

• **處理** - 控制頁面的處理方式。可以按頁面設定，而不是全域性設定。

• **時區** - 設定伺服器中的預設時區。

• **短日期格式** - 顯示短日期格式。

• **長日期格式** - 顯示長日期格式。

• **預設排序** - 使用此順序在列表中顯示頁面。

• **預設排序方向** - 指定列表中頁面的方向。

• **預設頁面計數** - 定義列表中的最大預設頁面計數。

• **基於日期的釋出** - 它會根據日期自動釋出文章。

• **事件** - 它指定啟用或停用事件。停用將損壞外掛。

• **重定向預設路由** - 它定義預設路由並自動重定向到頁面。

語言

您可以在此區域設定**多語言功能**，如下所示。

• **支援的語言** - 它指定用逗號分隔的兩個字母的語言程式碼列表，例如：en、fr、de。

• **啟用翻譯** - 在 Grav、外掛和擴充套件中啟用翻譯。

• **翻譯回退** - 如果不存在活動語言，它指定替代支援的翻譯。

• **部分中的活動語言** - 您可以在該區域儲存活動語言。

• **主頁重定向包含語言** - 根據需要，它在主頁重定向(/en)中包含語言。

• **主頁重定向包含路由** - 它指定重定向管理員主頁根目錄。

• **從瀏覽器設定語言** - 它指定瀏覽器的語言。

• **覆蓋區域設定** - 它指定覆蓋區域設定。

HTTP 標頭

此部分用於設定**HTTP 標頭**選項。此設定有助於基於瀏覽器的快取和最佳化。

• **過期時間** - 定義過期時間並以秒為單位設定值。

• **上次修改時間** - 設定上次修改標頭，這有助於最佳化代理和瀏覽器快取。

• **ETag** - 定義**e 標記標頭**以識別已修改的頁面。

• **Vary Accept Encoding** - 您應將 Vary: HTTP 標頭排列為 Accept。這將有利於代理上的快取。

Markdown

在本節中，我們將學習 Grav 如何管理**Markdown**及其功能以啟用 Markdown Extra。它幫助使用者並構成 Grav 頁面內容的大部分。

• **Markdown Extra** - 它指定對 Markdown Extra 的預設支援。

• **自動換行** - 它指定 Markdown 中的換行符。

• **自動 URL 連結** - 它指定將 URL 轉換為 HTML 超連結。

• **轉義標記** - 它指定將標記標籤轉換為 HTML 物件。

快取

在本節中，您可以配置站點的快取功能。Grav 結合了快取功能，幫助為使用者構建最快的平面檔案 CMS 選項。

• **快取** - 這指定全域性切換**開啟/關閉**以**啟用/停用** Grav 快取。

• **快取檢查方法** - 這定義了檔案、資料夾和無的快取檢查方法。

• **快取驅動程式** - 這指定為使用者選擇快取驅動程式。 *自動檢測* 快取驅動程式被認為是最佳的。

• **快取字首** - 這指定 Grav 金鑰一部分的識別符號。僅在需要時才更改它，否則不要更改它。

• **生存期** - 這定義了快取生存期（以秒為單位），**0=無限**。

• **Gzip 壓縮** - 為提高效能，啟用 Grav 頁面的 Gzip 壓縮。

Twig 模板

在本節中，Grav 突出顯示其**Twig 模板**功能。您可以在此處配置 Twig 快取、除錯和修改跟蹤設定。

• **Twig 快取** - 這指定控制 Twig 快取系統。啟用時效能最佳。

• **Twig 除錯** - 這定義了不載入 Twig 偵錯程式擴充套件的選項。

• **檢測更改** - 對 Twig 模板所做的任何更改都將自動重新編譯 Twig 快取。

• **自動轉義變數** - 所有變數都會**自動轉義**；這可能會損壞您的站點。

資源

此部分用於處理資源，包括 CSS 和 JavaScript 資源，如下所示。

• **CSS 管道** - 將多個 CSS 資源整合到單個檔案中。

• **CSS 壓縮** - 在管道處理過程中，CSS 會被壓縮。

• **CSS 壓縮 Windows 覆蓋** - 預設情況下設定為 False，它定義 Windows 平臺的壓縮覆蓋。

• **CSS 重寫** - 在管道處理過程中重寫 CSS 相對 URL。

• **JavaScript 管道** - 將多個 JavaScript 資源整合到單個檔案中。

• **JavaScript 壓縮** - 在管道處理過程中，JS 會被壓縮。

• **啟用資源上的時間戳** - 啟用資源上的時間戳。

• **集合** - 資源集合被單獨新增。

錯誤處理程式

在站點開發期間，此部分對於管理 Grav 錯誤報告非常有用。

• **顯示錯誤** - 顯示完整的回溯式錯誤頁面。

• **記錄錯誤** - 錯誤日誌將顯示到** /logs** 資料夾中。

Debugger

這類似於錯誤處理，除錯工具整合在 Grav 中以查詢和排除錯誤。

• **偵錯程式** - 啟用偵錯程式及其設定。

• **除錯 Twig** - 啟用 Twig 模板偵錯程式。

• **關閉連線** - 在呼叫**onShutdown()**之前，需要關閉連線。

媒體

此部分用於管理 Grav 的**媒體**內容。您可以在此處配置影像質量、檔案上傳大小和許多媒體處理選項。

• **預設影像質量** - 在快取或重新取樣影像時使用預設影像質量。

• 快取所有圖片 − 所有圖片都將透過 Grav 的快取系統處理，即使不包含媒體操作。

• 圖片除錯水印 − 您可以在顯示影像疊加層的同時指示影像的畫素深度，例如，處理視網膜屏。

• 檔案上傳限制 − 定義最大上傳大小（以位元組為單位）（0 為無限大）。

• 啟用媒體時間戳 − 根據最後修改日期為每個媒體專案新增時間戳。

會話

以下功能可幫助您啟用會話支援。

• 啟用 − 指定 Grav 中的會話支援。

• 超時 − 指定會話超時時間（以秒為單位）。

• 名稱 − 指定會話cookie的名稱，由識別符號開發和應用。

高階

在本節中，您將看到高階系統選項。

• 絕對 URL − 指定base_url的絕對或相對 URL。

• 引數分隔符 − 您可以在引數分隔符的幫助下更改 Windows 上的 Apache。

Grav - 站點配置

本章將學習如何在 Grav 的管理面板中配置站點。您可以直接使用“配置”頁面配置站點系統的設定。“站點”選項卡允許您修改/user/config/system.yaml 檔案中的設定。此選項卡允許您修改影響站點相關功能（例如站點名稱、預設作者等）的選項和欄位。

以下是您在“站點”選項卡中可以看到的不同配置設定。

預設

在此區域，您可以設定基本屬性來管理站點的內容。在這裡，您可以設定多個內容顯示選項，例如主頁、預設主題等等。

• 站點標題 − 指定站點的標題。

• 預設作者 − 指定在主題或頁面內容中使用的預設作者姓名。

• 預設郵箱 − 指定主題或頁面中的預設電子郵件地址。

• 分類法型別 − 指定您在頁面中使用的分類法型別。

頁面摘要

頁面摘要能夠向您展示頁面內容的小預覽。您可以使用分隔符定義頁面中摘要內容的“截止”點。

• 啟用 − 指定是否啟用頁面摘要。

• 摘要大小 − 定義用作頁面內容摘要的字元數。

• 格式 − 短使用分隔符的第一次出現，長忽略摘要分隔符。

• 分隔符 − 指定摘要分隔符。預設值為“===”。您可以在頁面摘要中使用它，並在段落開頭之後新增它。

元資料

元資料在頁面中起著重要作用，並可以改善您的搜尋引擎最佳化 (SEO)。您可以在此處設定多個元資料屬性，以便您的連結可以根據需求出現在多個搜尋引擎和社交媒體資訊流中。

這指定了預設的元資料值，稍後您可以進行修改。

重定向和路由

這允許您設定到站點的其他頁面的重定向和路由。

• 自定義重定向 − 定義指向其他頁面的路由。標準正則表示式的替換是有效的。

• 自定義路由 − 指向其他頁面的別名路由。標準正則表示式的替換是有效的。

Grav - 管理面板頁面

本章將瞭解 Grav 中的管理面板頁面的工作原理。頁面提供了一種輕鬆建立、編輯或刪除站點內容的方法。在管理面板頁面中，您可以檢視為您的站點建立的頁面列表，還可以為您的站點建立新的模組化或非模組化頁面。

新增新頁面

您會看到在頁面管理面板頂部有三個按鈕，如下面的螢幕截圖所示。

• 返回 − 返回管理頁面的儀表板。

• 新增頁面 − 建立新的非模組化內容。

• 新增模組 − 建立新的模組化內容。

新增頁面

它為您的站點建立非模組化頁面，其中包含各種欄位，例如標題、資料夾名稱、父根等。

單擊新增頁面按鈕後，將出現一個彈出視窗，如下所示：

它包含以下欄位：

• 頁面標題 − 在此處輸入頁面的標題。

• 資料夾名稱 − 用於輸入頁面的資料夾名稱，或者在您輸入標題後會自動生成名稱。

• 父頁面 − 為您新建立的頁面設定父頁面。

• 頁面檔案 − 將選定的主題模板顯示到頁面。

• 可見 − 透過將其設定為自動、是或否，使頁面在導航欄中可見。

在欄位中填寫所有資訊後，單擊繼續按鈕。它將重定向您到頁面編輯器。

新增模組化頁面

模組化頁面能夠從其子頁面建立單個頁面。它能夠從模組化內容頁面構建複雜的單頁面佈局。

單擊新增模組按鈕後，將出現一個彈出視窗，如下所示：

視窗包含以下欄位：

• 頁面標題 − 在此處輸入模組化頁面的標題。

• 資料夾名稱 − 用於輸入頁面的資料夾名稱，或者在您輸入標題後會自動生成名稱。

• 頁面 − 為您新建立的模組化子頁面設定父頁面。

• 模組化模板 − 選擇要為模組化頁面顯示的特定模板。

在欄位中填寫所有資訊後，單擊繼續按鈕。它將重定向您到頁面編輯器。

頁面列表

此列表顯示為站點建立的頁面。

在這裡，您可以輕鬆訪問您建立的頁面並進行編輯。

• 單擊任何頁面的標題，它將重定向您到頁面編輯器進行編輯。

• 頁面右側的 X 圖示用於刪除頁面。

• 過濾器框用於查詢您要搜尋的頁面。它根據型別過濾頁面，以便僅顯示模組化、可見和/或可路由的頁面。

• 搜尋框用於在您知道頁面確切名稱時查詢頁面。

• 當您直接將滑鼠懸停在頁面左側的圖示上時，它將顯示當前狀態，即頁面 . 可路由 . 可見 . 已釋出，這意味著該頁面可以透過 URL 檢視，並將顯示在導航選單中。

單擊列表中顯示的頁面後，您將看到以下螢幕。

在上面的螢幕中，您可以選擇編輯頁面、新增內容或向頁面新增影像。“選項”選項卡包含釋出、分類法和站點地圖選項，我們將在頁面編輯器選項章節中學習。“高階”選項卡包含頁面的高階選項，例如設定、排序和覆蓋，這些將在頁面編輯器高階章節中介紹。

Grav - 頁面編輯器選項

本章將學習 Grav 管理面板中的頁面編輯器選項。這是一個動態文字編輯器，允許您建立頁面內容。此外，您還可以向頁面新增媒體檔案。您可以看到下面顯示的選項選項卡的功能。

選項選項卡包含兩個部分：

• 釋出
• 分類法

釋出

此部分用於設定釋出和取消釋出頁面的日期和時間。您可以完全控制要釋出或取消釋出的內容，並且可以為特定頁面建立元資料值。

釋出部分包含以下欄位：

• 已釋出 − 預設情況下，頁面設定為是，即已釋出。透過選擇否，您可以取消釋出頁面。

• 日期 − 設定頁面的日期和時間。

• 釋出時間 − 設定自動釋出頁面的日期和時間。

• 取消釋出時間 − 設定自動取消釋出頁面的日期和時間。

• 元資料 − 設定將在所有頁面上顯示的元資料值。

分類法

在此部分，您可以顯示頁面上的類別並配置頁面及其結構屬性。

分類法部分包含以下欄位。

• 類別 − 設定頁面的類別。它有助於對內容進行排序和過濾。

• 標籤 − 提供有關頁面內容的資訊。它有助於組織和過濾內容。

Grav - 頁面編輯器高階選項

頁面編輯器是一個文字編輯器，也管理頁面；這允許您建立內容，包括媒體檔案、釋出和分類法選項、設定和主題特定選項。以下螢幕截圖顯示了編輯器頁面的“高階”選項卡。

“高階”選項卡包含三個部分：

• 設定

• 排序

• 覆蓋

設定

設定部分處理頁面的各種選項。在這裡，您可以設定頁面的模板，設定頁面的父頁面，更改頁面所在的資料夾名稱。

設定部分包含以下欄位：

• 資料夾數字字首 − 設定數字以提供手動排序。

• 資料夾名稱 − 輸入頁面所在的資料夾名稱。

• 父級 − 為您的頁面設定根目錄，或者一些頁面顯示為子頁面。

• 頁面檔案 − 將主題模板設定為要顯示的頁面。

• 主體類 − 輸入應用於頁面主體的類名。

排序

此部分用於按特定順序設定非編號資料夾。

按住四叉箭頭並將其移動到所需位置以重新排列頁面的特定順序。

覆蓋

覆蓋選項為頁面提供額外功能，例如快取、導航可見性、將slug設定為與基於資料夾名稱設定的預設slug不同的值。

覆蓋部分包含以下欄位。

• 選單 − 設定用作選單的名稱。如果沒有設定，則將使用標題。

• Slug − 可以透過此 slug 變數設定頁面的 URL 部分。

• 頁面重定向 − 設定頁面 URL 以將其重定向到不同的 URL。

• 處理 − 您希望在頁面內容中使用的處理。

• 預設子型別 − 為子頁面設定頁面型別為預設。

• 可路由 (Routable) − 設定頁面以檢查其是否可以透過 URL 訪問。

• 快取 (Caching) − 設定頁面的快取。

• 可見性 (Visible) − 指定頁面是否在導航中可見。

• 顯示模板 (Display Template) − 為要顯示的頁面設定模板。

Grav - 藍圖

藍圖 (Blueprints) 是關於資源（資訊來源）的元資料資訊。它有兩個用途：

• 首先是資源標識本身。
• 其次是關於表單。

這些完整的資訊儲存在每個外掛或主題中存在的blueprints.yaml檔案中。

資源標識 (Resource Identity)

在blueprints.yaml檔案中，為每個主題和外掛定義了標識。除非藍圖完美格式化和編譯，否則資源不會新增到 Grav 儲存庫中。

藍圖示例 (Blueprints Example)

name: plugin name
version: 0.6.0
description: Adds an advanced plugin to manage your site
icon: empire
author:
   name: Team Grav
   email: devs@getGrav.org
   url: http://getGrav.org
homepage: https://github.com/getGrav/Grav-plugin-assets
keywords: assets, plugin, manager, panel
bugs: https://github.com/getGrav/Grav-plugin-assets/issues
readme: https://github.com/getGrav/Grav-plugin-assets/blob/develop/README.md
license: MIT

dependencies:
   - form
   - email
   - login

form:
   validation: loose
   fields:
      Basics:
         type: section
         title: Basics
         underline: false
      enabled:
         type: hidden
         label: Plugin status
         highlight: 1
         default: 0
         options:
            1: Enabled
            0: Disabled
         validate:
            type: bool

以下一些屬性是可選的，有些用於提供您的標識和資源。

以下是登入外掛藍圖示例：

name: Login
version: 0.3.3
description: Enables user authentication and login screen.
icon: sign-in
author:
   name: Team Grav
   email: devs@getGrav.org
   url: http://getGrav.org
keywords: admin, plugin, login
homepage: https://github.com/getGrav/Grav-plugin-login
keywords: login, authentication, admin, security
bugs: https://github.com/Getgrav/Grav-plugin-login/issues
license: MIT

表單 (Forms)

如果您希望主題或外掛可以直接從管理介面配置選項，則可以使用表單填充blueprints.yaml檔案。此資源的一部分可以透過管理外掛 (Admin Plugin) 配置，該外掛由表單 (Forms) 元資料定義。

以下是 Archives 外掛的archives.yaml檔案示例。

enabled: true
built_in_css: true
date_display_format: 'F Y'
show_count: true
limit: 12
order:
   by: date
   dir: desc
filter_combinator: and
filters:
   category: blog

這些是外掛的預設設定。要無需使用管理外掛即可配置它們，使用者必須將此檔案複製到/user/config/plugins/archives.yaml資料夾並進行更改。您可以正確提供archives.yaml檔案；您可以選擇從使用者介面更改管理介面中的設定。

儲存更改後，它將自動寫入<your_folder_name>/user/config/plugins/archives.yaml。

Archives 外掛的blueprint.yaml檔案包含如下所示的結構：

name: Archives
version: 1.3.0
description: The **Archives** plugin creates links for pages grouped by month/year
icon: university
author:
   name: Team Grav
   email: devs@getGrav.org
   url: http://getGrav.org
homepage: https://github.com/getGrav/Grav-plugin-archives
demo: http://demo.getGrav.org/blog-skeleton
keywords: archives, plugin, blog, month, year, date, navigation, history
bugs: https://github.com/getGrav/Grav-plugin-archives/issues
license: MIT

form:
   validation: strict
   fields:
      enabled:
         type: toggle
         label: Plugin status
         highlight: 1
         default: 1
         options:
            1: Enabled
            0: Disabled
         validate:
            type: bool

      date_display_format:
         type: select
         size: medium
         classes: fancy
         label: Date Format
         default: 'jS M Y'
         options:
            'F jS Y': "January 1st 2014"
            'l jS of F': "Monday 1st of January"
            'D, m M Y': "Mon, 01 Jan 2014"
            'd-m-y': "01-01-14"
            'jS M Y': "10th Feb 2014"

      limit:
         type: text
         size: x-small
         label: Count Limit
         validate:
            type: number
            min: 1

      order.dir:
         type: toggle
         label: Order Direction
         highlight: asc
         default: desc
         options:
            asc: Ascending
            desc: Descending

以下是archive.yaml中存在的表單元素。

開關 (Toggle)

enabled:
   type: toggle
   label: Plugin status
   highlight: 1
   default: 1
   options:
      1: Enabled
      0: Disabled
   validate:
      type: bool

選擇 (Select)

date_display_format:
   type: select
   size: medium
   classes: fancy
   label: Date Format
   default: 'jS M Y'
   options:
      'F jS Y': "January 1st 2014"
      'l jS of F': "Monday 1st of January"
      'D, m M Y': "Mon, 01 Jan 2014"
      'd-m-y': "01-01-14"
      'jS M Y': "10th Feb 2014"

文字 (Text)

limit:
   type: text
   size: x-small
   label: Count Limit
   validate:
      type: number
      min: 1

根元素Enabled、date_display_format和limit是選項。此根元素中存在的欄位決定了型別、大小、標籤、預設值和選項。根據欄位型別，其他欄位可能會改變；例如，選擇欄位需要選項列表。

排序方向 (Order direction)

order.dir:
   type: toggle
   label: Order Direction
   highlight: asc
   default: desc
   options:
      asc: Ascending
      desc: Descending

此欄位包含巢狀選項。在plugins/admin/themes/Grav/templates/forms/fields中可以使用許多欄位型別。正如我們在archive.yaml檔案中看到的，表單驗證設定為嚴格模式。當驗證設定為嚴格模式時，您必須為所有選項新增藍圖表單，否則在儲存時會彈出錯誤。當您只想自定義兩個欄位到管理介面時，可以將form.validation設定為寬鬆模式。

下表簡要解釋了與上述表單元素相關的欄位。

管理介面中可用的表單欄位 (Form Fields available in the admin)

有很多內建的表單欄位可供外掛和主題使用，也可以建立自己的表單欄位。下表列出了可用的表單欄位：

常用表單欄位 (Common form fields)

特殊表單欄位 (Special form fields)

Grav - 效能和快取

在本章中，我們將瞭解 Grav 中效能和快取的概念。

效能 (Performance)

效能是指系統性能，例如它是否可以處理系統上的較高負載以及修改系統以處理較高負載。

考慮以下與 Grav 效能相關的幾點：

• 為了獲得更好的 Grav 效能，您可以使用 PHP opcache 和 usercache。opcache 與 PHP 5.4 配合良好，usercache 與 PHP 5.5、PHP 5.6 和 Zend opcache 配合得更快。

• SSD（固態硬碟）使用快閃記憶體，沒有移動部件。有時快取將儲存在使用者快取中或儲存為檔案。因此，SSD 硬碟可以提供更好的效能。

• 虛擬機器是在雲計算技術下託管提供商的最佳方式。您可以指定資源而無需與物理裝置互動。原生託管 (Native hosting) 比虛擬機器更快。Grav 在虛擬機器上執行得更好，但為了獲得最佳效能，您可以使用原生託管選項。

• Grav 具有更快的記憶體，其中其快取使用大量記憶體，可在您的伺服器上提供更好的效能。與其他平臺相比，它使用的記憶體更少。

• Grav 在共享伺服器上使用共享託管 (shared hosting) 來共享資源。共享託管成本低廉，有時可能會導致伺服器上的速度變慢。

• 多核處理器用於更快地處理多個任務。高階處理器比這些處理器更好，可以幫助使用者完成任務。

快取

通常，快取是儲存在快取記憶體中的資料。快取機制使 Grav 更快，瀏覽器可以從快取中獲取檔案而不是原始伺服器，從而節省時間和額外的網路流量。

Grav 使用 Doctrine Cache 庫，它支援以下內容：

• 自動 (Auto)（預設）− 它自動使用預設選項。

• 檔案 (File) − 它指定cache/資料夾中存在的快取檔案。

• APC

• XCache

• Memcache

• Redis

• WinCache

預設情況下，Grav 使用自動設定。它將首先嚐試 APC，然後嘗試 WinCache、XCache，最後使用檔案。

快取型別 (Caching Types)

有 5 種類型的快取：

• 將 YAML 配置快取到 PHP 中。

• 頁面物件的 Grav 核心快取。

• 將模板檔案作為 PHP 類進行 Twig 快取。

• 媒體資源的影像快取。

• 使用管道處理 CSS 和 jQuery 的資產快取。

儲存在/cache資料夾中的 YAML 配置的快取。影像快取將其影像儲存在/images資料夾中。Grav 核心快取的配置選項儲存在user/config/system.yml檔案中，如下所示：

cache:
   enabled: true
   check:
      method: file
   driver: auto
   prefix: 'g'

• enabled選項透過將其設定為 true 來啟用快取。

• method選項檢查頁面（例如檔案或資料夾）中的更新。

• driver選項指定不同型別的快取選項，例如 Auto、File、APC、XCache、Memcache、Redis 或 WinCache。

• prefix選項定義快取字首字串。

Memcache 選項 (Memcache Options)

如果您使用的是memcached 伺服器，則需要透過在user/config/system.yml 檔案中使用memcache驅動程式新增一些額外的配置選項。這些選項可以在cache:組下定義。

cache:
...
...
   memcache:
      server:localhost
      port: 8080

Redis 選項 (Redis Options)

如果您使用的是redis，則需要透過在user/config/system.yml 檔案中使用redis驅動程式新增一些額外的配置選項。這些選項可以在cache:組下定義。

cache:
...
...
   redis:
   	server:localhost
      port: 8080

Twig 模板透過在user/config/system.yml檔案中使用 twig 驅動程式使用其自身的快取機制。

twig:
   cache: true
   debug: true
   auto_reload: true
   autoescape: false

它有一些選項，例如：

• cache選項透過將其設定為 true 來啟用 twig 快取。

• debug選項啟用 twig 除錯。

• auto_reload選項用於透過將其設定為 true 來重新載入更改。

• autoescape 選項用於自動轉義 Twig 變數。

快取和事件

啟用快取後可以使用事件。除OnPageContentRaw、OnPageProcessed、OnPageContentProcessed、OnTwigPageVariables 和 OnFolderProcessed 事件外，所有事件都可以啟用快取。這些事件可用於所有頁面和資料夾，並且只能在事件處理時執行。這些事件無法在頁面快取後執行。

Grav - 除錯和日誌

在開發主題和外掛時，除錯和日誌資訊非常必要。Grav 使用如下所述的一些功能來使用除錯資訊。

PHP 除錯欄

Grav 帶有一個名為除錯欄的工具來顯示除錯資訊。預設情況下，此功能處於停用狀態。您可以全域性啟用它，也可以使用system.yaml檔案在開發環境中啟用。

debugger:
   enabled: true
   twig: true
   shutdown:
      close_connection: true

啟用偵錯程式設定為true後，您可以檢視如下所示的除錯欄。單擊位於左上角的 G 符號。

在除錯欄中，您可以檢視右上角的整體記憶體使用情況和處理時間。它還包含多個選項卡，提供詳細資訊。

在“訊息”選項卡中，您可以檢視有助於除錯 Grav 開發過程的訊息，這些資訊將透過$Grav['debugger']→addMessage($my_var)從程式碼釋出到此選項卡。

在“時間線”選項卡中，您可以檢視 Grav 定時的細分。

錯誤顯示

它顯示執行時有關塊或頁面的錯誤訊息。在 Grav 中，您可以輕鬆識別錯誤並快速解決錯誤。以下是將在螢幕上顯示的錯誤訊息，如下面的螢幕截圖所示。

在user/config/system.yaml檔案中，您可以透過將其設定為 false 來停用錯誤頁面。

errors:
   display: false
   log: true

日誌記錄

日誌記錄用於報告來自庫和應用程式的錯誤和狀態資訊。在 Grav 中，有一些重要的日誌記錄功能，如下所述。

$Grav['log']->info('My informational message');
$Grav['log']->notice('My notice message');
$Grav['log']->debug('My debug message');
$Grav['log']->warning('My warning message');
$Grav['log']->error('My error message');
$Grav['log']->critical('My critical message');
$Grav['log']->alert('My alert message');
$Grav['log']->emergency('Emergency, emergency, there is an emergency here!');

所有日誌訊息都將顯示在Grav.log檔案中，該檔案位於<your_folder_name>/logs/Grav.log資料夾下。

Grav - 命令列介面 (CLI)

在本章中，我們將瞭解 CLI 在 Grav 中的工作方式。CLI 代表命令列介面，儲存在bin/Grav中。它執行一些任務，例如清除快取、建立備份副本等。

在不同平臺上訪問 CLI 的方式不同。在 Windows 上，您可以透過cmd訪問；在 Mac 上，您可以透過Terminal訪問；在 Linux 上，您可以使用 shell。在 Windows 上，您無法使用 UNIX 風格的命令。要使用這些命令，只需安裝msysgit包，它提供 GIT 和 GIT BASH，並在 Windows 上提供 UNIX 風格的命令。

您可以使用以下命令列出 Grav 中可用的命令：

$ bin/Grav list

您可以看到如下螢幕截圖中顯示的可用命令：

建立新專案

使用 Grav 建立新專案非常簡單。您可以使用 Grav 例項建立一個新專案。

• 開啟您的終端或控制檯，並導航到您的 Grav 資料夾。

$ cd ../ProjectFolder/grav

• 您的 Grav 將安裝在 Web 伺服器的根目錄中。如果您想在 Grav 的根資料夾中建立一個名為 contact 的資料夾，則使用以下命令：

$ bin/Grav  project-name  ../webroot/ contact

它將下載所有必需的依賴項並建立一個新的 Grav 例項。

安裝 Grav 依賴項

在安裝依賴項時，Grav 會自動安裝名為error外掛、problems外掛和antimatter主題的外掛。您可以使用終端或控制檯中的以下命令安裝這些外掛：

$ cd ../webroot/myproject
$ bin/Grav install

您現在將在各自的資料夾中看到下載的外掛，如下所示：

• ../webroot/ myproject/user/plugins/error

• ../webroot/ myproject/user/plugins/problems

• ../webroot/ myproject/user/themes/antimatter

清除 Grav 快取

您可以刪除儲存在cache/資料夾中的檔案和資料夾以清除快取。要清除快取，您可以使用以下命令：

$ cd ../webroot/myproject
$ bin/Grav clear-cache

建立備份

在 Grav 中，您可以備份儲存在根資料夾下的專案。因為它不使用資料庫，所以備份沒有難度。如果您想建立名為 myproject（../webroot/myproject）的專案的備份，請使用以下命令：

$ cd ../webroot/myproject
$ bin/Grav backup

您將在backup/資料夾下看到建立的備份 zip 檔案。

更新 Composer

您可以更新透過 Github 安裝並使用基於 composer 的供應商包手動安裝的 Grav composer。命令是：

$ bin/Grav composer

Grav - GPM (Grav 包管理器)

GPM 代表 Grav 包管理器，用於安裝、更新、解除安裝和列出 Grav 儲存庫中可用的外掛。GPM 使用命令列介面（如終端或 cmd）執行命令。

您可以非常輕鬆地訪問 CLI。在 Windows 上，您可以透過cmd訪問；在 Mac 上，您可以透過Terminal訪問；在 Linux 上，您可以使用shell。在 Windows 上，您無法使用 UNIX 風格的命令。要使用這些命令，只需安裝msysgit包，它提供 GIT 和 GIT BASH，並在 Windows 上提供 UNIX 風格的命令。

要列出 Grav 儲存庫中可用的命令，請鍵入以下命令：

$ bin/gpm list

您將收到以下資訊：

您可以透過在命令列新增 help 來獲取幫助，如下所示：

$ bin/gpm help install

您可以使用以下命令在命令列介面上查詢 PHP 的版本：

$ php -v

它是如何工作的？

當您在命令列介面上執行命令時，GPM 會自動從GetGrav.org站點下載所需資料。它包括所有可用包的詳細資訊，並確定需要安裝哪些包以及需要更新哪些包。

當您從儲存庫下載包時，Grav 儲存庫會在本地快取，快取生成後，將無法聯絡GetGrav.org伺服器。

某些命令帶有--force (-f)選項，該選項強制重新獲取儲存庫。使用此選項，無需等待 24 小時週期才能清除快取。

命令

您可以使用一些命令從 Grav 儲存庫下載可用的包。要使用該命令，請開啟您的終端並導航到 Grav 資料夾的根目錄，然後鍵入bin/gpm <command>。

索引

index 命令用於列出 Grav 儲存庫中可用的外掛和主題。在您的終端中使用以下命令列出可用的資源。

$ bin/gpm index

每一行都定義了外掛或主題的名稱、slug、版本，並顯示它是否已安裝。

資訊

info 命令用於顯示有關包的資訊，例如作者、版本、上次更新的日期和時間、包的儲存庫、包的下載連結、許可證資訊等。

安裝

顧名思義，install 命令從 Grav 儲存庫安裝包所需的資源。

您可以使用以下命令安裝所需的包。

$ bin/gpm install package_name

如果您嘗試安裝已安裝的包，它會告知您下一步該怎麼做。

如果您鍵入Y，它將覆蓋已安裝的包；如果您鍵入N，它將中止安裝過程。

更新

update 命令會告知需要更新的包。如果所有包都是最新的，它將顯示無需更新。

$ bin/gpm update

自我升級

self-upgrade 命令用於將 Grav 升級到最新版本。使用以下命令升級 Grav。

$ bin/gpm self-upgrade

如果您使用的是最新版本的 Grav，它將顯示一條訊息，提示“您已經在執行 Grav 的最新版本”，以及釋出日期和時間，如下面的螢幕截圖所示。

Grav - 開發

您可以使用不同的開發型別構建 Grav，例如Grav Core、Grav 外掛、Grav 骨架和Grav 主題。

Grav Core

Grav 是一款現代化的 CMS，在其中編寫內容很簡單，構建頁面更友好、更直觀。Grav core 特別談到了控制 Grav 所有內容的系統資料夾，它代表了 Grav 工作流和生命週期的特性。它主要關注可以以良好方式編寫的頁面。它關注您的內容，並將您的內容轉換為可導航的網站。

Grav 外掛

外掛是一段軟體，它提供了 Grav 核心功能最初未完成的增強功能。Grav 儲存庫中提供了許多外掛，這些外掛顯示了網站上的功能。

考慮以下與 Grav 外掛相關的幾點：

• Grav 本身是超級精簡的，它只為您的網站新增必要的外掛。

• 無需等待新增您想要的功能。要實現這一點，只需建立一個外掛來擴充套件 Grav。

• 外掛非常靈活和強大，可以顯示站點地圖、部落格存檔、搜尋引擎，提供麵包屑等。

Grav 骨架

Grav 骨架描述了一個示例網站，它包含 Grav Core、外掛、頁面、主題等所有內容。Grav 背後的最初想法是使網站的構建非常容易。開發網站所需的一切都放在user資料夾中。Grav 的骨架附帶各種依賴項，例如外掛、主題等，並存儲在一個可以解壓縮的包中。

Grav 主題

Grav 支援不同型別的主題，它們構成了 Grav 網站的組成部分。當您在系統上安裝 Grav 時，它帶有Antimatter主題。大多數主題都帶有骨架包或示例頁面。您可以在user/pages資料夾下看到示例頁面，它提供了與骨架包類似的體驗。

已安裝的主題需要您的頁面具有合適的Twig 模板。主題是主題和內容的組合，等於整個網站設計。您可以根據自己的設計建立自己的 Twig 模板引擎。

主題/外掛釋出流程

您可以注意新增到 Grav 儲存庫中已建立主題或外掛的一些要點。

• 這是一個開源專案，由MIT許可。

• 它有README.md檔案，其中指定了專案的安裝過程和配置。

• 它包含一個**blueprints.yaml**檔案，其中包含資源資訊，可以在每個外掛和主題的根目錄中找到。

• 包含**CHANGELOG.md**檔案，其中包含主題或外掛的版本，並在每次更改檔案時顯示資訊。

• 建立發行版是將已完成的主題或外掛釋出到**GitHub**的更好方法。如果沒有發行版，則找不到您的外掛或主題。

• 新增關於您的外掛或主題的詳細資訊，並進行測試以確保其工作功能。

變更日誌格式

**變更日誌格式**使用Markdown語法編寫，使內容和視覺顯示分離。它使用簡單的CSS，顯示格式如下。

# vX.Y.Z
## 01/01/2015
1. [](#new)
   * New features added
   * Another new feature
2. [](#improved)
   * Improvement made
   * Another improvement
3. [](#bugfix)
   * Bugfix implemented
   * Another bugfix
...repeat...

GitHub 設定

**GitHub** 是一個最大的開放社群，它與使用者共享您的專案，獲取反饋並貢獻託管在 GitHub 上的程式碼庫。

將外部程式碼庫的 URL 克隆到本地系統上的單個專案資料夾中。您可以將外部 Git 程式碼庫克隆到新的程式碼庫，如下面的步驟所示。

開啟命令列並建立一個名為**“my_project”**的資料夾。

$ mkdir my_project
$ cd my_project
$ mkdir Grav
$ cd Grav
$ git clone https://github.com/getGrav/Grav.git
$ git clone https://github.com/Grav_project/Grav-plugin-error.git
$ git clone https://github.com/ Grav_project /Grav-plugin-problems.git
$ git clone https://github.com/ Grav_project /Grav-theme-antimatter.git

這裡**Grav_project**是一個程式碼庫，您將在這裡獲得所有與該程式碼庫相關的檔案和資料夾，這些檔案和資料夾將儲存在** /my_project/Grav** 資料夾中。Grav 包含依賴項，例如**error** 外掛、**problems** 外掛和**Antimatter** 主題。

您可以使用**bin/Grav new-project**命令設定 Grav 的測試站點。我們需要從 Web 根目錄開發克隆的程式碼。因此，我們必須使用**-s**標誌對**bin/Grav new-project**命令進行符號連結相關部分。

在一個名為**.Grav/**的新資料夾中建立一個配置檔案，以便使用該命令查詢程式碼庫，您需要在根目錄下建立它。

$ cd
$ mkdir .Grav
$ vi .Grav/config

導航到您的 Grav 資料夾，並使用**-s**標誌設定符號連結站點。

$ cd ~/Projects/Grav/Grav
$ bin/Grav my-project -s ~/www/Grav

這裡，**www**是根資料夾，**Grav**是您將建立測試站點的目錄。

Grav - 生命週期

在本章中，我們將瞭解 Grav 的生命週期。Grav 生命週期決定了 Grav 的處理方式，以便透過外掛擴充套件 Grav。下圖顯示了 Grav 生命週期過程的流程。

Grav 生命週期中的以下四個步驟：

• PHP 版本

• 載入器類初始化

• 獲取 Grav 例項

• 呼叫 Grav 程序

PHP 版本

它檢查 PHP 的版本，以確保我們執行的 PHP 版本高於 5.4.0。

載入器類初始化

在第二步中，類載入器初始化。

獲取 Grav 例項

• 如果不存在例項，則它呼叫`load()`方法並新增 Grav。

• 它初始化偵錯程式值並新增到偵錯程式。

• 它註冊日誌和錯誤處理程式。

• 它新增 uri、task、events、cache、session、plugins、themes、twig、taxonomy、language、pages、assets 和 base url。

• 它註冊流和配置處理程式。

呼叫 Grav 程序

• 它初始化配置、Uri 物件、錯誤處理程式、偵錯程式和會話。

• 初始化後，它開始緩衝輸出。

• 它初始化時區和外掛，並觸發`onPluginsInitialized`事件。

• 接下來，它初始化主題並觸發`onThemeInitialized`和`onTask[TASK]`事件。

• 它初始化資源並觸發`onAssetsInitialized`事件。

• 它使用以下操作初始化 twig：

  • 根據配置，它設定 twig 模板路徑。

  • 處理可用的語言模板。

  • 接下來，它觸發`onTwigTemplatePaths`事件。

  • 載入程式鏈和 twig 配置已載入。

  • 觸發`onTwigInitialized`事件。

  • 它載入 twig 擴充套件並觸發`onTwigExtensions`事件。

  • 它設定標準的 twig 變數。

• 接下來，它初始化頁面。

  • 它呼叫`buildPages()`方法。

  • 如果快取良好，則它從快取載入頁面。如果快取不好，則呼叫`recurse()`方法。

  • 在`recurse()`方法中觸發`onBuildPagesInitialized`事件。

  • 如果找到`.md`檔案，則執行以下操作：

    • 要載入檔案詳細資訊，將呼叫`init()`方法。

    • 它設定 filePath、modified 和 id。

    • 呼叫`header()`方法初始化 header 變數。

    • 呼叫`slug()`方法設定 URL slug。

    • 呼叫`visible()`方法設定可見狀態。

    • 根據以 _(下劃線) 開頭的資料夾，設定`modularTwig()`。

  • 稍後它將觸發`onPageProcessed`事件。

  • 如果找到資料夾，則遞迴`recurse()`其子項。

  • 它觸發`onFolderProcessed`事件。

  • 呼叫`buildRoutes()`方法。

  • 為所有頁面初始化`taxonomy`

  • 構建`route`表以進行快速查詢。

• 觸發`onPagesInitialized`和`onPageInitialized`事件。

• 將偵錯程式 CSS/JS 新增到資源。

• 使用 Twig 的`processSite()`方法，我們得到輸出。

  • 觸發`onTwigSiteVariables`事件。

  • 獲取頁面的輸出。

  • 如果找不到頁面或頁面不可路由，則觸發`onPageNotFound`事件。

  • 所有 Twig 變數都設定在 twig 物件上。

  • 根據檔案/header/擴充套件資訊設定模板名稱。

  • 呼叫`render()`方法。

  • 返回 HTML 格式的檔案。

• 它觸發`onOutputGenerated`事件。

• 設定 HTTP 頭。

• 顯示輸出

• 輸出緩衝區被重新整理到頁面。

• 將觸發`onOutputRendered`事件。

• 關閉與客戶端的連線。

• 最後，它觸發`onShutDown`事件。

當在頁面上呼叫`content()`方法時，將發生以下生命週期。

• 將觸發`onPageContentRaw`事件。

• 根據 Markdown 和 Twig 設定，它處理頁面。

• 它觸發`onPageContentProcessed`事件。

Grav - YAML 語法

**YAML** 代表**YAML Ain't Markup Language**，它包含人類可讀的內容，通常用於配置檔案、藍圖（資源的元資料資訊）和頁面設定。

功能

以下是 YAML 的特性：

• 與 XML 或 JSON 相比，YAML 較不復雜，並提供相同的特性。

• 它提供配置設定，而無需學習複雜的程式碼型別，如 CSS、JavaScript 或 PHP。

• YAML 描述 YAML 檔案的資料和內容，可以輕鬆翻譯成多種語言型別。

YAML 的基本規則

YAML 有些基本規則用於減少多種語言和可編輯程式中的歧義。

• YAML 檔案必須以**.yaml**副檔名結尾。

• YAML 必須區分大小寫。

• YAML 不支援使用製表符。它使用空格代替製表符，而空格並非在所有情況下都受支援。

YAML 的基本資料型別

YAML 支援一些基本資料型別，可以與程式語言一起使用，例如：

• **標量** - 字串或數字。

• **序列** - 陣列或列表。

• **對映** - 雜湊或字典。

標量

標量是基本資料型別，在頁面上使用字串或數字來處理資料。它可以是**布林屬性**(是或否)、**整數值**(例如 2) 或**字串**(例如單詞、句子或網站標題)。

例如：

string: "Grav"
integer: 10
float: 10.5
boolean: true

有時標量帶有未加引號的值，如整數、浮點數或布林值。字串值使用標點符號，帶有單引號或雙引號，使用轉義符來指定 ASCII 和 Unicode 字元。

序列

YAML 以陣列或列表的形式表示序列。它使用列表中開頭的破折號 (-) 定義每個專案，如下所示。

例如：

- Apple
- Orange
- Grapes

假設您想使用子專案定義巢狀序列，然後在子專案中的每個破折號前放置一個空格。

例如：

-
   - Apple
   - Orange
   - Grapes

如果您想要巢狀列表中的巢狀序列，則新增一些級別，如下所示：

例如：

-
   -
      - Apple
      - Orange
      - Grapes

對映

這是一種定義鍵及其值的方法。

例如，您可以為特定元素分配某個值，如下所示：

Sports: cricket

這裡的 value 是“cricket”，它與名為“Sports”的鍵對映。您可以將此對映與序列一起使用來指定板球的專案列表；例如，我們將為 value “cricket” 定義一些玩家姓名，將姓名作為子項，並將**Sports: cricket**作為父項。

Sports: cricket
- Sachin Tendulkar
- Rahul Dravid
- M S Dhoni

Grav - 表單

您可以使用此連結中提供的**form**外掛建立一個表單。搜尋表單外掛並將其安裝到您的 Grav 資料夾中。

您還可以使用命令**$ bin/gpm install Form**安裝此外掛。導航到 Grav 的根資料夾並輸入此命令。它將自動下載表單外掛並安裝必要的依賴項。

建立簡單的表單

您可以建立一個簡單的表單，可以在頁面 YAML 前端定義。以下是一個表單示例：

---
title: Contact Form

form:
   name: contact

   fields:
      - name: name
         label: Name
         placeholder: Enter your name
         autofocus: on
         autocomplete: on
         type: text
         validate:
            required: true

      - name: email
         label: Email
         placeholder: Enter your email address
         type: email
         validate:
            required: true

      - name: message
         label: Message
         placeholder: Enter your message
         type: textarea
         validate:
            required: true

      - name: g-recaptcha-response
         label: Captcha
         type: captcha
         recatpcha_site_key: 6LelOg4TAAAAALAt1CjjjVMxFLKY8rrnednYVbr8
         recaptcha_not_validated: 'Captcha not valid!'
         validate:
            required: true

   buttons:
      - type: submit
         value: Submit
      - type: reset
         value: Reset

   process:
      - email:
         subject: "[Site Contact Form] {{ form.value.name|e }}"
         body: "{% include 'forms/data.html.twig' %}"
      - save:
         fileprefix: contact-
         dateformat: Ymd-His-u
         extension: txt
         body: "{% include 'forms/data.txt.twig' %}"
      - message: Thank you for getting in touch!
      - display: thankyou
---

以上程式碼顯示了一個帶有姓名、電子郵件、訊息和驗證碼欄位的簡單表單頁面。填寫表單後提交資訊時，表單將透過向 YAML 前端新增**process**欄位來進行處理，如程式碼所示。

**process**欄位使用以下資訊：

• **email**選項使用兩個欄位，例如**from**欄位指定電子郵件的發件人，**to**欄位指定郵件的接收者。

• **subject**使用**[feedback][entered mail]**選項，其中電子郵件傳送到輸入的電子郵件。

• 電子郵件的主體在主題資料夾中的**forms/data.html.twig**檔案中指定。

• 表單輸入資料儲存在**user/data**資料夾下。模板在主題資料夾中的**forms/data.txt.twig**檔案中定義。

• 在**thankyou/**子資料夾下建立一個子頁面，當用戶提交表單時，將重定向到該頁面。

您可以使用表單外掛的一些欄位，如下表所示：

欄位引數

每個欄位都接受以下引數，這些引數可用於自定義表單中的外觀。

某些欄位包含特定引數，例如：

關於驗證碼的說明

我們在名為g-recaptcha-response的欄位下有驗證碼資訊的程式碼，如下所示：

- name: g-recaptcha-response
   label: Captcha
   type: captcha
   recatpcha_site_key: 6LelOg4TAAAAALAt1CjjjVMxFLKY8rrnednYVbr8
   recaptcha_not_validated: 'Captcha not valid!'
   validate:
		required: true

reCaptcha 用於保護您的網站免受垃圾郵件和濫用。它使用recatpcha_site_key選項並在您的網站上顯示小部件。要使用 reCaptcha，只需參考reCaptcha 文件。如果 reCaptcha 不正確，則它將使用recaptcha_not_validated選項顯示訊息。

表單操作

電子郵件 (Email)

您可以在process欄位下使用特定選項傳送電子郵件，如下所示：

- email:
	from: "{{ config.plugins.email.from }}"
	to: "{{ config.plugins.email.to }}"
	subject: "Contact by {{ form.value.name|e }}"
	body: "{% include 'forms/data.html.twig' %}"

它使用電子郵件選項，該選項包括兩個欄位；from欄位指定發件人的電子郵件地址，to欄位使用電子郵件外掛配置指定收件人的電子郵件地址。電子郵件欄位還使用subject選項，其中傳送到輸入的電子郵件的主題為“[Contact by][輸入的姓名]”，電子郵件正文在主題的forms/data.html.twig檔案中定義。

重定向到其他頁面

您可以使用process欄位下定義的message和display選項重定向到另一個頁面。

process:
   - message: Thank you for getting in touch!
   - display: thankyou

message選項設定單擊提交按鈕時應顯示的訊息。當用戶提交表單時，它應重定向到另一個頁面。在儲存form.md檔案的thankyou子資料夾下建立一個子頁面。提交表單後，它將重定向到該頁面並顯示上述訊息。

名為thankyou/formdata.md的子頁面將具有以下內容。

---
title: Email sent
cache_enable: false
process:
   twig: true
---

## Your email has been sent!

提交表單後，外掛會向用戶傳送電子郵件，資料將儲存在data/folder下。

儲存

它用於將資料儲存到儲存在user/data資料夾下的檔案中。

例如：

process:
   - save:
      fileprefix: contact-
      dateformat: Ymd-His-u
      extension: txt
      body: "{% include 'forms/data.txt.twig' %}"

資料將以文字格式儲存，副檔名為 txt。正文取自主題的templates/forms/data.html.twig檔案。

以下螢幕顯示了一個簡單的表單：

Grav - 網路託管

託管，也稱為網站託管，是維護和組織網站的過程，並透過全球資訊網提供對網站的訪問。簡單來說，它是在網際網路上為網站提供服務的平臺。

Grav 支援不同型別的託管服務：

• Rochen 網路託管

• WireNine

• Crucial 網路託管

• Arvixe

• SiteGround

• Dreamhost

Rochen 網路託管

它可用於GetGrav.org和RocketTheme.com作為長期託管提供商。它使用 SSD 驅動器、Litespeed Web 伺服器以及 Intel XEON 處理器來增強 Grav 的效能。它提供兩種型別的選項；一個是共享託管，另一個是突發託管。

有關 Rochen 網路託管的更多資訊，請單擊此連結。

WireNine

WireNine 為 665 多個國家的客戶提供可靠的網路託管服務。它使用 Intel Xeon E5 v3 CPU、DDR4 ECC RAM 和冗餘 RAID SSD 儲存來增強伺服器的功能。它提供最大的可靠性和穩定性，以確保 100% 的正常執行時間。它包括最佳化的軟體，例如 CloudLinux、Litespeed、MariaDB、PHP、Ruby、Python、Perl 等。

訪問此連結以獲取有關 WireNine 託管的資訊。

Crucial 網路託管

這是另一種網路託管型別，它更注重速度和支援。它使用 SSD 驅動器、Litespeed Web 伺服器以及 Intel XEON 處理器來增強 Grav 的效能。

您可以在此連結中獲取有關 Crucial 網路託管的更多資訊。

Arvixe

Arvixe 是一種網路託管型別，它以無與倫比的可靠性、質量和經濟性相結合的方式提供網路託管。它因在網路託管領域提供良好的功能而贏得了眾多網路託管獎項。

有關 Arvixe 網路託管的更多資訊，請單擊此連結。

SiteGround

它為 Joomla、WordPress、Magento 和其他 Web 應用程式提供託管解決方案。它的標語是精心打造的網路託管，它精心處理網路託管計劃，並提供使您的網站執行速度更快的全新技術。

只需訪問此連結即可獲取有關 SiteGround 託管的資訊。

Dreamhost

它透過為您的個人或業務相關的網路託管需求提供更多功能來提供一系列功能。它擁有超快的 SSD 和高達 64GB RAM 的全新專用伺服器。

有關 Dreamhost 網路託管的更多資訊，請單擊此連結。

Grav - 伺服器錯誤

伺服器錯誤是由於 Grav 配置錯誤造成的。當伺服器遇到內部錯誤或發生意外情況時，Grav 將無法提供服務並恢復頁面。

如果伺服器在生產模式下執行，為了向用戶隱藏資訊，會發生伺服器錯誤訊息。所有錯誤訊息都記錄在<您的資料夾名稱>/logs/Grav.log資料夾下的Grav.log檔案中。

以下是一些可能導致伺服器錯誤的原因：

• 過時的配置
• 檔案許可權不正確
• 格式錯誤的配置檔案
• Grav 未知的的檔案系統更改

過時的配置

您可以重新整理快取以檢查配置是否為最新。使用以下命令重新整理快取。

bin/Grav clear-cache

安裝和配置問題

安裝和配置問題包括：

• 配置問題
• 安裝問題
• 系統要求
• 檔案許可權

Grav - 許可權

一般來說，許可權是在您的託管環境中允許執行某些操作的過程。許可權包括對伺服器上的檔案的讀取或寫入訪問許可權，或編輯檔案系統上的檔案。Grav 是一個基於平面檔案的 CMS，需要寫入檔案系統才能建立快取和日誌檔案。

Grav 包含三種主要場景：

PHP/Web 伺服器與編輯檔案的使用者使用相同的使用者

此場景非常適合大多數共享託管設定以及本地開發。在專用 Web 主機上，我們不能認為這種方法足夠安全。

PHP/Web 伺服器使用不同的帳戶，但使用相同的組

使用775和664許可權使用使用者和 PHP/Web 伺服器帳戶之間的共享組，您可以確保兩個不同的帳戶將對檔案具有讀/寫訪問許可權。我們可以透過在根目錄上設定umask 0002並設定正確的許可權來建立新檔案。

不同的帳戶，手動修復許可權

這種方法將具有不同的帳戶，並更新檔案的擁有權和許可權，以確保 PHP/Web 伺服器使用者將對檔案具有讀/寫訪問許可權。

以下是permissions-fixing shell 指令碼的簡單程式碼。您可以根據適用於設定的組編輯此檔案。

#!/bin/sh
chown joeblow:staff .
chown -R joeblow:staff *
find . -type f ! -path "./bin/" | xargs chmod 664
find . -type f -path "./bin/" | xargs chmod 775
find . -type d | xargs chmod 775
find . -type d | xargs chmod +s
umask 0002

• chown joeblow:staff用於將目錄的組和使用者更改為 joeblow 和 staff。

• chown -R joeblow:staff *行將檔案和子資料夾的所有權更改為 joeblow 和 staff。

• find . -type f ! -path "./bin/" | xargs chmod 664行將所有檔案的許可權從目錄設定為對其他人讀取，對組和使用者讀取/寫入。

• find . -type f -path "./bin/" | xargs chmod 775行將所有檔案的許可權從目錄設定為對其他人RX，對組和使用者RWX。

• umask 0002用於使用 664 和 775 許可權建立新檔案。