Grav-quick-guide

提供:Dev Guides
移動先:案内検索

Grav-概要

*Grav* は、フラットファイルベースのコンテンツ管理システムです。 このシステムは、コンテンツの保存にデータベースを使用せず、代わりにテキスト(.txt)ファイルまたはマークダウン(.md)ファイルを使用してコンテンツを保存します。 フラットファイル部分は、読み取り可能なテキストを参照し、開発者にとって簡単な方法でコンテンツを簡単に処理します。

Gravは Rocket Theme チームによって開発されました。 PHPで実行され、Joomla、Wordpress、DrupalなどのオープンソースCMSです。

Gravを選ぶ理由

Gravは現在、最速のフラットファイルコンテンツ管理システムです。 Gravを使用すると、コンテンツを簡単に公開および管理できます。 開発者は、コンテンツをデータベースではなくファイル(テキストファイルやマークダウンファイルなど)に保存することで、コンテンツを非常に簡単に処理できます。

Gravは、シンプルで管理しやすく、迅速なサイトの構築を支援します。 データベース駆動型CMSよりも低コストであり、十分なリソースがない場合のファイル処理のI/Oに役立ちます。

Gravの機能

  • これは、高速で簡単かつ強力なフラットファイルWebプラットフォームです。
  • 追加のツールやHTMLの知識なしでWebサイトを構築するために使用されます。
  • テキストファイルまたはマークダウンファイルを使用してコンテンツを保存します。
  • データベースを使用しないため、ボトルネックのインスタンスが軽減されます。
  • Twigが提供するPHPベースのテンプレートを使用します。テンプレートは、PHPに直接解析され、高速になります。

利点

  • データベースCMSに基づいていないため、インストールは非常に簡単で、ファイルをサーバーにアップロードするときにすぐに使用できます。
  • 物事を簡単にするために、Markdownテキストファイルを使用します。 これを使用して、コンテンツは動的にHTMLに変換され、ブラウザーに表示されます。
  • セキュリティの場合、Gravには管理領域とデータベースがありません。 そのため、重要なデータにアクセスするために、アカウントまたはデータベースをハッキングする可能性はありません。
  • バックアップするデータベースがないため、すべてのファイルを簡単にバックアップして、Webサイトのバックアップコピーを保持できます。
  • これは、学習するのにこれ以上の時間を必要としないソフトウェアです。

デメリット

  • ファイル用のデータベースがないため、無許可のユーザーがファイルからコンテンツに直接アクセスする可能性があります。
  • Grav CMSを使用して複雑なWebサイトを構築することは困難です。

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以降

テキストエディター

  • 崇高なテキスト(Mac/Windows/Linux)
  • Atom(Mac/Windows)
  • メモ帳++(Windows)
  • Bluefish(Mac/Windows/Linux)

Gravをダウンロード

このリンクhttps://getgrav.org/downloadsをクリックし、以下のスクリーンショットに示されている手順に従ってGravをダウンロードします。

Grav Installation

ダウンロードしたGravファイルをWebサーバーに解凍します。

セットアップウィザード

Gravのインストールは非常に簡単なプロセスです。 Gravのセットアップについては、以下の手順に従ってください。

  • zipファイルをダウンロードして、Webサーバーまたはローカルホストに解凍します。 サイトの参照に使用する現在の名前からフォルダーの名前を変更します。
  • ブラウザーを開いて localhost/<your_folder_name> に移動すると、次のスクリーンショットのように* Gravが正常にインストールされました*を示す画面にリダイレクトされます。

Grav Installation

  • Gravには、開始に役立つサンプルページが付属しています。 上記のスクリーンショットでは、サンプルページを表示しているホームリンクを確認できます。

Grav-ページ

この章では、 Grav Pages について学習します。 ページは、サイトの構成要素として定義できます。 ページはコンテンツとナビゲーションを組み合わせます。これにより、経験の浅いユーザーでも作業が簡単になります。

まず、簡単なページの作成方法をお知らせください。 すべてのユーザーコンテンツは user/pages/ フォルダーに保存されます。 01.home というフォルダーが1つだけあります。 フォルダーの数値部分はオプションです。ページの順序を表し(たとえば、01は02より前になります)、このページがメニューに表示されることをGravに明示的に通知します。

新しいページを作成する方法を見てみましょう。

ステップ1 *-次のスクリーンショットに示すように、 */user/pages/; の下に 02.about などのフォルダーを作成します。

Grav Pages

ステップ2 *-次の内容で、新しく作成された *02.about フォルダー内に default.md というファイルを作成します。

---
title: About Us
---

# About Us Page!

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

上記のコードは、以下で簡単に説明する Markdown 構文を使用しています。 Markdown の詳細については、link:/grav/grav_markdown_syntax [Markdown]の章をご覧ください。

  • ---インジケータの間のコンテンツは*ページヘッダー*です。
  • Markdown の*#または *hashes 構文は、HTMLの <h1> ヘッダーに変換されるタイトルを示します。
  • **マーカーは、太字のテキストまたはHTMLの <b> を示します。
  • ステップ3 *-ブラウザをリロードすると、次のスクリーンショットに示すように、メニューに新しいページが表示されます。

Grav Pages

ページの種類

Grav Pagesは3種類のページをサポートしています-

  • 標準ページ。
  • リストページ。
  • モジュラーページ。

標準ページ

標準ページは、ブログ投稿、問い合わせフォーム、エラーページなどの最も基本的なタイプのページです。 デフォルトでは、ページは標準ページと見なされます。 Base Gravパッケージをダウンロードしてインストールするとすぐに、標準ページに歓迎されます。 Base Gravパッケージをインストールすると、次のページが表示されます。

Grav Pages

リストページ

リストページは、ページのコレクションへの参照を持つ標準ページの拡張です。 リストページを設定する最も簡単な方法は、リストページの下に子ページを作成することです。 ブログのリストページは、この良い例です。

リストページを含むサンプルのブログスケルトンは、https://getgrav.org/downloads [Grav Downloads]にあります。 サンプルの1つを次のスクリーンショットに示します。

Grav Pages

モジュラーページ

モジュラーページは、子ページから単一のページを作成するリストページの形式です。 これにより、小さなモジュラーコンテンツページから非常に複雑な1ページレイアウトを構築できます。 これは、ページのプライマリフォルダーにある複数のモジュラーフォルダーからモジュラーページを構築することで実現できます。

モジュラーページを使用したサンプルの1ページスケルトンは、https://getgrav.org/downloads [Grav Downloads]にあります。 サンプルの1つを次のスクリーンショットに示します。

Grav Pages

フォルダ

*/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 です。

ご注文

フォルダーの順序を制御する方法は多数ありますが、重要な方法の1つは、ページ構成設定の content.order.by を設定することです。 オプションは以下のとおりです。

  • default -ファイルシステムは注文に使用できます。つまり、01.homeを02.aboutの前に使用します。
  • title -タイトルは各ページで定義されている順序付けに使用できます。
  • 日付-順序は、各ページで定義されている日付に基づいています。
  • folder -数字の接頭辞で構成されるフォルダー名。 01.、削除されます。
  • basename -順序は、アルファベット順で、数字の順序はありません。
  • modified -ページの変更されたタイムスタンプも使用できます。
  • header.x -任意のページヘッダーフィールドを順序付けに使用できます。
  • manual -order_manual変数の順序付けを使用できます。
  • ランダム-注文をランダム化することもできます。

手動の順序は、 content.order.custom 構成設定にオプションのリストを提供することにより明確に定義されます。 pages.order.dir および pages.order.by オプションを設定して、Gravシステム構成ファイルのデフォルトの動作をオーバーライドできます。

ページファイル

ページフォルダー内のページは、。md *ファイル、つまりMarkdown形式のファイルとして作成する必要があります。 YAMLフロントマターの値下げです。 *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設定で構成されます。 上記の例では、タイトルと分類法をブログページに設定しています。 ---マーカーのペアの後のセクションは、サイトに表示される実際のコンテンツです。

要約サイズとセパレーター

サマリーのデフォルトサイズは、* page.summary()で使用される *site.yaml で設定できます。 これは、ページ全体のコンテンツではなく、要約情報のみが必要なブログに役立ちます。 以下に示すように、 summary delimiter :===としても知られる manual summary separator を使用し、コンテンツの上下に空白行を入れてください。

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()*メソッドと呼ばれる機能があり、別のページを見つけてそのページでアクションを実行します。

たとえば、特定のページのすべての会社の場所を一覧表示する場合は、次のマークダウン規則を使用します-

# 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構文は、読みやすく、書きやすい形式でプレーンテキストを記述することとして定義され、後でHTMLコードに変換されます。 (*)や( `)などの記号は、マークダウン構文で使用されます。 これらのシンボルは、ヘッダーを作成して太字にし、コンテンツを整理するために使用されます。

Markdown構文を使用するには、 user/pages/02.mypage フォルダーに.mdファイルを作成する必要があります。 \ user \ config \ system.yaml 構成ファイルでマークダウン構文を有効にします。

Grav Markdown構文

Markdown構文を使用することには多くの利点がありますが、その一部は次のとおりです。

  • 簡単に習得でき、最小限のキャラクターしかありません。
  • マークダウンを使用すると、エラーが発生する可能性はほとんどありません。
  • 有効なXHTML出力。
  • コンテンツと視覚表示は別々に保持されるため、Webサイトの外観に影響を与えません。
  • 任意のテキストエディターまたはマークダウンアプリケーションを使用できます。

次のセクションでは、マークダウンで使用されるHTMLの主要な要素について説明します。

見出し

各見出しタグは、見出しごとに#で作成されます。つまり、h1からh6まで、#の数は図のように増加します。

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

ブラウザで_.md_ファイルを localhost/Grav/mypage; として開きます。次の結果が表示されます-

Grav Markdown構文

コメント

次の形式でコメントを書くことができます。

<!—
   This is my new comment
-->

ブラウザで_.md_ファイルを localhost/Grav/mypage; として開きます。次の結果が表示されます-

Grav Markdown構文

横罫線

水平方向の規則は、段落間のテーマ別の区切りを作成するために使用されます。 次のいずれかの方法を使用して、段落間に区切りを作成できます。

  • _ -3つのアンダースコア
  • --- − 3つのダッシュ
  • *-3つのアスタリスク

ブラウザで_md_ファイルを localhost/Grav/mypage; として開きます。次の結果が表示されます-

Grav 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.

ブラウザで_.md_ファイルを localhost/Grav/mypage; として開きます。次の結果が表示されます-

Grav Markdown構文

強調

_Emphasis_は、テキストの一部を太字にしたり、斜体にしたり、取り消し線を引いたりするために使用されるマークダウン構文の記述形式です。 以下でそれらについて議論しましょう-

Bold

テキストの一部は、両側に2つの*(**)*記号を使用して太字にすることができます。

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

この例では、*「Advance Online Publication(AOP)」*の単語を太字で表示する必要があります。

ブラウザで_.md_ファイルを localhost/Grav/mypage として開くと、次の結果が表示されます-

Grav Markdown構文

イタリック体

テキストをイタリック体にするには、単語の両側に*“ _” *(アンダースコア)記号を使用します。

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

この例では、「Advance Online Publication」(AOP)の単語を斜体にする必要があります。

ブラウザで_.md_ファイルを localhost/Grav/mypage として開きます。 これにより、次の結果が得られます-

Grav Markdown構文

取り消し線

単語の両側に2つの "~~" (チルダ)を使用して、単語を取り消し線で囲みます。

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

この例では、「Advance Online Publication」(AOP)という言葉を打つ必要があります。

ブラウザで_.md_ファイルを localhost/Grav/mypage として開きます。 これにより、次の結果が得られます-

Grav Markdown構文

ブロッククォート

ブロック引用を作成するには、文または単語の前に*> *記号を追加する必要があります。

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

この例では、文の前に>記号を使用しています。

ブラウザで_.md_ファイルを localhost/Grav/mypage; として開きます。次の結果が表示されます-

Grav Markdown構文

Blockquoteは次の方法でも使用できます-

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

ブラウザで_.md_ファイルを localhost/Grav/mypage; として開きます。次の結果が表示されます-

Grav Markdown構文

お知らせ

通知を使用して、重要な情報を通知または通知できます。

通知には、黄色、赤、青、緑の4種類があります。

!>> *情報を説明する黄色の通知タイプの前に *>>> 記号を使用する必要があります。

>>>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.

Red

警告の赤い通知の前に4つの >>>> 記号を使用します。

>>>>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.

Blue

青の通知タイプには5つの >>>>> 記号を使用します。これはメモを表します。

>>>>>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.

緑の通知タイプの前に6つの >>>>>> 記号を使用します。これはヒントを説明しています。

>>>>>>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.

ブラウザでmdファイルを localhost/Grav/mypage; として開きます。次の結果が表示されます-

Grav Markdown構文

リスト

このセクションでは、Gravで順序なしリストと順序付きリストがどのように機能するかを理解します。

順不同

順不同リストでは、箇条書きが使用されます。 **、-、+ *を使用します。 箇条書きの記号。 テキストと箇条書きが表示される前に、スペースを含む記号を使用します。

  • 例 *
+ Bullet
+ Bullet
+ Bullet
   -Bullet
   -Bullet
   -Bullet
  * Bullet

ブラウザで_.md_ファイルを localhost/Grav/mypage; として開きます。次の結果が表示されます-

Grav Markdown構文

順序付けられました

何かをリストする前に番号を追加してください。

1. Coffee
2. Tea
3. Green Tea

ブラウザで_.md_ファイルを localhost/Grav/mypage として開きます。 これにより、次の結果が得られます-

Grav Markdown構文

Code

このセクションでは、インラインコードとブロックコードの「フェンス」がGravでどのように機能するかを理解します。

インラインコード

マークダウンでコードを使用するために、*( `)*を使用してインラインコードを作成します。

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

ブラウザで_.md_ファイルを localhost/Grav/mypage として開くと、次の結果が表示されます-

Grav Markdown構文

ブロックコード「フェンス」

複数行のコードをブロックする場合は、*( `` `)*フェンスを使用します。

```
You’re Text Here

```

ブラウザで_.md_ファイルを localhost/Grav/mypage; として開きます。次の結果が表示されます-

Grav Markdown構文

テーブル

Gravでは、ヘッダーセクションの下のパイプとダッシュを使用してテーブルが作成されます。 パイプを垂直方向に並べてはいけません。

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

ブラウザで_.md_ファイルを localhost/Grav/mypage; として開きます。次の結果が表示されます-

Grav Markdown構文

右揃えのテキスト

テーブルの内容を右側に表示するには、見出しの下のダッシュの右側にコロンを追加する必要があります。

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

ブラウザで_.md_ファイルを localhost/Grav/mypage; として開きます。次の結果が表示されます-

Grav Markdown構文

リンク集

このセクションでは、Gravでリンクがどのように機能するかを理解します。

基本リンク

リンクは([])角括弧と(())括弧を使用して作成されます。 [] 括弧内にコンテンツを記述し、*()*内にドメイン名を記述する必要があります。

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

ブラウザで_.md_ファイルを localhost/Grav/mypage; として開きます。次の結果が表示されます-

Grav Markdown構文

タイトルを追加

このセクションでは、.mdファイルにタイトルを追加する方法を理解します。

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

ブラウザで_.md_ファイルを localhost/Grav/mypage; として開きます。次の結果が表示されます-

Grav Markdown構文

画像

画像はリンクに似ていますが、構文の先頭に感嘆符が付いています。

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

ブラウザで_.md_ファイルを localhost/Grav/mypage として開くと、次の結果が表示されます-

Grav Markdown構文

Grav-ページのリンク

この章では、Gravでページをリンクする方法を理解します。 1つのページを別のページに簡単な方法でリンクでき、リモートページでさえページリンクでリンクできます。 Gravには、多くのレスポンシブリンクオプションがあります。 以前に HTML を使用してファイルをリンクしたことがある場合、Gravでのページリンクは非常に簡単に理解できます。

以下は、GravサイトのPagesディレクトリの基本的な例です。 画像に示すように、例として次のディレクトリを使用します。

Grav Page Linking

以下に、Gravリンクのいくつかの一般的なコンポーネントを示します。

[Linked Content](../path/slug/page)
  • [] -リンクされるテキストまたは代替コンテンツを書き込むことを指定します。 HTMLでは、<a href="">および</a>を使用してコンテンツを配置します。
  • ()-URLはこのブラケットに配置され、角括弧の直後に配置されます。
  • ../ -1つ上のディレクトリに移動することを示します。

以下にリストされているように、コンテンツで使用されるリンクの4種類があります-

  • スラッグ相対
  • ディレクトリ相対
  • 絶対の
  • リモート

スラッグ相対

内部リンクは、ファイル/ディレクトリ構造内の一部の名前に限定されません。 スラッグはヘッダーとフォールバックの両方のディレクトリ名から取得できます。特定のファイル名を覚える必要はないが、関連するスラッグを覚えることができるので、後でリンクを簡単に作成できます。 Gravのテンプレートエンジンは、ファイルの名前を使用して、適用するテンプレートを認識します。

[link](../dog)

上記のコードは、次の結果を取得します-

Grav Image Linking

上記の例では、ディレクトリを上に移動し、 pages/01.home/02.nature/item.md ディレクトリにあるデフォルトページを pages/01.home/02.dog/itemからロードする必要があります。 .md 。 ファイルitem.mdにはスラッグが割り当てられていないため、Gravはディレクトリ名を使用します。

次に、 pages/01.home/01.dog/item.md から pages/02.black/01.fish/item.md にリンクしているが、item.mdをロードするときの同様の例を見つけます。ファイルの場合、スラッグは 01.fish のファイルに割り当てられます。

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

上記のコードはあなたに次の結果を与えます-

Grav Page Linking

item.mdのヘッダーで、デフォルトのスラッグフォルダー名が black スラッグに置き換えられることがわかります。

ディレクトリ相対

相対設定された宛先は、現在のページをリンクするために使用されます。現在のページは、必要に応じて画像ファイルまたはその他のファイルにすることができます。 ファイルの場所は、宛先の場所と同じくらい重要です。 パスの変更中にファイルを移動すると、リンクが壊れる可能性があります。 ファイルの一貫性が保たれている限り、ローカル開発サーバーと異なるドメイン名のライブサーバーを簡単に切り替えることができます。 リンクは問題なく機能するはずです。

ファイルのリンクは、ディレクトリやスラッグではなく、名前で直接指定します。 pages/01.home/01.dog/item.mdからpages/02.black/01.fish/item.md へのリンクを作成するには、以下に示すコマンドを使用します。

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

上記のコードはあなたに次の結果を与えます-

Grav Page Linking

*../../* で示されるように、両方のフォルダーが上に移動し、下部の2つのフォルダーで、 *item.md* ファイルを直接ポイントします。

絶対リンク

Gravの /user/pages/ ディレクトリに基づいた相対リンクに似ています。 さらに、これは2つの方法で実行できます。

  • スラッグ相対スタイル
  • ディレクトリ相対スタイル

ナメクジ相対スタイル

スラッグ相対タイプと同様に行うことができます。 パス内のディレクトリ名を使用します。 リンクを破壊することで、注文や変更のエラーを排除します。 リンクの切断につながる開始時にフォルダー名の番号を変更します。

以下に絶対リンクの例を示します。リンクは/で開きます。 絶対リンクがSlugスタイルの pages/01.home/01.dog/item.md で作成されることを指定します。

[link](/home/nature)

上記のコードはあなたに次の結果を与えます-

Grav Pageリンク

ディレクトリ相対スタイル*は、GitHubなどのサービスで使用するとより一貫性があります。 Gravの柔軟性の利点はありません。 以下に、ディレクトリ相対スタイルを使用して *pages/01.home/01.dog/item.md に作成された絶対リンクの例を示します。

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

リモート

リモートリンクを使用すると、URLを介して任意のファイルまたはドキュメントに直接リンクできます。 独自のサイトのコンテンツを含める必要はありません。

次の例は、 finddevguides ページにリンクする方法を示しています。

[link](http://www.finddevguides.com)

上記のコードはあなたに次の結果を与えます-

Grav Pageリンク

セキュリティで保護されたHTTPSリンクを含む、任意のURLに直接リンクできます。

Grav-画像リンク

この章では、Gravでの画像リンクについて説明します。 Gravを使用すると、あるページから別のページ、さらにはリモートページに画像をリンクできます。 HTMLを使用してファイルをリンクしている場合、Gravでの画像リンクは非常に簡単に理解できます。

Grav Image Linking

この構造を使用して、さまざまなタイプのリンクを使用してページにメディアファイルを表示する方法を確認します。 この構造の下のすべてのフォルダーには画像が含まれ、*/02.green/img01*の下に特別なディレクトリがあります。これはページとして機能しますが、メディアファイルのみが含まれます。

Gravマークダウンベースの画像タグの一般的な要素のいくつかを見てみましょう。

![Alt Text](../path/image.ext)
  • -マークダウンリンクタグの先頭に配置すると、イメージタグを示します。
  • [] -画像のオプションの代替テキストを指定します。
  • ()-ファイルパスを含む角括弧の直後に配置されます。
  • ../ -ディレクトリを上に移動することを示します。

Gravは、以下にリストする5種類の画像リンクを使用します-

  • スラッグ相対
  • ディレクトリ相対
  • 絶対の
  • リモート
  • 画像のメディアアクション

スラッグ相対

現在のページへの相対画像リンクを設定し、同じディレクトリ内の別のファイルをリンクします。 相対リンクを使用する場合、ソースファイルの場所は宛先の場所と同じくらい重要です。 移動中にファイルのパスを変更すると、リンクが壊れる可能性があります。 このイメージリンク構造を使用する利点は、ファイル構造が一定である限り、ローカル開発サーバーと異なるドメイン名のライブサーバーを切り替えることができることです。

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

ここで、 ../ は、リンクが1つのフォルダーを上に移動し、次に1つのフォルダーを下に移動し、img.jpgが宛先であることを示します。

上記のパスを使用すると、次の出力が表示されます-

Grav Image Linking

Gravは、ページのプライマリマークダウンファイルのヘッダーでスラッグをサポートし、このスラッグは、指定されたページのフォルダー名の代わりになります。

*01.sky* フォルダーに *.md* ファイル( */pages/01.blue/01.sky/text.md* など)で設定されたスラッグがある場合、ファイルのヘッダーは次のようになります-
---
title: Sky
slug: test-slug
taxonomy:
   category: blog
---

上記のコードでは、オプションのスラッグ test-slug を設定しています。 スラッグを設定したら、リンクに*スラッグ相対*または*絶対* URLが設定されているメディアファイルにリンクできます。

ディレクトリ相対

このタイプのリンクでは、現在のページへのディレクトリ相対画像リンクを設定できます。 URLスラッグを使用する代わりに、ディレクトリ相対画像リンク内のフォルダ名を使用してフルパスで参照できます。

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

上記のパスを使用すると、次のように出力が表示されます-

Grav Image Linking

絶対の

絶対リンクは相対リンクと同じですが、唯一の違いは、サイトのルートに相対的であり、 /user/pages/ ディレクトリに存在することです。

あなたは2つの異なる方法で絶対リンクを使用することができます-

  • パスにスラッグまたはディレクトリ名を含め、絶対リンクで一般的に使用される*スラッグ相対*スタイルを使用できます。
  • A/ でリンクを開く Absolute Link を使用できます。
![My image](/blue/img01/img.jpg)

上記のパスを使用すると、次の出力が表示されます-

Grav Image Linking

リモート

リモート画像リンクを使用すると、URLを介してメディアファイルを直接表示できます。 これらのリンクには、自分のサイトのコンテンツは含まれません。 次の例は、リモートURLを使用して画像を表示する方法を示しています-

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

下の画像に示されているリンクをクリックすると、指定されたURLの画像が表示されます。

Grav Image Linking

画像上のメディアアクション

ページに関連付けられた画像により、link:/grav/grav_media [Gravのメディアアクション]の利点を活用できます。 Gravでコンテンツを作成するときに、画像、動画、その他のファイルなどの一部のメディアファイルを表示できます。

次の形式を使用して画像を読み込むことができます-

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

上記のパスを使用すると、次のように出力が表示されます-

Grav Image Linking

Grav-メディア

メディアファイルには、画像、ビデオ、その他多くのファイルなど、さまざまな種類の表示コンテンツが含まれています。 Gravはこれらのファイルを自動的に検出して処理し、どのページでも使用できるようにします。 ページの組み込み機能を使用して、メタデータにアクセスし、メディアを動的に変更できます。

*Smart-caching* は、必要に応じてキャッシュ内で生成されたメディアを作成するGravによって使用されます。 この方法では、メディアを何度も生成する代わりに、すべてキャッシュバージョンを使用できます。

サポートされているメディアファイル

Gravでサポートされているメディアファイルタイプは次のとおりです-

  • 画像-jpg、jpeg、png
  • アニメーション画像-gif
  • ベクトル化された画像-svg
  • ビデオ-mp4、mov、m4v、swf
  • データ/情報-txt、doc、pdf、html、zip、gz

表示モード

以下は、Gravの表示モードのいくつかのタイプです-

  • ソース-画像、ビデオ、またはファイルの視覚的な表示です。
  • text -メディアファイルのテキスト表示。
  • thumbnail -メディアファイルのサムネイル画像。

サムネイルの特定

あなたは3つの場所を使用してサムネイルを見つけることができます-

  • メディアファイルが存在する同じフォルダ内-_ [media-name]。[media-extension] .thumb。[thumb-extension]; _ここで、media-nameとmedia-extensionは実際のファイルの名前と拡張子です。メディアファイルとサム拡張子は、画像メディアタイプでサポートされている拡張子です。
  • * User Folder-* _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のBuilderパターンは、メディアの処理、複数のアクションの実行に使用されます。 すべてのメディアでサポートされるアクションにはいくつかの種類がありますが、特定のメディアでのみ利用できるアクションがいくつかあります。

全般

メディアタイプに使用できる一般的なアクションには6つのタイプがあります。 各アクションについて以下に説明します。

Sr.No. Action & Description
1

url()

url()は* raw URLパス*をメディアに返します。

2

html([title[, alt][, classes]]

出力には、メディア用の有効なhtmlタグが含まれます。

3

display(mode)

異なる表示モードを切り替えるために使用されます。 表示モードに切り替えると、すべてのアクションがリセットされます。

4

link()

リンクの前に適用されるアクションは、リンクのターゲットに適用されます。

5

lightbox([width, height)]

ライトボックスはリンクアクションに似ていますが、いくつかの追加属性を持つリンクを作成するというわずかな違いがあります。

6

Thumbnail

任意のタイプのメディアファイルのページとデフォルトを選択します。これは手動で行うことができます。

画像に対するアクション

次の表に、画像に適用されるいくつかのアクションを示します。

Sr.No. Action & Description
1

resize(width, height, [background)]

サイズを変更して、画像の幅と高さを変更します。

2

forceResize(width, height)

元の比率に関係なく、必要に応じて画像を拡大します。

3

cropResize(width, height)

画像の幅と高さに応じて画像のサイズを変更します。

4

crop(x, y, width, height)

xとyの位置からの幅と高さの説明に従って、画像をトリミングします。

5

cropZoom(width, height)

リクエストに応じて画像をズームおよびトリミングできます。

6

quality(value)

画質の値を0〜100に設定します。

7

negate()

色は否定で反転します。

8

brightness(value)

値*が *-255 から + 255 の場合、輝度フィルターが画像に追加されます。

9

contrast(value)

-100〜+100の値は、コントラストフィルターを画像に適用するために使用されます。

10

grayscale()

画像の処理にはグレースケールフィルターが使用されます。

11

emboss()

エンボスフィルターは、画像の処理にも使用されます。

12

smooth(value)

-10〜+10の値を設定することにより、スムージングフィルターが画像に適用されます。

13

sharp()

鮮鋭化フィルターが画像に追加されます。

14

edge()

画像にエッジ検出フィルターが追加されます。

15

colorize(red, green, blue)

赤、緑、青の色を調整して画像を色付けします。

16

sepia()

セピアフィルターが追加され、ビンテージの外観が得られます。

画像とビデオのアニメーションとベクトル化

アニメーション化およびベクトル化されたアクションは、画像およびビデオで実行されます。 以下は、画像とビデオで行われるアクションです。

Sr.No. Action & Description
1

resize(width, height)

サイズ変更アクションは、 width、height、data-width 、および data-height 属性を設定します。

組み合わせ

Gravには、画像を簡単に操作できる画像操作機能があります。

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

上記のコードは、次のように出力を生成します-

Grav Media

レスポンシブ画像

次の表に、レスポンシブ画像のいくつかのタイプを示します。

Sr.No. Action & Description
1

Higher density displays

ファイル名にサフィックスを追加すると、ページに高密度の画像を追加できます。

2

Sizes with media queries

ファイル名にサフィックスを追加すると、ページに高密度の画像を追加できます。

メタファイル

*image1.jpg、archive.zip* 、またはその他の参照には、変数を設定する機能があるか、メタファイルで上書きできます。 これらのファイルは、 *<filename> .meta.yaml* の形式を取ります。 たとえば、画像が *image2.jpg* の場合、メタファイルは *image2.jpg.meta.yaml* として作成できます。 コンテンツはyaml構文である必要があります。 この方法を使用して、好きなファイルまたはメタデータを追加できます。

Grav-モジュラーページ

モジュラーページは最初は理解するのが難しいですが、一度それについて知ると、作業が非常に簡単になります。 子ページから単一のページを作成できます。 モジュラーコンテンツページから複雑な1ページレイアウトを構築する機能があります。

モジュラーページは、URLから直接アクセスできないため、ルーティング不可として設定されます。 それらは、フォルダー名の前の_(下線)で識別されます。 これは、単一のページを取得するためにそれぞれの上に表示されるページのコレクションです。 たとえば、user/pages/home/_header.

フォルダー構造

1ページのスケルトンの場合、このページは_01.home_フォルダーにあります。 これでは、どのページを含める必要があるかと、表示するページの順序を示す単一のモジュラー .md ファイルを取得します。 modulel.twigは、現在のテーマフォルダーにあります。

以下の画像では、モジュラーページ用に作成されたフォルダー構造を確認できます。

Grav Modular Pages

すべてのサブフォルダーには、マークダウンファイルを記述する_.md_ファイルが含まれている必要があります。

まず、 /users/pages/01.home フォルダーにサブフォルダーを作成する必要があります。 次に、各フォルダーには_.md_ファイルと_modular.md_ファイルが含まれている必要があります。

サブフォルダを作成するとき、画像とファイルは両方とも同じフォルダにある必要があります。

モジュラーページを作成する方法

モジュラーページを作成するには、所定の手順に従う必要があります。

ステップ1 *- */user/pages/01.home/ にいくつかのページを作成します。 フォルダ。 次の画像では、modular.mdファイルとともに2つのフォルダーが作成されていることがわかります。

Grav Modular Pages

ステップ2 *-モジュラーページを作成するには、各フォルダーにファイルを作成し、 *text.md という名前を付ける必要があります。

Grav Modular Pages

  • ステップ3 *-次に、_text.md_ファイルにコードを追加し、保存して実行します。

4つのページすべてを_.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 Modular Pages

次に、ホームページに移動して更新すると、変更を確認できます。

Grav Modular Pages

新しいナビゲーションバーで、4つのファイルリンクを確認できます。

Grav-多言語

多言語とは、Webサイトで異なる言語を使用することと定義されます。 Gravサイトで多言語を使用するのに役立つさまざまな手順を学習します。

多言語の基本

基本的に、Gravにはページを表示するための_.md_ファイルが必要です。 多言語サポートを有効にすると、 default.en.md や* default.fr.md。*などのファイルが検索されます。

言語構成

最初に user/config/system.yaml ファイルにいくつかの基本的な言語設定を設定する必要があります。 ファイル。

Language:
   Supported:
      - en
      - Fr

これにより、Gravで多言語サポートが有効になりました。 上記のコードでは、 en は英語を意味し、 fr はフランス語を意味します。 これは、サイトがこれら2つの言語をサポートすることを意味します。 ここで、デフォルトの言語は_en(英語)_です。 最初に_Fr(フランス語)_を書くと、それがデフォルトの言語になります。

多言語ページ

デフォルトの言語が*英語*に設定されている場合、Gravは default.en.md ファイルを探します。 そのファイルが見つからない場合、Gravは設定した別の言語を探します。 両方の言語が見つからない場合、 default.md ファイルを探します。

  • 例 *

default.en.mdファイル

---
title: Home
---

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

上記のコードは、次の出力を生成します-

Grav Multi Language

デフォルト言語としてフランス語の場合、default.fr.mdファイルは次のようになります-

---
titre: Accueil
---

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

上記のコードは、次の出力を生成します-

Grav Multi Language

URL経由のアクティブな言語

言語コードを使用してWebサイトの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_オプションは、* http://www.mysite.com/en/home*のようなURLコードを強制的に追加します

languages:
   home_redirect:
      include_lang: true
      include_route: false

言語ベースのTwigテンプレート

ファイルが_default.en.md_の場合、Gravは_defaultl.twig_として小枝ファイルを探します。 言語固有の小枝ファイルが必要な場合は、言語フォルダーのルートレベルでアップロードする必要があります。 現在のテーマが templates/defaultl.twig にある場合は、 templates/en/ フォルダーを作成し、その中に英語固有のフォルダーを次のように配置する必要があります。 templates/en/defaultl.twig

言語スイッチャー

言語切り替えプラグインはhttps://github.com/getgrav/grav-plugin-langswitcher[Grav Package Manager(GPM)]で入手できます。

Twigを介した翻訳

小枝フィルターと_t()_関数を使用します。 両方とも同様に機能します。 別のTwigファイルがある場合は、配列から変換できます。

プラグインとテーマ言語の翻訳

テーマまたはプラグイン(/user/plugins/error/languages.yaml)のルートに languages.yaml ファイルを作成して、プラグインとテーマで翻訳を提供します。サポートされているすべての言語が含まれている必要があります。

翻訳のオーバーライド

翻訳をオーバーライドする場合は、_user/languages/_フォルダーの言語ファイルに値のペアを配置する必要があります。

高度な

環境-ベースの言語処理

URLに従ってユーザーをサイトの正しいバージョンにルーティングすることができます。 サイトのURLが標準の* http://www.yoursite.com*のエイリアスである* http://english.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.yamlfr.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:enable: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のテーマは、強力なhttps://twig.sensiolabs.org/[Twigテンプレートエンジン]で構築されています。

コンテンツページとTwigテンプレート

作成するページは、名前によって、またはページのテンプレートヘッダー変数を設定することにより、特定のテンプレートファイルを参照します。 メンテナンスを簡単にするために、ページ名を使用することをお勧めします。

Grav Baseパッケージをインストールすると、user/pages/01.homeフォルダーに defauld.md ファイルが見つかります。 ファイルの名前、つまり default は、 themes/<mytheme>/templates フォルダー内に配置された小枝テンプレート defaultl.twig でこのページをレンダリングする必要があることをGravに伝えます。

たとえば、 contact.md というファイルがある場合、twigテンプレートを使用して* themes/<mytheme>/templates/contactl.twig*としてレンダリングされます。

テーマ構成

次のセクションでは、テーマの構成、つまりその定義、構成などについて説明します。

定義と構成

テーマに関する情報は user/themes/antimatter/blueprints.yaml ファイルで定義され、管理パネルで使用されるフォーム定義はオプションで提供されます。 * Antimatterテーマ*の user/themes/antimatter/blueprints.yaml ファイルに次のコンテンツが表示されます。

name: Antimatter
version: 1.6.0
description: "Antimatter is the default theme included with **Grav**"
icon: empire
author:
   name: Team Grav
   email: [email protected]
   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/<mytheme>/<mytheme> .yaml というファイルでデフォルト設定を提供する必要があります。

enable: true

テーマとプラグインのイベント

プラグインアーキテクチャを介してGravと対話するテーマの機能は、Gravのもう1つの強力な機能です。 これを実現するには、 user/themes/<mytheme>/<mytheme> .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テンプレートは密接に結合しているため、https://getgrav.org/downloads/skeletons [downloads page]で利用可能なスケルトンパッケージに基づいて一般的なテーマを作成することをお勧めします。

テーマでモジュラーテンプレートをサポートする場合、 modular/ フォルダーを作成し、その中に小枝テンプレートファイルを保存する必要があります。 フォームをサポートする場合は、 form/ フォルダーを作成し、その中にフォームテンプレートを保存する必要があります。

設計図

すべての単一テンプレートファイルのオプションと構成のフォームを定義するには、 blueprints/ フォルダーが使用されます。 これらは Administrator Panel では編集できず、オプションで使用されます。 テーマは blueprints フォルダーなしで完全に機能します。

SCSS/LESS/CSS

SASSまたはLESSを使用してサイトを開発する場合は、 user/themes/<mytheme>/scss/ にサブフォルダーを作成する必要があり、css/フォルダーとともにLESSが必要な場合は less/ を作成する必要があります。

SASSまたはLESSからコンパイルされた自動生成ファイルの場合、 css-compiled/ フォルダーが使用されます。 Antimatterテーマでは、SASSの scss バリアントが使用されます。

次の手順に従って、マシンにSASSをインストールします。

  • テーマのルートで、次のコマンドを入力してscssシェルスクリプトを実行します。
$ ./scss.sh
  • 次のコマンドを入力して、直接実行します。
$ scss --sourcemap --watch scss:css-compiled
*css-compiled/* には、コンパイルされたすべてのscssファイルが含まれ、cssファイルはテーマ内に生成されます。

その他のフォルダー

テーマで使用される画像、フォント、およびJavaScriptファイル用に、 user/themes/<mytheme>/ フォルダーに images/、fonts/ および js/ フォルダーを個別に作成することをお勧めします。

テーマの例

これまでに説明した Antimatter テーマの全体的なフォルダー構造を以下に示します。

Grav Theme Basics

Grav-テーマチュートリアル

この章では、コンセプトを理解するためにGravテーマを作成しましょう。

反物質

Gravベースパッケージをインストールすると、デフォルトの Antimatter テーマがインストールされ、 Nucleus (CSSスタイルのシンプルなベースセット)が使用されます。 Nucleusは、独自のルックアンドフィールを提供する基本的なCSSスタイルとHTMLマークアップを含む軽量のCSSフレームワークです。

ブートストラップ

人気のあるhttps://getbootstrap.com/[Bootstrap framework]を利用するテーマを作成しましょう。 Bootstrapは、オープンソースで最も人気のあるHTML、CSS、およびJSフレームワークであり、フロントエンドWeb開発をより迅速かつ簡単にします。

次の手順では、テーマの作成について説明します-

ステップ1:基本テーマのセットアップ

リンク:/grav/grav_themes_basics [Theme Basics]の章で学習したように、Gravテーマにはいくつかの重要な要素があります。これらは、新しいテーマを作成するために従う必要があります。

  • Gravベースパッケージをインストールしたら、以下に示すように、 user/themes フォルダーの下にbootstrapというフォルダーを作成します。

Grav Theme Tutorial

  • user/themes/bootstrap フォルダー内に、以下に示すように css/、fonts/、images/、js/ および templates/ を作成します。

Grav Theme Tutorial

  • bootstrap.php というテーマファイルを user/themes/bootstrap フォルダーに作成し、次のコンテンツをそこに貼り付けます。
<?php
namespace Grav\Theme;
use Grav\Common\Theme;
class Bootstrap extends Theme {}
  • 次に、 themes/bootstrap フォルダーにテーマ構成ファイル bootstrap.yaml を作成し、次の内容を書き込みます。
enable: true
  • 設定オプションがないため、 blueprints フォルダーをスキップし、この章では通常のCSSを使用します。

ステップ2:ブートストラップを追加する

ブートストラップテーマを作成するには、ブートストラップをテーマに含める必要があります。 以下に示すように、https://getbootstrap.com/[リンク]をクリックして、最新のBootstrapパッケージをダウンロードする必要があります。

Grav Theme Tutorial

パッケージを解凍すると、css、fonts、jsの3つのフォルダーが表示されます。 ここで、これらの3つのフォルダーの内容を、以前に作成した user/themes/bootstrap にある同様の名前のフォルダーにコピーします。

ステップ3:基本テンプレート

前の章で学習したように、コンテンツは default.md ファイルに格納され、Gravに defaultl.twig というレンダリングテンプレートを探すように指示します。 このファイルには、ページを表示するために必要なものがすべて含まれています。

Twig Extendsタグを利用するより良いソリューションがあり、https://twig.sensiolabs.org/doc/tagsで基本レイアウトを定義できます/blockl [blocks]。 これにより、Twigテンプレートはベーステンプレートを拡張し、ベースで定義されたブロックの定義を提供できます。

次の手順に従って、簡単なブートストラップベーステンプレートを作成します-

  • user/themes/bootstrap/templates フォルダーに partials というフォルダーを作成します。 これは、ベーステンプレートを格納するために使用されます。
  • partials フォルダーに、次の内容の basel.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/headerl.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:分解する

以下に示すように、 basel.twig ファイルでコードがどのように機能するかを見てみましょう。

  • \ {%block head%} \ {%endblock head%} ベースTwigテンプレートの領域を定義するために使用される構文。 \ {%endblock head%} 内のヘッドはオプションです。
  • ifステートメントは、ページヘッダーに meta description が設定されているかどうかをテストします。 設定しない場合、テンプレートは user/config/site.yaml ファイルで定義されている site.description を使用してレンダリングする必要があります。
  • 現在のテーマのパスは、 theme_url 変数によって指定されます。
  • 構文 \ {%do asset.add( 'theme://css/bootstrap.min.css',101)%} は、 Asset Manager を使用するために使用されます。 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') %}
  • すべてのJavaScriptタグとCSSリンクタグは、 \ {\ {asset.css()}} または \ {\ {asset.js()}} への呼び出しがそれぞれ行われたときにテンプレートによってレンダリングされます。
  • 構文 \ {#…​ #} は、Twigでコメントを書くために使用されます。
  • 別のTwigテンプレートを含めるには、 \ {%include 'partials/headerl.twig'%} タグを使用します。
  • テンプレートのコンテンツは、 \ {%block content%} \ {%endblock%} タグによって提供されます。
  • カスタムJavaScript初期化コードまたは分析コードを追加するには、 \ {%block bottom%} \ {%endblock%} タグがテンプレートのプレースホルダーとして使用されます。

ステップ5:ヘッダーテンプレート

*\ {%include 'partials/headerl.twig'%}* が実行されると、TwigレンダリングエンジンはTwigテンプレートを検索します。 したがって、 *user/themes/bootstrap/templates/partials* フォルダー内に *headerl.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 フォルダーに作成されるたびにnavbarを作成し、すべてのメニュー項目を自動的に表示します。

ステップ6-デフォルトのテンプレート

コンテンツの各アイテムには、 default.md などの特定のファイル名があり、Gravに defaultl.twig というテンプレートファイルを検索するように指示します。 user/themes/bootstrap/templates/ フォルダーに次の内容で defaultl.twig ファイルを作成してみましょう。

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

上記の defaultl.twig ファイルは partials/basel.twig を拡張し、 content ブロックに \ {\ {page.content}} を使用するようにベーステンプレートに指示します。

ステップ7:テーマCSS

*partials/basel.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 Theme Tutorials

Grav-Twigフィルターと関数

この章では、* Twigフィルターと関数*について学習しましょう。 フィルターは、必要な出力を使用してデータを希望どおりにフォーマットするためにも使用されます。 関数は、コンテンツを生成するために使用されます。

Twigテンプレートは、値で置き換えられた式と変数を含むテキストファイルです。 Twigは3種類のタグを使用します。

  • 出力タグ-評価された式の結果をここに表示するには、次の構文が使用されます。
{{  Place Your Output Here  }}
  • アクションタグ-次の構文は、ここでステートメントを実行するために使用されます。
{%  executable statements are placed here  %}
  • コメントタグ-次の構文は、Twigテンプレートファイルにコメントを書き込むために使用されます。
{#  write your comment here  #}

小枝フィルター

Twigフィルターは、 | 文字を使用してフィルターをTwig変数に適用し、その後にフィルター名を続けます。 Twig関数と同様に、引数を括弧で渡すことができます。

次の表は、Gravで使用される小枝フィルターを示しています-

Sr.No. Filter & Description Example
1

Absolute URL

相対パスを取得し、絶対URLに変換します。

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

absolute_url ----

に変換する-

[source,result,notranslate] ---- <img src="http://learn.getGrav.org/some/path/img.jpg%22/> ----

2

Camelize

文字列をCamelCase形式に変換します。

'contact_us'

camelize ----

に変換する-

[source,prettyprint,notranslate] ---- ContactUs ----

3

Contains

文字列が見つかった場合。

'This is some string'

contains('some') ----

出力は-

[source,result,notranslate] ---- 1 ----

4

Defined

変数が定義されているかどうかを確認できます。 変数が定義されていない場合は、デフォルト値を提供できます。

set header_image_width =
page.header.header_image_width

defined(900) ----

定義されていない場合は、 header_image_width に値900を設定します。

5

Ends-With

Ends-Withフィルターを使用して、文字列が特定の文字列で終わるかどうかを判断できます。

'this is an example for ends-with filter'

ends_with('filter') ----

次のように表示されます-

[source,prettyprint,notranslate] ---- True ----

6

FieldName

ドットを配列表記に変更することにより、フィールド名をフィルタリングします。

'field.name'

fieldName ----

次のように表示されます-

[source,prettyprint,notranslate] ---- field[name] ----

7

Humanize

文字列を人間が読める形式に変換するために使用されます。

'some_text_to_read'

humanize ----

次のように表示されます-

[source,prettyprint,notranslate] ---- Some text to read ----

8

Ksort

キーを使用して配列マップをソートします。

{% set ritems = {'orange':1, 'apple':2, 'peach':3}

ksort %} {% for key, value in ritems %}テンプレート:Key:テンプレート:Value, {% endfor %} ----

次のように表示されます-

[source,prettyprint,notranslate] ---- apple:2, orange:1, peach:3, ----

9

Left Trim

文字列の先頭にある空白を削除し、文字列の左側から一致する文字を削除するために使用されます。

'/strip/leading/slash/'

ltrim('/') ----

次のように表示されます-

[source,prettyprint,notranslate] ---- strip/leading/slash/ ----

10

Markdown

Gravのマークダウンパーサーを使用して、マークダウンを含む文字列をHTMLに変換するために使用されます。

'## some text with markdown'

markdown ----

次のように表示されます-

[source,prettyprint,notranslate] ---- some text with markdown ----

11

MD5

文字列のmd5ハッシュは、このフィルターを使用して作成できます。

'something'

md5 ----

次のように表示されます-

[source,prettyprint,notranslate] ---- 437b930db84b8079c2dd804a71936b5f ----

12

Monthize

Monthizeフィルターを使用すると、整数の日数を月数に変換できます。

'61'

monthize ----

次のように表示されます-

[source,prettyprint,notranslate] ---- 2 ----

13

Nice Time

Nice Timeフィルターを使用することにより、人間が読める形式の日付を出力として取得できます。

page.date

nicetime(false) ----

次のように表示されます-

[source,prettyprint,notranslate] ---- 3 hrs ago ----

14

Ordinalize

Ordinalizeフィルターを使用して、整数に序数(1 ^ st ^、2 ^ nd ^、3 ^ rd ^など)を与えることができます。

'78'

ordinalize ----

次のように表示されます-

[source,prettyprint,notranslate] ---- 78th ----

15

Pluralize

文字列は、Pluralizeフィルターを使用して、複数の英語形式に変換できます。

'child'

pluralize ----

次のように表示されます-

[source,prettyprint,notranslate] ---- children ----

16

Randomize

このフィルターは、提供されたリストをランダム化するのに役立ちます。 パラメータに値が含まれている場合、それらの値はランダム化からスキップされます。

{% set ritems = ['one', 'two', 'three', 'four', 'five', 'six', 'seven', 'eight', 'nine', 'ten']

randomize(3) %} {% for ritem in ritems %}テンプレート:Ritem, {% endfor %} ----

次のように表示されます-

[source,prettyprint,notranslate] ---- one, two, three, eight, six, five, nine, seven, ten, four, ----

17

Right Trim

文字列の右側から空白と一致した文字を削除することを除いて、左のトリムに非常に似ています。

'/strip/leading/slash/'

rtrim('/') ----

次のように表示されます-

[source,prettyprint,notranslate] ---- /strip/leading/slash ----

18

Singularize

文字列は、Singularフィルターを使用して英語の単数形に変換できます。

'vehicles'

singularize ----

次のように表示されます-

[source,prettyprint,notranslate] ---- vehicle ----

19

Safe Email

安全な電子メールフィルターは、電子メールアドレスをASCII文字に変換して、電子メールがスパム送信されにくくするために使用されます。

"[email protected]"

safe_email ----

出力は-

[source,prettyprint,notranslate] ---- [email protected] ----

20

SortByKey

キーを使用して配列マップをソートするために使用されます。

{% set people = [{'email':'[email protected]', 'id':3}, {'email':'[email protected]', 'id':1}, {'email':'[email protected]', 'id':7}]

sort_by_key('id') %} {% for person in people %}テンプレート:Person.email:テンプレート:Person.id, {% endfor %} ----

それが表示されます-

[source,prettyprint,notranslate] ---- [email protected]:1, [email protected]:3, [email protected]:7, ----

21

Starts-With

文字列が特定の文字列で始まるかどうかは、Starts-Withフィルターを使用して判断できます。

'this is an example for starts-with filter'

starts_with('this') ----

出力は-

[source,prettyprint,notranslate] ---- true ----

22

Translate

詳細については。

MY_LANGUAGE_KEY_STRING

それが表示されます-

'Some text in English'
23

Translate Admin

文字列を user.yaml ファイルに設定されている現在の言語に翻訳します。

24

Titleize

文字列は、Titleizeを使用してタイトルケース形式に変換されます。

'welcome page'

titleize ----

次のように表示されます-

[source,prettyprint,notranslate] ---- Welcome Page ----

25

UnderScoreize

UnderScoreizeフィルターを使用してフォーマットします。

'ContactUs'

underscorize ----

それはに変換されます-

[source,prettyprint,notranslate] ---- contact_us ----

26

Truncate a string

Truncateを使用して文字列を切り捨てたり、文字列を短くしたりできます。文字数を指定する必要があります。

'one sentence. two sentences'

truncate(5) ----

それは切り捨てられます-

[source,prettyprint,notranslate] ---- one s…​ ----

文字列を指定された文字数の後の最も近い文末まで切り捨てたくない場合は、パラメータとして true を使用できます。

[source,prettyprint,notranslate] ---- 'one sentence. two sentences'

truncate(5, true) ----

それは切り捨てられます-

[source,prettyprint,notranslate] ---- one sentence ----

HTMLテキストを削除することもできますが、 truncate フィルターの前に striptags フィルターを使用する必要があります。

[source,prettyprint,notranslate] ---- '<p>one <strong>sentence<strong>. two sentences</p>'

striptags

truncate(5) ----

次のように表示されます-

[source,prettyprint,notranslate] ---- one s ----

小枝関数

Twig関数は、パラメーターを渡すことで直接呼び出されます。 次の表は、機能を示しています-

Sr.No. Function & Description Example
1

Array

この関数は、値を配列にキャストします。

array(value)
2

Authorize

この関数は、認証されたユーザーにリソースの表示を許可し、許可ストリングまたは許可ストリングの配列を受け入れます。

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

Dump

有効なtwig変数を受け入れ、それをGravデバッガーパネルにダンプします。 ただし、メッセージタブの値を表示するには、デバッガーを有効にする必要があります。

dump(page.header)
4

Debug

これは、dump()関数と同じように機能します。

5

Gist

この関数は、Github Gist IDに基づいてGist埋め込みコードを作成します。

6

Random String Generation

この関数は、指定された文字数でランダムな文字列を作成します。 これらの文字列は、一意のIDまたはキーとして使用できます。

generate_random_string(10)
7

Repeat

この関数は、指定された時間だけ文字列を繰り返します。

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

String

指定された文字長のランダムな文字列を生成します。

ta (23)
9

Translate Array

これは、 *

ta* フィルターに接続された関数です。
10

Url

このフィルターはURLを作成し、PHP URLストリームを有効なHTMLリソースに変換します。 URLを解決できない場合は、デフォルト値を渡すことができます。

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

Translate

翻訳フィルターを使用すると、文字列は *

t* フィルターとして翻訳されます。
t('SITE_NAME')

に変換されます-

Site Name

Grav-テーマ変数

この章では、Gravの*テーマ変数*を理解しましょう。 テーマの設計中にオブジェクトと変数はTwigテンプレートからアクセスされ、これらのオブジェクトと変数はTwigテンプレートフレームワークによって読み取られ、操作されます。

コアオブジェクト

Twigテンプレートには多くの*コアオブジェクトがあります; *各オブジェクトには*変数*と*関数*のセットがあります。

次の表に、簡単な説明とともに変数を示します。

Sr.No. Variable & Description
1

\{\{ base_dir }}

この変数を使用して、Gravインストールのベースファイルディレクトリを取得できます。

2

\{\{ base_url }}

この変数を使用して、GravサイトのベースURLにアクセスできます。

3

\{\{ base_url_relative }}

ベースURLの相対パスをGravサイトに返します。

4

\{\{ base_url_absolute }}

基本URLの絶対パスをGravサイトに返します。

5

\{\{ theme_dir }}

現在のテーマのファイルディレクトリフォルダを返すために使用されます。

6

\{\{ theme_url }}

現在のテーマの相対URLを返すために使用されます。

構成オブジェクト

*configuration.yaml* ファイルでは、Grav構成設定にアクセスするように構成オブジェクトが設定されます。
{{ config.pages.theme }}

現在設定されているテーマを返します。

サイトオブジェクト

*site.yaml* ファイルに設定された構成を表す *config.site* オブジェクトのエイリアスを提供します。

スタイルシートオブジェクト

これらのオブジェクトは、CSSスタイルシートアセットを格納するための配列を提供します。これをループして、テンプレートにCSSを追加できます。

スクリプトオブジェクト

これらのオブジェクトは、JavaScriptアセットで構成される配列を提供します。これはループされ、JavaScriptがテンプレートに追加されます。

ページオブジェクト

Gravの構造は pages/ フォルダーで定義されているため、* pageオブジェクト*は各ページを表す役割を果たします。 *ページオブジェクト*には、現在作業しているページに関するすべての情報が含まれています。

次の表に、ページオブジェクトのメソッドを示します。

Sr.No. Method & Description Example
1

summary([size])

パラメーターとして指定されたサイズのページコンテンツの要点を示します。

サイズが指定されていない場合、値は system/config/site.yaml ファイルの summary.size 変数から取得されます。

コンテンツ内で区切り文字 === を使用することもできます。 区切り文字の前のコンテンツが要約に使用されます。

{{ page.summary }}

Or

{{ page.summary(80) }}
2

content()

ページのHTMLコンテンツ全体を取得するために使用されます。

{{ page.content }}
3

headers()

ページのYAMLフロントマターで定義されたページヘッダーを返します。

title: About Us
author: Johnson

上記のヘッダーには次のようにアクセスできます。

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

media()

画像、ビデオ、その他のファイルなど、すべてのメディアファイルにアクセスするために使用されます。 ページに関連付けられたすべてのメディアを含む配列を返します。

{% set first_image = page.media
first %} {% set my_pdf = page.media['myfile.pdf'] %} {% for image in page.media.images %} テンプレート:Imagel {% endfor %} ---- 5

title()

ページのYAMLヘッダーで定義されているページのタイトルを返すように設定されています。

title: My Page
6

menu()

ページのYAMLヘッダーで指定されている menu 変数の値が返されます。 title 変数が設定されていない場合、デフォルトで title になります。

title: My Blog
menu: my blog page
7

visible()

ページの可視性を設定するために使用されます。 通常、数値の後にピリオド(つまり、01.foldername)が続くページがメニューに表示され、数値を含まないフォルダー名(つまり、foldername)は表示されません。 ページヘッダーでオーバーライドできます。

title: About Us
visible: true
8

routable()

これを使用することで、ページが「ルーティング可能」か「ルーティング不可」かを判断できます。つまり、ブラウザにページを向けながらコンテンツを受信できるかどうかを判断できます。 ルーティングできないページはプラグイン、テンプレートなどで使用でき、これらのページには直接アクセスできません。 これはページヘッダーで設定されます。

title: My Page
routable: true
9

slug()

この変数を使用することにより、ページのURLに表示される直接名を取得できます。

my-page
10

url([include_host = false])

ページのURLを返すために使用されます

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

Or

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

route()

ページの内部ルーティングを返すために使用されます。

12

home()

この変数を使用すると、ページが home ページとして構成されているかどうかを判断できます。 これは、ページがホームページとして構成されている場合はtrueを返し、構成されていない場合はfalseを返します。 この設定は system.yaml ファイルにあります。

13

root()

現在のページが階層のルートページであるかどうかを決定します。 ルートページの場合は true を返し、ルートページでない場合は false を返します。

14

active()

この変数を使用して、ブラウザが現在のページにアクセスしているかどうかを判断できます。 ブラウザがこのページにアクセスしている場合は true 、そうでない場合は false を返します。

15

modular()

この変数を使用することで、このページがモジュール式かどうかを判断できます。 これがモジュラーページである場合、 true および false を返します(そうでない場合)。

16

activeChild()

この変数は、このURIのURLにアクティブページのURLがあるかどうかを判断できます。または、このページのURLを現在のURLに簡単に記述します。 これは、ナビゲーションに取り組んでいて、ページが同じ親ページを繰り返し処理しているかどうかを知りたい場合に非常に便利です。

17

find(url)

ルートURLで指定されているように、ページオブジェクトはこの変数によって返されます。

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

collection()

この変数は、コレクションページヘッダーによって決定されるコンテキストのページのグループを返すために使用されます。

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

isFirst()

現在のページがその兄弟ページの最初である場合、 true を返します。それ以外の場合は false を返します。

20

isLast()

現在のページが兄弟ページの最後である場合、 true を返します。それ以外の場合は false を返します。

21

nextSibling()

現在の位置を参照して、配列から次の兄弟ページを返します。

22

prevSibling()

現在の位置を参照して、配列から前の兄弟ページを返します。

23

children()

ページのコンテンツ構造で定義されているように、子ページの配列はこの変数によって返されます。

24

orderBy()

ソートされた子の注文タイプは、このメソッドによって返されます。 含めることができる値は defaulttitledate および folder であり、これらの値はページヘッダーで構成されます。

25

orderDir()

ソートされた子ページの注文方向は、このメソッドによって返されます。 また、値は asc (昇順)または* desc(降順)*のいずれかです。 通常、これらの値はページヘッダーで構成されます。

26

orderManual()

このメソッドは、手動のページ順序付けで構成される配列を返します。この順序付けは、ページのすべての子に対して行われます。 この値は通常、ページヘッダーで設定されます。

27

maxCount()

この変数は、返されることが許可されている子ページの最大数を示します。 通常、値はページヘッダーで指定されます。

28

children.count()

この変数は、ページに存在する子ページの数を返します。

29

children.current()

この変数は、現在の子アイテムを返します。

30

children.next()

これは、子ページの配列から次の子アイテムを返します。

31

children.prev()

これは、子ページの配列から前の子アイテムを返します。

32

children.nth(position)

これは、子の配列内の子の位置を返します。

33

parent()

ネストされたツリー構造で親ページに戻る場合、この変数を使用できます。 現在のページの親ページオブジェクトを返します。

34

isPage()

この変数を使用すると、このページに実際の .md ファイルがあるか、ルーティング用の単なるフォルダーであるかを判断できます。

35

isDir()

この変数を使用することにより、現在のページがルーティング用のフォルダーのみであるかどうかを判断できます。 それに基づいて true または false を返します。

36

id()

これにより、ページの一意のIDが返されます。

37

modified()

ページが最後に変更されたときのタイムスタンプを返します。

38

date()

ページの日付タイムスタンプは、このメソッドによって返されます。 通常、これはページまたは投稿の日付を表すヘッダーで構成されます。 デフォルトで値が提供されない場合、変更されたタイムスタンプが使用されます。

39

filePath()

これを使用すると、ページの完全なファイルパスを取得できます。

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

filePathClean()

これは相対パスを返します。

user/pages/01.home/default.md
41

path()

これは、現在のページが存在するディレクトリへのフルパスを返します。

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

folder()

これにより、ページのフォルダー名が返されます。

43

taxonomy()

これにより、ページに関連付けられている分類法の配列が返されます。

ページオブジェクト

Pagesオブジェクトは、ページオブジェクトのネストされたツリーとして表されます。 このネストされたツリーは、ナビゲーション、サイトマップ、または*特定のページの検索*を作成するときに非常に便利です。

子メソッド

これは、子ページで構成されるページオブジェクトの配列を返します。 ツリー構造のようなページオブジェクトは、フォルダー内のすべてのページで反復できます。

メニューのトップレベルページを取得するには、次のコードを使用します。

<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オブジェクトのメソッドを示しています。

Sr.No. Method & Description Example
1

path()

現在のURLの一部には、このメソッドを使用してアクセスできます。

uri.path =/section/category/page
2

paths()

この要素を使用すると、パス要素の配列が返されます。

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

route([absolute = false][, domain = false])

このメソッドは、絶対URLまたは相対URLでルートを返します。

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

Or,

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

params()

これにより、URLのパラメーター部分が返されます。

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

param(id)

これは、paramの値を返します。

uri.param('param1') = foo
6

query()

このメソッドを使用して、URLのクエリ部分にアクセスできます。

uri.query = query1=bar&query2=qux
7

query(id)

これを使用して、特定のクエリアイテムにアクセスできます。

uri.query('query1') = bar
8

url([include_host = true])

これは、ホストを含​​む場合と含まない場合がある完全なURLを返します。

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

extension()

これは拡張子を返すか、指定されていない場合、htmlを返します。

uri.extension = json)
10

host()

これにより、URLのホストが返されます。

uri.host = mysite.com
11

base()

これにより、URLのベース部分が返されます。

uri.base = http://mysite.com
12

rootUrl([include_host = true])

これにより、GravインスタンスのルートURLが返されます。

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

referrer()

このメソッドは、ページのリファラー情報を返します。

ヘッダーオブジェクト

元のページの* page.header()*の代替です。 子ページをループしているときは、元のページヘッダーを使用する方が適切です。

コンテンツオブジェクト

元のページの* page.content()*の代替です。

分類オブジェクト

サイトのすべての分類情報は、グローバル分類オブジェクトに含まれています。

ブラウザオブジェクト

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_event_hooks [プラグインの章]に詳細が表示されます。

Grav-アセットマネージャー

この章では、アセットマネージャー*について学習します。 Asset ManagerはGrav 0.9.0で導入され、 *JavaScriptCSS などのアセットを追加および管理するためのインターフェースを統合しました。 これらのアセットをテーマとプラグインから追加すると、 orderingAsset Pipeline などの高度な機能が提供されます。 Asset Pipeline は、ブラウザーの要件を軽減し、アセットのサイズを縮小するように、アセットを縮小および圧縮するために使用されます。

Asset Managerはクラスであり、プラグインイベントフックを介してGravで使用できます。 Twig呼び出しを使用して、テーマでAsset Managerクラスを直接使用することもできます。

設定

Asset Managerは、構成オプションのセットで構成されています。 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をインストールすると、反物質テーマがデフォルトのテーマになります。 このテーマにある basel.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 小枝タグで定義された領域は、それを拡張するテンプレートで置換または追加することができ、このブロック内の* do asset.addCss()*呼び出しの数を確認できます。
  • \ {%do%} タグを使用すると、Twig自体に組み込まれた出力なしで変数を処理できます。
  • CSSアセットは、* addCss()*メソッドを使用してAsset Managerに追加できます。 2番目のパラメーターとして数値を渡すことにより、スタイルシートの優先順位を設定できます。 * addCss()*メソッドを呼び出すと、CSSアセットからHTMLタグがレンダリングされます。

JavaScriptアセットは、CSSアセットと同じ方法で使用されます。 以下に示す block 小枝タグ内のJavaScriptアセット。

{% 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() }}

資産を追加する

次の表は、追加メソッドのさまざまなタイプを示しています-

Sr.No. Method & Description
1

add(asset, [options])

ファイル拡張子に基づいて、 add メソッドはアセットに一致します。 これは、CSSまたはJSの直接メソッドの1つを呼び出すための適切なメソッドです。 options を使用して優先度を設定できます。 アセットを組み合わせ/縮小パイプラインに含めるかどうかは、パイプライン属性によって制御されます。

2

addCss(asset, [options])

この方法を使用すると、CSSアセットにアセットを追加できます。 2番目のパラメーターで設定された優先順位に基づいて、資産はリスト内で順序付けられます。 優先度が設定されていない場合、デフォルトで10が設定されます。 アセットを組み合わせ/縮小パイプラインに含めるかどうかは、パイプライン属性によって制御されます。

3

addDirCss(directory)

この方法を使用すると、アルファベット順に配置されるCSSアセットで構成されるエンティティディレクトリを追加できます。

4

addInlineCss(css, [options])

このメソッドを使用して、インラインスタイルタグ内にCSSの文字列を提供できます。

5

addJs(asset, [options])

この方法を使用すると、JSアセットにアセットを追加できます。 優先度が設定されていない場合、デフォルトの優先度は10に設定されます。 パイプライン属性は、アセットを組み合わせ/縮小パイプラインに含めるかどうかを決定します。

6

addInlineJs(javascript, [options])

このメソッドを使用すると、インラインスクリプトタグ内にJSの文字列を追加できます。

7

addDirJs(directory)

この方法を使用することにより、アルファベット順に配置されるJSアセットで構成されるエンティティディレクトリを追加できます。

8

registerCollection(name, array)

このメソッドを使用すると、CSSまたはJSアセットで構成される配列を名前で登録して、* add()*メソッドを使用して後で使用できるようにすることができます。 複数のテーマまたはプラグインを使用している場合、この方法は非常に便利です。

オプション

以下に示すように説明されている資産の配列を渡すための多くのオプションがあります-

CSSの場合

  • 優先度-整数値を取り、デフォルト値は100になります。
  • pipeline -アセットがパイプラインに含まれていない場合、 false 値に設定されます。 そして、デフォルト値は true に設定されています。

JSの場合

  • priority -整数値を取り、デフォルト値は100です。
  • pipeline -アセットがパイプラインに含まれていない場合、 false が設定されます。 そして、デフォルト値は true に設定されています。
  • loading -このオプションは、 emptyasyncdefer などの3つの値をサポートします。
  • group -グループの一意の名前を指定する文字列で構成されます。 そして、デフォルト値は true に設定されています。

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

アセットのレンダリング

CSSとJS資産の現在の状態は、次を使用してレンダリングすることができます-

css()

Asset Managerに追加されたすべてのCSSアセットに基づいて、* css()*メソッドはHTML CSSリンクタグで構成されるリストをレンダリングします。 パイプライン属性に基づいて、リストには縮小されたファイルと個別/結合されたアセットを含めることができます。

js()

Asset ManagerにアクセスしたすべてのJSアセットに基づいて、* js()*メソッドはHTML JSリンクタグで構成されるリストをレンダリングします。 パイプライン属性に基づいて、リストには縮小されたファイルと個別/結合されたアセットを含めることができます。

名前付き資産

Gravでは、CSSおよびJSアセットのコレクションを名前で登録できるため、登録された名前を使用してAsset Managerにアセットを追加することができます。 これは、名前付きアセット*という機能を使用して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には、 Grouped Assets という新しい機能が導入されました。これにより、オプションの group で構成されるオプション配列を、アセットの追加時に渡すことができます。 この機能は、ページの特定の部分でJSファイルまたはインラインJSが必要な場合に非常に便利です。

オプション構文を使用することにより、以下に示すように、資産を追加するときにグループを指定する必要があります。

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

アセットにグループが設定されていない場合、 head がデフォルトグループとして設定されます。 これらのアセットを下のグループにレンダリングする場合は、テーマに次を追加する必要があります。

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

静的資産

Asset Managerを使用せずにアセットを参照する場合は、* url()*ヘルパーメソッドを使用できます。 たとえば、テーマから画像を参照する場合、次の構文を使用できます。

<img src = "{{ url("theme://" ~ widget.image) }}" alt = "{{ widget.text|e }}"/>
  • url()ヘルパーメソッドは、オプションで2番目のパラメーターを取り、 *true または false 値を使用してURLにドメインとスキーマを含めることを可能にします。 デフォルトでは、値は false に設定され、相対URLのみが表示されます。

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

Grav-テーマのカスタマイズ

この章では、*テーマのカスタマイズ*について学習します。 テーマをカスタマイズするにはいくつかの方法があります。 Gravは、テーマを簡単にカスタマイズするための多くの機能といくつかの機能を提供します。

カスタムCSS

独自の custom.css ファイルを提供して、テーマをカスタマイズできます。 Antimatterテーマは、 Asset Manager を使用して css/custom.css ファイルを参照します。 CSSファイルへの参照が見つからない場合、 Asset Manager は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が上書きされます。 これは、この方法でテーマをカスタマイズすることの大きな欠点です。 これは、テーマの継承を使用することで解決できます。

テーマの継承

*Theme Inheritance* は、テーマを変更またはカスタマイズする最良の方法であり、いくつかのセットアップで実現できます。 基本的な考え方は、テーマは継承元のベーステーマとして定義され、一部のビットのみが変更可能で、残りの部分はベーステーマによって処理されるということです。 テーマの継承を使用する利点は、カスタマイズされた継承テーマが、ベーステーマが更新されるたびに直接影響を受けないことです。 これを実現するには、次の手順に従う必要があります。
  • 新しいテーマを保存するには、 /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: [email protected]
   url: http://getgrav.org

これで、基本的な要素で構成されるテーマ blueprints.yaml を定義する方法を理解できます。 フォームの機能を制御するために、フォーム定義の詳細を提供できます。 詳細については、 blueprints.yaml ファイルを調べることができます。

  • user/config/system.yaml ファイルで* pages:theme:*オプションを編集して、以下に示すようにデフォルトテーマを新しいテーマに変更します。
pages:
   theme: mytheme

これで新しいテーマが作成され、Antimatterがこの新しい mytheme テーマの基本テーマになります。 特定のSCSSを変更する場合は、最初に mytheme テーマ、次にAntimatterテーマに見えるようにSCSSコンパイラーを構成する必要があります。

それは次の設定を使用します-

  • まず、 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プラグインをアップロードして、サイトの機能を拡張できます。 プラグインは、作業を簡単にするために使用されます。 Dependency Injection Container は、Gravの主要なオブジェクトにアクセスするのに役立ちます。 ライフサイクル全体で* Gravのイベントフック*を使用して、必要に応じてGravを操作したり、Gravが知っているものにアクセスしたりできます。 章のリンク:/grav/grav_event_hooks [Grav-イベントフック]で、Gravイベントフックの詳細を学習します。

*Dependency Injection* は、コンポーネント内にコンポーネントをハードコーディングするのではなく、コンポーネントに依存関係を与えるソフトウェア設計パターンです。

Gravには、ブログアーカイブ、サイトマップ、検索エンジン、フォーム、ライトスライダーなどを表示するために使用される無料のプラグインが多数あります。 プラグインはhttp://getgrav.org/downloads/plugins#extras [こちら]からダウンロードできます。 プラグインフォルダーに、一意の名前でプラグインを保存できます。名前はプラグインの機能に関連している必要があり、大文字、アンダースコア、スペースを含めることはできません。 Chapter link:/grav/grav_plugin_tutorials [Grav-Plugin Tutorials]でプラグインの使用方法について学習します。

強力な

プラグインは書きやすく、柔軟で強力です。 46個のプラグインがあり、サイトマップの表示パンくずリストの提供、*ブログアーカイブの表示*などの機能があります。

必需品

Gravがシステムにインストールされると、 <your_folder_name>/user/plugins フォルダー内に2つのプラグインがあることがわかります。

  • エラープラグイン
  • 問題プラグイン

エラープラグイン- HTTP エラーを表示するために使用されます * 404指定されたURIに利用可能なリクエストページがない場合、ページが見つかりません。

問題プラグイン-アクセス許可、ホスティング設定、およびフォルダーの不足に関する問題を検出するために使用されます。 このような問題を特定するために新しいGravをインストールするときに役立ちます。

Grav-プラグインチュートリアル

この章では、プラグインをどのように設定および構成できるかについて詳しく説明します。 さらに、プラグインの構造とランダムページの表示方法も理解します。 プラグインは、Gravのコア機能では元々完了していなかった追加機能を提供するソフトウェアです。

この記事では、ランダムプラグインを使用してランダムページを表示します。 このプラグインを使用する前に、ランダムプラグインの重要なポイントを確認します。

  • URIを /random として使用することにより、このプラグインを使用してランダムページを表示できます。 フィルターを作成して、ページで指定された分類法を使用します。 category:blog *として作成できます。
  • フィルタオプションを使用して、ランダムなページを表示できます。これにより、ランダムページに表示されるのと同じコンテンツを使用するようGravに通知します。

セットアッププラグイン

実際のプラグインを使用する前に、以下の手順に従ってプラグインの基本セットアップを作成してください。

  • user/plugins フォルダーの下に random というフォルダーを作成します。
  • user/plugins/random フォルダーの下に、2つのファイルを作成します-
  • プラグインコードに使用される random.php
  • 設定に使用される random.yaml

プラグイン構成

ランダムプラグインを使用するには、いくつかの設定オプションが必要です。 random.yaml ファイルの下に次の行を書き込みます。

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

ランダムは、定義したルートを作成します。 分類フィルターに基づいて、ランダムなアイテムを選択します。 フィルターのデフォルト値は '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 ステートメントを使用してクラスの束を使用しているため、読みやすくなり、スペースも節約できます。 namespace Grav \ Plugin は、PHPファイルの先頭に記述する必要があります。 プラグイン名は titlecase で記述し、 Plugin を使用して拡張する必要があります。

関数* getSubscribedEvents()を *onPluginsInitialized イベントにサブスクライブできます。これにより、プラグインがサブスクライブされるイベントが決まります。 このように、イベントを使用して他のイベントをサブスクライブできます。

public static function getSubscribedEvents() {
   return [
      'onPluginsInitialized' => ['onPluginsInitialized', 0],
   ];
}
*random.yaml* ファイルで設定されたページのルーティングに使用される *RandomPlugin* クラスの下で *onPluginInitialized* イベントを使用しましょう。

メソッド* 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_オブジェクトは、ランダムプラグインをルーティングするための構成値を指定し、それをルートオブジェクトに格納します。

ここで、設定されたルートを現在の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-イベントフック

この章では、Gravの Event Hooks について学習します。 link:/grav/grav_plugin_tutorials [Plugins]の章では、プラグインのロジックが2つのメソッドに含まれていることがわかります。 メソッドは onPluginsInitialized および onPageInitialized です。これらのメソッドは、イベントフックに似ています。 Gravプラグインの詳細を知り、そのパワーを制御するには、イベントフックの可用性を確認する必要があります。 イベントフックはGravと最初から最後まで直接的な関係があります。 フックが呼び出される順序と、これらの呼び出し時に使用可能なものを認識しておく必要があります。

次の表に、ページの処理中にアクティブ化されるコアGrav *イベントフック*をリストします。

Sr.No. Event & Description
1

onFatalException

  • PHP* で致命的な例外が発生した場合、いつでもこのイベントを起動できます。 *Problem* プラグインはこれを使用して、Gravが致命的なエラーを配信する理由の完全な説明のリストの表示を管理します。
2

onPluginsInitialized

これは、Gravで使用できる最初のプラグインイベントです。 以下のオブジェクトは、下記のように導入されています-

  • Uri
  • 設定
  • デバッガ
  • キャッシュ *プラグイン
3
  • onAssetsInitialized*

これは、 assets マネージャーがロードされ、使用および管理の準備ができていることを指定します。

4

onPageNotFound

予期しないページが見つかった場合、このイベントを閉じることができます。 現在、エラープラグインは* 404エラー*ページを指定するために使用されます。

5

onPageInitialized

これは、Pageオブジェクトにロードされる URL によって要求されたページを指定します。

6

onOutputGenerated

これは、* Twigテンプレート*エンジンによる出力プロセスを指定します。 現在、これは HTML の単なる文字列です。

7

onOutputRendered

これはディスプレイに送信される出力プロセスです。

8

onShutdown

これは、アクションを実行できる新しい強力なイベントです。 これは、Gravが*処理を完了*し、クライアントへの接続が閉じられた後に行われます。 この個々のアクションは、ユーザーとの対話を必要としません。その結果、パフォーマンスに影響を与える可能性があります。 ユーザー追跡とジョブ処理が含まれます。

9

onBeforeDownload

これは、ファイルを含むイベントオブジェクトに*渡される*新しいイベントです。 これにより、ユーザーはロギングを実行し、言及されたファイルをダウンロードする権限を許可および無視できます。

Twigイベントフック

Twigには、以下で説明するように、使用するイベントフックの独自のコレクションがあります。

Sr.No. Event & Description
1

onTwigTemplatePaths

テンプレートパスの基本位置は* Twigオブジェクト*で設定されます。 このイベントは、Twigがテンプレートパスを検索する他の場所を追加するために使用されます。

2

onTwiglnitialized

Twigテンプレートエンジンを*初期化*します。

3

onTwigExtensions

これは、コアTwig拡張がすぐに使用できることを指定します。 このイベントフックを使用すると、独自のTwig拡張機能を追加できます。

4

onTwigPageVariables

このTwigプロセスは、ページを直接許可します。 YAMLヘッダーのページで process:twig:tru を見つけることができます。 ここで、任意の変数をTwigに追加でき、このプロセス中にtwigにアクセスできるはずです。

5

onTwigSiteVariables

このプロセスでは、Twigメソッドごとに orderwise でサイトテンプレート全体が表示されます。 さらに、このプロセス中に任意の変数をTwigに追加できます。

コレクションイベントフック

次の表に、コレクションイベントフックを示します。

Sr.No. Event & Description
1

onCollectionProcessed

このセクションでは、プロセスが完了すると、コレクションを*制御*できます。

ページイベントフック

次の表に、ページイベントフックのコレクションを示します。

Sr.No. Event & Description
1

onBuildPagesInitialized

このイベントは、プラグインがコンテンツを制御し、結果をキャッシュするのに役立ちます。 このイベントがアクティブになると、ページはリサイクルされます。 これは、キャッシュの有効期限が切れているか、リフレッシュが必要なときに発生します。

2

onBlueprintCreated

このイベントは、フォームの処理と管理に役立ちます。

3

onPageContentRaw

このプロセスでは、ページが見つかると、*ヘッダー*は修正されますが、*コンテンツ*は修正されません。 Gravシステムですべてのページが起動されるのがわかります。 キャッシュをクリアした場合、またはキャッシュをクリアした場合、このイベントが発生します。

4

onPageProcessed

ページが*テスト*されて修正されると、Gravシステムですべてのページが閉じられます。 この場合、キャッシュされたページでは再生されないため、パフォーマンスは重要ではありません。

5

onPageContentProcessed

ページのcontent()テクニックによりページのコンテンツが修正されると、このイベントが消えることがわかります。 このイベントは、修正後のコンテンツに対してアクションを実行したいが、結果が*キャッシュ*されていることを確認する場合に役立ちます。

6

onFolderProcessed

  • folder* をテストして修正すると、Gravシステムですべてのフォルダーが閉じられます。 この場合、キャッシュされたページでは再生されないため、パフォーマンスは重要ではありません。

Grav-管理者向けの紹介

*Grav Administration Panel* プラグインは、Grav用のWebグラフィカルユーザーインターフェイス(GUI)です。 ページを簡単に作成および変更できます。 これはオプションのプラグインであり、効果的に動作するためにGravはこれに完全に依存していません。 管理者は、Gravを簡単に使用するための限定ビューを提供します。

特徴

以下は、管理パネルの機能です-

  • プラグインマネージャーリストにあるプラグインを有効または無効にします。
  • ページを簡単に作成、編集、コピー、削除できます。
  • 最新のページ更新のリストがダッシュボードに表示されます。
  • 最新の利用可能なアップデートは、ワンクリックで簡単に表示できます。
  • 検索ボックスを使用して、リストから特定のページを見つけます。
  • パスワードを忘れた場合の機能で構成されています。
  • メディアファイルは、ドラッグアンドドロップ方式でアップロードできます。
  • 通常モードおよびエキスパートモードでyamlまたはフォームを使用して編集できます。
  • ダッシュボードは、サイトアクティビティ、最新のページ更新、およびメンテナンスステータスで構成されます。
  • Ajaxを使用したバックアップとクリアキャッシュ機能で構成されています。
  • サイトおよびシステム構成管理で構成されます。
  • GPMを使用した新しいプラグインとテーマのインストール。
  • ユーザーのログイン中に自動パスワード暗号化機能が提供されます。
  • Gravによるインスタントプレビューで強力な構文を強調するコードエディターを提供します。
  • インストールされたテーマのリストと構成は、テーママネージャーを使用して実行できます。
  • また、ログインしているユーザーも管理します。

インストール

adminプラグインにアクセスするには、 latest Grav を実行する必要があります。 CLI(コマンドラインインターフェイス)で次のコマンドを実行できます。

$ bin/gpm selfupgrade -f
*selfupgrade* は、Gravを利用可能な最新バージョンに更新するために使用されます。 *-f* は、GPM(Grav Package Manager)インデックスを更新するために使用されます。

adminプラグインを正しく実行するには、 adminformemail 、および login プラグインをインストールする必要があります。 すべてのプラグインには依存関係があるため、管理プラグインのインストール中に他のプラグインをインストールするように求められたら同意する必要があります。これらのプラグインはGPM(Grav Package Manager)を介して利用できます。 GPMの詳細については、章のリンク:/grav/grav_gpm [Grav-GPM]で学習します。

次のコマンドは、コマンドプロンプトを使用して管理プラグインをインストールするために使用されます。

$ bin/gpm install admin

手動インストール

次のプラグインを個別にダウンロードすることにより、管理パネルを手動でインストールできます-

すべてのプラグインをダウンロードしたら、すべてのzipファイルを抽出し、 <your_folder_name>/user/plugins フォルダーに保存します。 プラグインフォルダーには、一意の名前でプラグインを保存できます。名前はプラグインの機能に関連している必要があります。 フォルダの名前は、 admin/email/form/ 、および login/ に変更できます。 4つのプラグインをすべてPluginフォルダーに一緒に保存する必要があります。そうしないと、管理パネルが正しく機能しません。

ユーザーを作成する

コマンドラインインターフェイスを使用して、ユーザーアカウントを作成できます。 次のコマンドを使用して、ユーザーアカウントを作成します。

$bin/grav newuser

それ以外の場合は、次のコード行を記述して、ユーザーアカウントを手動で作成することもできます-

email: [email protected]
access:
   admin:
      login: true
      super: true
   site:
      login: true
fullname: 'Tutorials Point'
title: tp
password: 'Password'

上記の行を* <your_folder_name>/user/account/admin.yaml*ファイルに保存します。 上記のコードの保存に使用した名前は、ログインの*ユーザー名*、つまりadminになります。 要件に応じて、 emailfullnametitle および password を編集できます。

使用法

ブラウザで localhost/<your_folder_name>/admin を指定して管理パネルにアクセスすると、次のような画面が表示されます。 「ユーザーの作成」セクションで指定されているように、yamlファイルに usernamepassword を設定できます。

Grav Introduction

Grav-管理ダッシュボード

この章では、Gravの*管理パネルダッシュボード*について学習します。 ダッシュボードは、Grav Administration Panelプラグインの情報の中枢として機能します。 トラフィックの統計新しいバックアップの作成、* Gravの更新*、メンテナンス情報、最新のページの更新の表示、およびこの単一のページの助けを借りてGravのキャッシュをクリアできます。

  • ステップ1 *-ユーザーに権限を指定し、要求に応じて*ダッシュボード*の内容を変更できます。 ダッシュボードの画面は、次のスクリーンショットのようになります。

grav dashboard

  • ステップ2 *-ダッシュボードに*キャッシュと更新チェック*の機能が表示されます。

grav dashboard

[ダッシュボード]メニューの上部に2つのタブが表示されます。

  • キャッシュの消去
  • 更新を確認する

キャッシュの消去

画像のキャッシュやアセットを含む、すべてのキャッシュコンテンツを削除することを指定します。

以下で説明するように、ドロップダウンメニューでその他の機能を確認できます。

  • すべてのキャッシュ-すべてのキャッシュを削除することを指定します
  • アセットのみ-アセットのキャッシュのみを削除することを指定します。
  • 画像のみ-画像のみのキャッシュを削除することを指定します。
  • キャッシュのみ-キャッシュのみを削除することを定義します。

更新を確認する

このタブは、サイトの更新を確認することを指定します。 新しい更新が利用可能な場合、ダッシュボードで通知を受け取ります。 サポートされているプラ​​グイン、テーマ、さらにはGravのアップデートを受け取ります。

メンテナンスと統計

この部分により、サイトに関する重要な情報を知ることができます。

メンテナンス

このセクションでは、完全に最新のGrav機能の割合グラフを提供します。 [メンテナンスと統計]セクションの上に、必要な更新の通知が表示されます。

  • 更新-新しい更新が利用可能になるとすぐに、更新ボタンが表示されます。 次に、それをクリックして、プラグインとテーマを更新できます。 通知バーに[Grav Nowを更新]ボタンが表示され、Gravのコアセクションが更新されます。
  • バックアップ-この部分では、あなたがあなたのサイトをバックアップしていない期間を示しているグラフを見ることができます。 これは、zipファイルを生成してダウンロードすることで実行でき、サイトのデータのバックアップとして保存できます。

統計

過去1日、1週間、1か月に受信した、サイトの訪問者のトラフィックを簡単かつ迅速にグラフで表示します。 曜日に分けられた棒グラフが表示されます。

  • ステップ3 *-次に、以下に示すように、最新のページ更新の詳細情報が表示されます。

grav dashboard

このセクションでは、Gravサイトのページの最新の変更内容について詳しく知ることができます。 次に、ページを更新するたびに、最近更新されたリストが生成されます。

リストからページの*タイトル*をクリックできます。管理セクションのページエディターにリダイレクトされます。

[ページの管理]ボタンをクリックすると、管理パネルのページにリダイレクトされます。

Grav-構成システム

この章では、Gravの管理パネルで*構成システム*について学習します。 [構成]ページを使用して、サイトのシステムの設定を直接構成できます。 さらに、PHP、サーバー環境、およびサイトのパフォーマンスを調整する他のいくつかのコンポーネントなど、サーバーのプロパティの簡単な説明が表示されます。

[システム]タブでは、 /user/config/system.yaml ファイルの設定を変更できます。 これは、Gravの操作の多くの主要システム関連機能に影響します。 設定は、Gravのパフォーマンスのさまざまな機能を示すさまざまなセクションに分割できます。

以下は、システムタブに表示される*構成セクション*の詳細なリストです-

コンテンツ

このセクションでは、以下に示すように、サイトの*コンテンツ*処理の基本的なプロパティを修正できます。

grav configuration system

  • ホームページ-サイトに表示するホームページを指定します。
  • デフォルトテーマ-サイトの主要なデフォルトテーマを表示します。
  • Process -ページの処理方法を制御します。 グローバルではなくページごとに設定できます。
  • TimeZone -サーバーのデフォルトのタイムゾーンを設定します。
  • 短い日付形式-短い日付形式を表示します。
  • 長い日付形式-長い日付形式を表示します。
  • デフォルトの順序-この順序を使用してページがリストに表示されます。
  • デフォルトの順序-リスト内のページの方向を指定します。
  • デフォルトページ数-リスト内の最大デフォルトページ数を定義します。
  • 日付ベースの公開-日付ごとに投稿を自動的に公開します。
  • イベント-イベントを有効または無効にすることを指定します。 無効にすると、プラグインが破損します。
  • リダイレクトデフォルトルート-デフォルトルートを定義し、自動的にページにリダイレクトします。

言語

以下に示すように、この領域で*多言語機能*を設定できます。

grav configuration system

  • サポート-カンマで区切られた2文字の言語コードのリスト、すなわち、en、fr、deを指定します。
  • Translations Enabled -Grav、プラグイン、拡張機能の翻訳を有効にします。
  • Translations Fallback -アクティブな言語が存在しない場合、サポートされている代替の翻訳を指定します。
  • セクションのアクティブ言語-エリアにアクティブ言語を保存できます。
  • ホームリダイレクトを含む言語-要求に応じてホームリダイレクト(/en)に言語を含めます。
  • ホームリダイレクトルートを含める-管理者ホームルートのリダイレクトを指定します。
  • ブラウザから言語を設定-ブラウザから言語を指定します。
  • ロケールのオーバーライド-ロケールのオーバーライドを指定します。

HTTPヘッダ

このセクションは、* HTTPヘッダー*オプションを設定するために使用されます。 この設定は、ブラウザベースのキャッシュと最適化に役立ちます。

grav configuration system

  • Expires -有効期限を定義し、値を秒単位で設定します。
  • Last Modified -プロキシおよびブラウザのキャッシュを最適化するのに役立つLast modifiedヘッダーが設定されます。
  • ETag -変更されたページを識別するために* eタグヘッダー*を定義します。
  • Vary Accept Encoding -Vary:HTTPヘッダーをAcceptに配置する必要があります。 これは、プロキシのキャッシュに役立ちます。

値下げ

このセクションでは、Gravが Markdown を管理する方法と、Markdown Extraを有効にする機能について学習します。 ユーザーを支援し、Gravのページコンテンツの大部分を占めます。

grav configuration system

  • Markdown Extra -Markdown Extraのデフォルトサポートを指定します。
  • 自動改行-マークダウンで改行を指定します。
  • 自動URLリンク-URLのHTMLハイパーリンクへの変換を指定します。
  • エスケープマークアップ-マークアップタブをHTMLオブジェクトに指定します。

キャッシング

このセクションでは、サイトの主要な*キャッシング*機能を構成できます。 Gravは、ユーザー向けの最速のフラットファイルCMSオプションを構築するのに役立つキャッシュ機能を組み合わせました。

grav configuration system

  • キャッシング-これは、 ON/OFF をグローバルに*有効/無効* Gravキャッシングに切り替えることを指定します。
  • キャッシュチェックメソッド-これは、ファイル、フォルダー、およびなしのキャッシュチェックメソッドを定義します。
  • キャッシュドライバー-これは、ユーザーにキャッシュドライバーを選択することを指定します。 _Auto Detect_キャッシュドライバーが最適であると判断します。
  • キャッシュプレフィックス-これは、Gravキーの一部の識別子を指定します。 必要な場合にのみ変更するか、変更しないでください。
  • Lifetime -これは、秒単位でキャッシュの有効期間を定義します、* 0 =無限*。
  • * Gzip圧縮*-パフォーマンスを向上させるには、GravページのGzip圧縮を有効にします。

小枝テンプレート

このセクションでは、Gravは* Twigテンプレート*機能を強調しています。 ここで、Twigキャッシングを構成し、トラッキングダウン設定をデバッグおよび変更できます。

grav configuration system

  • Twig Caching -Twigキャッシングシステムの制御を指定します。 有効にすると、最高のパフォーマンスが得られます。
  • Twig Debug -これは、Twig Debugger拡張機能をロードしないオプションを定義します。
  • 変更の検出-Twigテンプレートで行われた変更、これはTwigキャッシュを自動的に再コンパイルします。
  • * Autoescape変数*-すべての変数は autoescapes です。これにより、サイトが破損する可能性があります。

資産

このセクションは、以下に示すように、CSSおよびJavaScriptアセットを含むアセットを処理するために使用されます。

grav configuration system

  • * CSSパイプライン*-複数のCSSリソースを単一のファイルに統合。
  • CSS Minify -パイプライン処理中、CSSは縮小されます。
  • CSS Minify Windows Override -デフォルトでFalseに設定され、WindowsプラットフォームのMinify Overrideを定義します。
  • CSS Rewrite -パイプライン処理中にCSSの相対URLが書き換えられます。
  • * JavaScriptパイプライン*-複数のJavaScriptリソースを単一のファイルに統合。
  • JavaScript Minify -パイプライン処理中にJSは縮小されます。
  • アセットのタイムスタンプを有効にする-アセットのタイムスタンプが有効になっています。
  • コレクション-資産コレクションは個別に追加されます。

エラーハンドラー

サイトの開発中、このセクションはGravエラーレポートの管理に非常に役立ちます。

grav configuration system

  • Display Error -完全なバックトレーススタイルのエラーページが表示されます。
  • ログエラー-ログエラーは /logs フォルダーに表示されます。

デバッガ

これはエラー処理に似ています。デバッグツールはGravに統合され、エラーを特定してトラブルシューティングします。

grav configuration system

  • デバッガ-デバッガとその設定が有効になっています。
  • Debug Twig -Twigテンプレートデバッガーが有効になっています。
  • Shutdown Close Connection -* onShutdown()*を呼び出す前に、接続を閉じる必要があります。

メディア

このセクションは、Gravの media コンテンツを管理するために使用されます。 ここで、画質、ファイルアップロードサイズ、および多くのメディア処理オプションを構成できます。

grav configuration system

  • デフォルトの画像品質-画像をキャッシュまたはリサンプリングする際にデフォルトの画像品質を使用します。
  • すべての画像をキャッシュ-メディア操作が含まれていない場合でも、すべての画像はGravのキャッシュシステムを介して実行されます。
  • 画像のデバッグの透かし-画像の上にオーバーレイを表示しながら、画像のピクセル深度を示すことができます。つまり、網膜での作業です。
  • ファイルアップロード制限-最大アップロードサイズをバイト単位で定義します(0は無限です)。
  • メディアのタイムスタンプを有効にする-最終更新日に従って各メディア項目にタイムスタンプを追加します。

セッション

下記の機能は、*セッション*サポートを有効にするのに役立ちます。

grav configuration system

  • Enable -これは、Grav内のセッションサポートを指定します。
  • タイムアウト-これはセッションのタイムアウトを秒単位で指定します。
  • 名前-これは、識別子によって開発および適用されるセッションCookieの名前を指定します。

高度な

このセクションでは、*詳細*システムオプションが表示されます。

grav configuration system

  • 絶対URL *-これは、 *base_url の絶対URLまたは相対URLを指定します。
  • Parameter Separate -Windowsでは、パラメータセパレータを使用してApacheを変更できます。

Grav-設定サイト

この章では、Gravの管理パネルで*サイトを設定する*方法を学びます。 [構成]ページを使用して、サイトのシステムの設定を直接構成できます。 [サイト]タブでは、 /user/config/system.yaml ファイルの設定を変更できます。 このタブでは、名前、デフォルトの作成者などのサイト関連機能に影響するオプションとフィールドを変更できます。 あなたのサイトで使用されています。

以下は、_Site_タブに表示されるさまざまな構成設定です。

デフォルト

この領域では、サイトのコンテンツを管理するための基本的なプロパティを設定できます。 ここでは、ホームページ、デフォルトのテーマなど、いくつかのコンテンツ表示オプションを設定できます。

grav configuration site

  • サイトタイトル-これはあなたのサイトのタイトルを指定します。
  • デフォルトの著者-これは、テーマまたはページコンテンツで使用されるデフォルトの著者名を指定します。
  • デフォルトの電子メール-テーマまたはページのデフォルトの電子メールを指定します。
  • 分類タイプ-これは、ページで使用する分類タイプを指定します。

ページの概要

ページサマリーには、ページのコンテンツの小さなプレビューを表示する機能があります。 区切り文字の助けを借りて、要約コンテンツの間にページの「カットオフ」ポイントを定義できます。

grav configuration site

  • 有効-これは、ページの概要が有効かどうかを指定します。
  • サマリサイズ-これは、ページのコンテンツサマリとして使用される文字数を定義します。
  • 形式-_Short_は区切り文字の最初の出現を使用し、_Long_は要約区切り文字を無視します。
  • Delimiter -これはサマリー区切り文字を指定します。 デフォルト値はデフォルトの「===」です。 これをページの概要で使用し、段落を開いた後に投稿できます。

メタデータ

メタデータはページで重要な役割を果たし、SEOを改善します。 ここで複数のメタデータプロパティを設定して、需要に応じて複数の検索エンジンやソーシャルフィードにリンクを表示できます。

grav configuration site

これにより、デフォルトのメタデータ値が指定され、後で変更を加えることができます。

リダイレクトとルート

これにより、サイトの他のページへのリダイレクトとルーティングを設定できます。

grav configuration site

  • カスタムリダイレクト-これは、他のページにリダイレクトするルートを定義します。 標準正規表現の置換は有効です。
  • カスタムルート-他のページへのエイリアスへのルート。 標準正規表現の置換は有効です。

Grav-管理パネルページ

この章では、Gravで管理パネルページがどのように機能するかを理解します。 ページを使用すると、サイトのコンテンツを簡単に作成、編集、または削除できます。 管理パネルページでは、サイト用に作成されたページのリストを表示できます。また、サイト用に新しいモジュラーまたは非モジュラーページを作成することもできます。

新しいページを追加する

次のスクリーンショットに示すように、*ページ*管理パネルの上部に3つのボタンがあることがわかります。

Grav Administration Panel Pages

  • 戻る-管理ページのダッシュボードに戻ります。
  • ページの追加-これにより、新しい非モジュールコンテンツが作成されます。
  • モジュールの追加-これは新しいモジュールコンテンツを作成します。

ページを追加

サイトに Title、Folder Name、Parent root などのページを追加しながら、さまざまなフィールドで構成される非モジュラーページを作成します。

  • ページの追加*ボタンをクリックすると、以下に示すポップアップウィンドウが表示されます-

Grav Administration Panel Pages

次のフィールドが含まれています-

  • ページタイトル-ここでは、ページのタイトルを入力します。
  • フォルダ名-これはページのフォルダ名を入力するか、タイトルを入力すると名前が自動的に生成されます。
  • 親ページ-これは、新しく作成されたページの親ページを設定します。
  • ページファイル-選択したテーマテンプレートをページに表示します。
  • Visible -これは、auto、yes、または_no_に設定することで、ページをナビゲーションバーに表示します。

フィールドにすべての情報を入力したら、 Continue ボタンをクリックします。 ページエディターにリダイレクトされます。

モジュラーページを追加

モジュラーページを使用すると、子ページから単一のページを作成できます。 モジュラーコンテンツページから複雑な1ページレイアウトを構築する機能があります。

*Add Modular* ボタンをクリックすると、次のようなポップアップウィンドウが表示されます-

Grav Administration Panel Pages

ウィンドウには、次のフィールドが含まれています-

  • ページタイトル-ここにモジュラーページのタイトルを入力します。
  • フォルダ名-これはページのフォルダ名を入力するか、タイトルを入力すると名前が自動的に生成されます。
  • ページ-これは、新しく作成されたモジュラーサブページの親ページを設定します。
  • モジュラーテンプレート-モジュラーページに表示する特定のテンプレートを選択します。

フィールドにすべての情報を入力したら、 Continue ボタンをクリックします。 ページエディターにリダイレクトされます。

ページリスト

これにより、サイト用に作成されたページのリストが表示されます。

Grav Administration Panel Pages

ここで、作成したページに簡単にアクセスして編集できます。

  • ページのタイトルをクリックすると、編集のためにページエディターにリダイレクトされます。
  • ページの右側にあるXアイコンは、ページを削除するために使用されます。
  • [フィルター]ボックスは、検索しているページを見つけるために使用されます。 タイプに従ってページをフィルタリングし、 modularvisible 、および/または routable などのページのみがリストに表示されるようにします。
  • 検索ボックスは、ページの正確な名前がわかっているときにページを見つけるために使用されます。
  • ページの左側にあるアイコンに直接カーソルを合わせると、現在のステータス、つまり* Pageが表示されます。 ルーティング可能。 表示されます。 発行済み*。これは、ページがURLを介して表示され、ナビゲーションメニューに表示されることを意味します。

リストに表示されているページをクリックすると、次の画面が表示されます。

Grav Administration Panel Pages

上記の画面には、ページの編集、コンテンツの追加、ページへの画像の追加のオプションがあります。 [オプション]タブは、リンク、/grav/grav_page_editor_options [ページエディターのオプション]の章で学習する公開、分類、サイトマップオプションで構成されています。 *詳細*タブには、リンク、/grav/grav_page_editor_advanced [ページエディタの詳細]の章で説明されている設定、順序付け、上書きなどのページの詳細オプションが含まれています。

Grav-ページエディターオプション

この章では、Grav管理パネルの*ページエディターオプション*について学習します。 これは、ページのコンテンツを作成できるダイナミックテキストエディターです。 さらに、ページにメディアファイルを追加できます。 以下に示す options タブの機能を確認できます。

Grav Page Editor Options

  • オプション*タブには2つのセクションが含まれています-
  • 出版
  • タクソノミー

出版

このセクションは、ページを公開および非公開する日付と時刻を設定するために使用されます。 公開または非公開するコンテンツを完全に制御でき、特定のページのメタデータ値を作成できます。

Grav Page Editor Options

次のフィールドが発行セクションに存在します-

  • Published -デフォルトでは、ページは Yes に設定されています。つまり、公開されています。 [いいえ]を選択すると、ページを非公開にできます。
  • 日付-ペ​​ージの日付と時刻を設定します。
  • 公開日-ページを自動的に公開する日時を設定します。
  • 非公開日-ページを自動的に非公開にする日付と時刻を設定します。
  • Metadata -すべてのページに表示されるメタデータ値を設定します。

タクソノミー

このセクションでは、ページにカテゴリを表示し、ページとその構造プロパティを構成できます。

Grav Page Editor Options

分類セクションには、次のフィールドがあります。

  • カテゴリ-ページのカテゴリを設定します。 コンテンツのソートとフィルタリングに役立ちます。
  • タグ-ページの内容に関する情報を提供します。 コンテンツの整理とフィルタリングに役立ちます。

Grav-ページエディターアドバンス

ページエディタはテキストエディタであり、ページも管理します。これにより、メディアファイル、公開および分類オプション、設定、テーマ固有のオプションを含むコンテンツを作成できます。 次のスクリーンショットは、エディターページの[詳細設定]タブを示しています。

Grav Page Editor Advanced

[詳細設定]タブには3つのセクションがあります-

  • 設定
  • 注文
  • オーバーライド

設定

[設定]セクションでは、ページのさまざまなオプションを扱います。 ここで、ページのテンプレートの設定、ページの親の設定、ページが配置されるフォルダー名の変更ができます。

Grav Page Editor Advanced

設定セクションには次のフィールドがあります-

  • Folder Numeric Prefix -手動で順序付けできるように番号が設定されています。
  • フォルダ名-ページが置かれているフォルダ名を入力します。
  • -ページのルートを設定するか、いくつかのページがサブページとして表示されます。
  • ページファイル-テーマテンプレートを表示するページに設定します。
  • Body Classes -ページの本文に適用されるクラス名を入力します。

ご注文

このセクションでは、番号の付いていないフォルダーを特定の順序で設定します。

Grav Page Editor Advanced

4本の矢印を押したまま、特定の順序でページを再配置する位置に移動します。

オーバーライド

  • オーバーライド*オプションは、キャッシング、ナビゲーションの可視性、スラッグをフォルダー名に基づいて設定されるデフォルト以外のものに設定するなど、ページに追加機能を提供します。

Grav Page Editor Advanced

[上書き]セクションには次のフィールドがあります。

  • メニュー-メニューとして使用される名前を設定します。 何も設定されていない場合は、 Title が使用されます。
  • Slug -URLのページの部分は、このslug変数によって設定できます。
  • ページリダイレクト-ページのURLを設定して、別のURLにリダイレクトします。
  • プロセス-ページのコンテンツで利用可能にするプロセス。
  • デフォルトの子タイプ-子ページの場合、ページタイプはデフォルトとして設定されます。
  • Routable -URLで到達可能かどうかを確認するために、ページを適宜設定します。
  • Caching -ページのキャッシュを設定します。
  • Visible -ページがナビゲーションで表示されるかどうかを指定します。
  • Display Template -テンプレートを表示するページに設定します。

Grav-設計図

  • ブループリント*は、リソース(情報のソース)に関するメタデータ情報です。 それは2つの目的を果たします-
  • 最初は、リソースID自体です。 *2番目はフォームに関するものです。

この完全な情報は、各プラグインまたはテーマにある_blueprints.yaml_ファイルに保存されます。

リソースアイデンティティ

_blueprints.yaml_ファイルでは、テーマとプラグインごとにファイルIDが定義されています。 ブループリントが完全にフォーマットおよびコンパイルされない限り、リソースはGravリポジトリに追加されません。

ブループリントの例

name: plugin name
version: 0.6.0
description: Adds an advanced plugin to manage your site
icon: empire
author:
   name: Team Grav
   email: [email protected]
   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

次のいくつかのプロパティはオプションであり、一部はIDとリソースを提供するために使用されます。

Sr.No. Properties & Description
1
  • name**

リソースの名前に言及してください。

2

version*

リソースのバージョンを指定します。

3

description*

リソースに関する簡単な説明を提供します。 200文字を超えることはできません。

4

icon*

新しいテーマまたはプラグインを開発するためのアイコンライブラリを指定します。

5

author.name*

開発者の名前を指定します。

6

author.email (optional)

開発者のメールアドレスを指定します。

7

author.url (optional)

開発者のURLホームページを指定します。

8

homepage (optional)

リソースのホームページに割り当てられたURLを指定します。

9

docs (optional)

リソース用に作成したドキュメントリンクを指定します。

10

demo (optional)

デモリソースのリンクを指定します。

11

guide (optional)

リソースのガイドまたはチュートリアルの方法のリンクを指定します。

12

keywords (optional)

リソースに関連するキーワードのリストを指定します。

13

bugs (optional)

問題またはバグを報告できるURLを指定します。

14

license (optional)

リソースライセンス、つまり MIT、GPLなど

15

dependencies (optional)

プラグインまたはテーマに必要な依存関係の名前を指定します。

以下は、ログインプラグインブループリントの例です-

name: Login
version: 0.3.3
description: Enables user authentication and login screen.
icon: sign-in
author:
   name: Team Grav
   email: [email protected]
   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

フォーム

テーマまたはプラグインのオプションを管理インターフェースから直接設定できるようにする場合は、_blueprints.yaml_ファイルにフォームを入力できます。 このリソースの一部は、 Forms メタデータによって定義される Admin Plugin を介して構成できます。

以下は、アーカイブプラグイン_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

これらはプラグインのデフォルト設定です。 Adminプラグインを使用せずに設定するには、ユーザーはこのファイルを /user/config/plugins/archives.yaml フォルダーにコピーして変更する必要があります。 _archives.yaml_ファイルを正しく提供できます。ユーザーから管理インターフェースの設定を変更することを選択できます。

変更を保存すると、自動的に* _ <your_folder_name>/user/config/plugins/archives.yaml_*に書き込まれます。

アーカイブプラグインの_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: [email protected]
   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_に存在するフォーム要素です。

トグル

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

ルート要素_Enabled、date_display_format_および_limit_はオプションです。 このルート要素にあるフィールドは、タイプ、サイズ、ラベル、デフォルト、オプションを決定します。 フィールドタイプに応じて、他のフィールドは変更できます。たとえば、選択フィールドにはオプションリストが必要です。

  • 注文方向 *
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_ファイルで確認できるように、フォーム検証はstrictに設定されています。 検証が厳格に設定されている場合、すべてのオプションに対してブループリントフォームを追加する必要があります。追加しないと、保存中にエラーが表示されます。 2つのフィールドのみを管理インターフェイスにカスタマイズする場合は、_form.validation_を緩やかに設定できます。

次の表に、上記のフォーム要素に関連するフィールドの簡単な説明を示します。

Sr.No. Field & Description
1
  • Type*

フィールドタイプを示します。

2

Size

フィールドのサイズを指定します。

3

Label

フィールドのラベルを指定します。

4

Validate

フィールドのタイプとフィールドに入力された最小長を検証します。

5

Default

デフォルトのフィールドを設定します。

6

Options

オプションのリストを指定します。

7

Classes

フィールドのクラスを指定します。

管理者で利用可能なフォームフィールド

プラグインやテーマで使用される、または独自のフォームフィールドを作成できる、組み込みのフォームフィールドが多数あります。 次の表は、利用可能なフォームフィールドのリストです-

共通のフォームフィールド

Sr.No. Field & Description
1

Checkbox

単一のチェックボックスを表示します。

2

Checkboxes

チェックボックスのリストを表示します。

3

Date

日付フィールドが含まれます。

4

Datetime

日付と時刻のフィールドが含まれます。

5

Email

検証付きの電子メールアドレスフィールドが含まれています。

6

Password

ドット形式で表示されるパスワードフィールドが含まれています。

7

Hidden

非表示の入力フィールドが含まれます。

8

Radio

リストから1つのオプションのみを選択できます。

9

Select

このフィールドにはいくつかのオプションが含まれます。

10

Spacer

タイトル、テキスト、または水平線をフォームに追加します。

11

Text

通常のテキストフィールドが含まれます。

12

Textarea

複数行のテキスト入力が含まれます。

特別なフォームフィールド

Sr.No. Field & Description
1

Array

複数のキー値行を追加します。

2

Ignore

未使用のフィールドは削除されます。

3

Columns

フォームを複数の列に分割します。

4

Column

単一の列を表示します。

5

Dateformat

日付と時刻の形式を設定します。

6

Display

入力値なしでテキスト値を表示します。

7

Frontmatter

ページは生の形式で表示されます。

8

List

キーなしでアイテムのリストを表示します。

9

Markdown

マークダウンエディターを表示します。

10

Pages

ページのリストを表示します。

11

Section

設定ページはセクションに分割され、各セクションにはタイトルがあります。

12

Selectize

ボックスを選択するために使用されます。

13

Tabs

設定はタブのリストに分かれています。

14

Tab

タブフィールドは、タブを提供するために使用します。

15

Taxonomy

分類法を選択するために事前構成された選択です。

16

Toggle

入力のオンまたはオフのタイプを指定するトグル効果を表します。

Grav-パフォーマンスとキャッシュ

この章では、Gravのパフォーマンスとキャッシュの概念を理解します。

パフォーマンス

パフォーマンスという用語は、システムのより高い負荷を処理し、より高い負荷を処理するようにシステムを変更できるかどうかなど、システムのパフォーマンスを指します。

Gravのパフォーマンスに関連する次の点を考慮してください-

 *Gravのパフォーマンスを向上させるには、PHP* opcache *および *usercache* を使用できます。 opcacheはPHP 5.4で適切に動作し、usercacheはPHP 5.5、PHP 5.6、およびZend opcacheでより高速に動作します。
* フラッシュメモリを使用し、可動部品のない *SSD* (ソリッドステートドライブ)。 キャッシュはユーザーキャッシュに保存される場合と、ファイルとして保存される場合があります。 そのため、SSDドライブはパフォーマンスを向上させることができます。
 *仮想マシンは、クラウドコンピューティングテクノロジーの下でプロバイダーをホストする最良の方法です。 物理機器と対話せずにリソースを指定できます。* ネイティブホスティング*は仮想マシンよりも高速です。 Gravは仮想マシン上でより良く動作しますが、最適なパフォーマンスを得るには、ネイティブホスティングオプションを利用できます。
* Gravには *faster memory* が搭載されており、キャッシュはサーバーでより良いパフォーマンスを提供する重いメモリを使用します。 他のプラットフォームと比較して、メモリの使用量が少なくなります。
* Gravは、共有サーバーで*共有ホスティング*を使用して物事を共有します。 ホスティングの共有は低コストで利用でき、サーバー上の処理が遅くなる場合があります。
* マルチコアプロセッサは、複数のタスクをより高速に処理するために使用されます。 高度なプロセッサはこれらのプロセッサよりも優れているため、ユーザーはタスクを実行できます。

キャッシング

一般に、キャッシュはキャッシュメモリに格納されたデータです。 キャッシュメカニズムは、ブラウザが元のサーバーではなくキャッシュからファイルを取得できるGravを高速化し、時間と追加のネットワークトラフィックを節約します。

Gravは、以下をサポートするDoctrine Cacheライブラリを使用します-

  • Auto(デフォルト)-デフォルトのオプションを自動的に使用します。
  • File- cache/ フォルダーに存在するキャッシュファイルを指定します。
  • APC
  • XCache
  • Memcache
  • レディス
  • WinCache

デフォルトでは、Gravは自動設定を使用します。 APCを試し、次にWinCache、XCacheを試し、最後にFileを使用します。

キャッシュの種類

キャッシングには5つのタイプがあります-

  • PHPへのYAML構成のキャッシュ。

  • ページオブジェクトのコアGravキャッシング。

  • テンプレートファイルをPHPクラスとしてキャッシングします。

  • メディアリソースの画像キャッシュ。

  • パイプライン処理による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オプション

  • memcachedサーバー*を使用している場合、* user/config/system.ymlファイル*の memcache ドライバーを使用して、追加の構成オプションを追加する必要があります。 これらのオプションは、* cache:*グループで定義できます。
cache:
...
...
   memcache:
      server:localhost
      port: 8080

Redisオプション

*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に設定して有効にします。
  • debug オプションは、小枝のデバッグを有効にします。
  • auto_reload オプションは、trueに設定して変更をリロードするために使用されます。
  • autoescape オプションは、小枝変数を自動エスケープするために使用されます。

キャッシングとイベント

キャッシュが有効な場合、イベントを使用できます。 これは、 OnPageContentRawOnPageProcessedOnPageContentProcessedOnTwigPageVariables 、および OnFolderProcessed イベントを除くすべてのイベントに対して有効にできます。 これらのイベントは、すべてのページとフォルダーで使用でき、イベントの処理中にのみ実行できます。 これらのイベントは、ページがキャッシュされた後は実行できません。

Grav-デバッグとロギング

テーマとプラグインの開発中は、情報のデバッグとロギングが非常に必要です。 Gravは、以下で説明するいくつかの機能を使用して、デバッグ情報を使用します。

PHPデバッグバー

Gravには、デバッグ情報を表示するための Debug Bar というツールが付属しています。 デフォルトでは、この機能は無効になっています。 グローバルに有効にするか、開発環境に_system.yaml_を使用できます。

debugger:
   enabled: true
   twig: true
   shutdown:
      close_connection: true

デバッガーを有効にすると( true )、次のように次のデバッグバーを表示できます。 コーナーの左側にあるG記号をクリックします。

Grav Debugging&Logging

  • デバッグ*バーでは、全体のメモリ使用量と右側のコーナーで処理に使用された時間を表示できます。 また、詳細な情報を提供するいくつかのタブで構成されています。

Grav Debugging&Logging

[メッセージ]タブで、Grav開発プロセスのデバッグに役立つメッセージを表示できます。情報は、_ $ Grav ['debugger']→addMessage($ my_var)_を介してコードからこのタブに投稿されます。

Grav Debugging&Logging

[タイムライン]タブで、Gravタイミングの内訳を表示できます。

エラー表示

実行時にブロックまたはページに関するエラーメッセージを表示します。 Gravでは、エラーを簡単に識別し、非常に迅速にエラーを解決できます。 次のスクリーンショットに示すように、画面に表示されるエラーメッセージは次のとおりです。

Grav Debugging&Logging

_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!');

すべてのログメッセージは、フォルダー_ <your_folder_name>/logs/Grav.log_の下にある_Grav.log_ファイルに表示されます。

Grav-CLI

この章では、GravでCLIがどのように機能するかを理解します。 CLI は、 bin/Grav に保存されているコマンドラインインターフェイスを表します。 キャッシュのクリア、*バックアップ*コピーの作成などのタスクを実行します。

CLIへのアクセスは、プラットフォームごとに異なります。 Windowsでは cmd を介してアクセスでき、Macでは Terminal を介してアクセスでき、Linuxではシェルを使用できます。 Windowsでは、UNIXスタイルのコマンドを使用できません。 これらを使用するには、https://git-for-windows.github.io [msysgit]パッケージをインストールするだけで、WindowsでGITおよびGIT BASHを提供し、UNIXスタイルのコマンドを提供します。

以下のコマンドを使用して、Gravで使用可能なコマンドをリストできます-

$ bin/Grav list

次のスクリーンショットに示すように、利用可能なコマンドを見ることができます-

Grav CLI

新しいプロジェクトの作成

Gravを使用した新しいプロジェクトの作成は非常に簡単です。 Gravインスタンスを使用して新しいプロジェクトを作成できます。

  • terminal または console を開き、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

GPMはGrav Package Managerの略で、Gravリポジトリで利用可能なプラグインをインストール、更新、アンインストール、リストするために使用されます。 GPMは、terminalやcmdなどのコマンドラインインターフェイスを使用してコマンドを実行します。

CLIに非常に簡単にアクセスできます。 Windowsでは cmd を介してアクセスでき、Macでは Terminal を介してアクセスでき、Linuxでは shell を使用できます。 Windowsでは、UNIXスタイルのコマンドを使用できません。 これらを使用するには、https://git-for-windows.github.io [msysgit]パッケージをインストールするだけで、WindowsでGITおよびGIT BASHを提供し、UNIXスタイルのコマンドを提供します。

Gravリポジトリで使用可能なコマンドを一覧表示するには、コマンドを次のように入力します-

$ bin/gpm list

あなたは次のものを受け取ります-

Grav GPM

以下に示すように、行にヘルプを追加することにより、コマンドを支援できます-

$ bin/gpm help install

次のコマンドを使用して、コマンドラインインターフェイスでPHPのバージョンを見つけることができます-

$ php -v

Grav GPM

どのように機能しますか?

コマンドラインインターフェイスでコマンドを実行すると、GPMは GetGrav.org サイトから必要なデータを自動的にダウンロードします。 使用可能なパッケージのすべての詳細が含まれており、インストールする必要があるパッケージと更新する必要があるパッケージも決定します。

リポジトリからパッケージをダウンロードしているとき、Gravリポジトリはローカルにキャッシュされ、キャッシュが生成された後、リクエストは GetGrav.org サーバーに接続できません。

一部のコマンドには、リポジトリの再フェッチを強制する*-force(-f)*オプションが付属しています。 このオプションを使用すると、キャッシュがクリアされるまで24時間サイクル待つ必要はありません。

コマンド

いくつかのコマンドを使用して、Gravリポジトリから利用可能なパッケージをダウンロードできます。 このコマンドを使用するには、ターミナルを開いてGravフォルダーのルートに移動し、 bin/gpm <command> と入力します。

索引

indexコマンドは、Gravリポジトリ内の利用可能なプラグイン、テーマをリストするために使用されます。 ターミナルで以下のコマンドを使用して、利用可能なリソースを一覧表示します。

$ bin/gpm index

Grav GPM

各行は、プラグインまたはテーマの名前、スラッグ、プラグインまたはテーマのバージョンを定義し、インストールされているかどうかも表示します。

Info

infoコマンドは、作成者、バージョン、最終更新日時、パッケージのリポジトリ、パッケージのダウンロードリンク、ライセンス情報など、パッケージに関する情報を表示するために使用されます。

Grav GPM

インストール

名前が示すとおり、installコマンドはGravリポジトリからパッケージに必要なリソースをインストールします。

次のコマンドを使用して、必要なパッケージをインストールできます。

$ bin/gpm install package_name

Grav GPM

すでにインストールされているパッケージをインストールしようとすると、次に何をすべきかが通知されます。

Grav GPM

*Y* と入力すると、既にインストールされているパッケージが上書きされ、 *N* と入力すると、インストールプロセスが中止されます。

更新

更新コマンドは、更新が必要なパッケージについて通知します。 すべてのパッケージが最新の場合、更新することを何も言わないとします。

$ bin/gpm update

Grav GPM

自己アップグレード

self-upgradeコマンドは、Gravを最新バージョンにアップグレードするために使用されます。 Gravをアップグレードするには、次のコマンドを使用します。

$ bin/gpm self-upgrade

Gravの最新バージョンを使用している場合、「Gravの最新バージョンを既に実行しています」というメッセージが、画面に表示されるリリース日と時刻とともに表示されます。

Grav GPM

Grav-開発

*Grav Core* 、 *Grav Plugins* 、 *Grav Skeleton* 、 *Grav Themes* など、さまざまなタイプの *Development* でGravをビルドできます。

Grav Core

Gravは、コンテンツの作成がシンプルで、ページの構築がより友好的で直感的な、最新のCMSです。 * Gravコア*は、Gravに関するすべてを制御し、Gravワークフローとライフサイクルの品質を表すシステムフォルダーについて特に言及しています。 それは主に良い方法で書くことができるページに焦点を当てています。 コンテンツに焦点を合わせ、コンテンツをナビゲート可能なサイトに変えます。

Gravプラグイン

  • プラグイン*は、元々Gravのコア機能では完了していなかった拡張機能を提供するソフトウェアです。 Gravリポジトリには、サイトの機能を示す多くのプラグインがあります。

Gravプラグインに関連する次の点を考慮してください-

  • Grav自体は*スーパーリーン*であり、サイトに必要なプラグインのみを追加します。
  • 必要な機能を追加するのを待つ必要はありません。 これを実現するには、プラグインを作成してGravを拡張します。
  • プラグインは非常に柔軟で強力で、サイトマップ、ブログアーカイブ、検索エンジンを表示し、パンくずリストなどを提供します。

Gravスケルトン

  • Gravスケルトン*は、Grav Core、プラグイン、ページ、テーマをすべて含むサンプルサイトについて説明しています。 Gravの背後にある最初のアイデアは、非常に簡単にサイトを構築することでした。 サイトの開発に必要なものはすべて user フォルダーに配置されます。 Gravのスケルトンには、プラグイン、テーマなどのさまざまな依存関係が付属しています。 解凍可能なパッケージに保存されています。

Gravテーマ

Gravは、Gravサイトに不可欠なさまざまな種類の*テーマ*をサポートしています。 システムにGravをインストールすると、 Antimatter テーマが付属します。 ほとんどのテーマには、スケルトンパッケージまたはサンプルページが付属しています。 スケルトンパッケージと同様のエクスペリエンスを提供する user/pages フォルダーの下にサンプルページがあります。

インストールされたテーマには、ページに適切な* twigテンプレート*が必要です。 テーマは、テーマとコンテンツの組み合わせであり、サイト全体のデザインと同等です。 デザインに応じて、独自の小枝テンプレートエンジンを作成できます。

テーマ/プラグインのリリースプロセス

Gravリポジトリに追加された作成済みのテーマまたはプラグインのポイントのいくつかに気付くことができます。

  • MIT によってライセンスされているオープンソースです。
  • プロジェクトのインストールプロセスと構成を指定する README.md ファイルがあります。
  • リソースに関する情報を含む blueprints.yaml ファイルが含まれており、各プラグインとテーマのルートにあります。
  • テーマまたはプラグインのバージョンを含む CHANGELOG.md ファイルが含まれ、ファイルに変更が加えられるたびに情報が表示されます。
  • リリースの作成は、完成したテーマまたはプラグインを GitHub に配置するための優れた方法です。 リリースがない場合は、プラグインまたはテーマが見つかりません。
  • プラグインまたはテーマに関する詳細を追加し、テストを実行して、機能することを確認します。

変更ログ形式

*changelog format* は、コンテンツと視覚的な表示を分離したままにする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/*という新しいフォルダーに1つの構成ファイルを作成します。これをルートディレクトリの下に作成する必要があります。

$ cd
$ mkdir .Grav
$ vi .Grav/config

Gravフォルダーに移動し、*-s *フラグを使用してシンボリックリンクサイトをセットアップします。

$ cd ~/Projects/Grav/Grav
$ bin/Grav my-project -s ~/www/Grav

ここで、 www はルートフォルダーであり、 Grav はテストサイトを作成する場所です。

Grav Development

Grav-ライフサイクル

この章では、Gravのライフサイクルを理解します。 Grav Lifecycleは、プラグインを介してGravを拡張するためにGravが処理する方法を決定します。 次の図は、Gravライフサイクルプロセスのフローを示しています。

Grav Lifecycle

Gravライフサイクルからの次の4つのステップ-

  • * PHPバージョン*
  • * Loaderクラスは初期化されています*
  • * Gravインスタンスを取得*
  • * Gravプロセスを呼び出す*

PHPバージョン

PHPのバージョンをチェックして、5.4.0以上のPHPバージョンを実行していることを確認します。

ローダークラスが初期化されます

2番目のステップでは、クラスローダーが初期化されます。

Gravインスタンスを取得する

  • インスタンスが存在しない場合、_load()_メソッドを呼び出してGravを追加します。
  • デバッガーの値を初期化し、デバッガーに追加します。
  • ログとエラーハンドラを登録します。
  • URI、タスク、イベント、キャッシュ、セッション、プラグイン、テーマ、小枝、分類法、言語、ページ、アセット、ベースURLを追加します。
  • ストリームと構成ハンドラーを登録します。

Gravプロセスを呼び出す

  • 構成、Uriオブジェクト、エラーハンドラー、デバッガー、およびセッションを初期化します。
  • 初期化後、出力のバッファリングを開始します。
  • タイムゾーンとプラグインを初期化し、_onPluginsInitialized_イベントを発生させます。
  • 次に、テーマを初期化し、_onThemeInitialized_および_onTask [TASK] _イベントを起動します。
  • アセットを初期化し、_onAssetsInitialized_イベントを発生させます。
  • それは次のアクションで小枝を初期化します-
  • 構成に基づいて、Twigテンプレートのパスを設定します。
  • 利用可能な言語テンプレートを処理します。
  • 次に、_onTwigTemplatePaths_イベントを発生させます。
  • ローダーチェーンと小枝の設定が読み込まれます。
  • _onTwigInitialized_イベントを発生させます。
  • Twig拡張機能をロードし、_onTwigExtensions_イベントを発生させます。
  • 標準の小枝変数を設定します。
  • 次に、ページを初期化します。
  • _buildPages()_メソッドを呼び出します。
  • キャッシュが適切であれば、キャッシュからページをロードします。 キャッシュが適切でない場合、_recurse()_メソッドが呼び出されます。
  • _onBuildPagesInitialized_イベントは、_recurse()_メソッドで発生します。
  • ファイルが_.md_として見つかった場合、次のアクションが実行されます-
  • ファイルの詳細をロードするには、_init()_メソッドが呼び出されます。
  • filePath、modified、およびidを設定します。
  • _header()_メソッドは、ヘッダー変数を初期化するために呼び出されます。
  • _slug()_メソッドは、URLスラッグを設定するために呼び出されます。
  • _visible()_メソッドは、可視状態を設定するために呼び出されます。
  • _(アンダースコア)で始まるフォルダーに基づいて、_modularTwig()_が設定されます。
  • 後で_onPageProcessed_イベントを発生させます。
  • _recurse()_フォルダーが見つかった場合の子。
  • _onFolderProcessed_イベントを発生させます。
  • _buildRoutes()_メソッドを呼び出します。
  • すべてのページで、_taxonomy_が初期化されます
  • _route_テーブルは、高速検索用に構築されています。
  • _onPagesInitialized_および_onPageInitialized_イベントが発生します。
  • デバッガーCSS/JSがアセットに追加されます。
  • Twigの_processSite()_メソッドを使用して、出力を取得します。
  • イベント_onTwigSiteVariables_が発生します。
  • ページの出力を取得します。
  • ページが見つからないかルーティングできない場合、イベント_onPageNotFound_が発生します。
  • すべてのTwig変数は、twigオブジェクトに設定されます。
  • テンプレート名は、ファイル/ヘッダー/拡張子情​​報に応じて設定されます。
  • _render()_メソッドが呼び出されます。
  • ファイル形式をHTMLで返します
  • _onOutputGenerated_イベントを発生させます。
  • HTTPヘッダーを設定します。
  • 出力を表示します
  • 出力バッファはページにフラッシュされます。
  • イベント_onOutputRendered_が発生します。
  • クライアントへの接続を閉じます。
  • 最後に、_onShutDown_イベントを発生させます。

_content()_メソッドがページで呼び出されると、次のライフサイクルが発生します。

  • _onPageContentRaw_イベントが発生します。
  • MarkdownとTwigの設定に従って、ページを処理します。
  • _onPageContentProcessed_イベントを発生させます。

Grav-YAML構文

*YAML* は、 *YAML Ai n't Markup Language* の略で、人間が読めるコンテンツを含み、構成ファイル、ブループリント(リソースに関するメタデータ情報)、およびページ設定でよく使用されます。

特徴

以下はYAMLの機能です-

  • XMLやJSONと比較して、YAMLはそれほど複雑ではなく、同じ機能を提供します。
  • CSS、JavaScript、PHPなどの複雑なコードタイプを学習する必要なく、構成設定を提供します。
  • YAMLは、複数の言語タイプに簡単に翻訳できるYAMLファイルのデータとコンテンツを記述します。

YAMLの基本ルール

複数の言語と編集可能なプログラムのあいまいさを減らすために使用されるYAMLのいくつかの基本的なルールがあります。

  • .yaml 拡張子を持つYAMLファイルを終了する必要があります。
  • YAMLは大文字と小文字を区別する必要があります。
  • YAMLはタブの使用をサポートしていません。 タブの代わりに、普遍的にサポートされていないスペースを使用します。

YAMLの基本データ型

YAMLは、次のようなプログラミング言語で使用できるいくつかの基本的なデータ型をサポートしています-

  • スカラー-文字列または数値。
  • シーケンス-配列またはリスト。
  • マッピング-ハッシュまたは辞書。

スカラー

スカラーは、ページ上の文字列または数字を使用してデータを操作する基本的なデータ型です。 * booleanプロパティ*(yesまたはno)、2などの整数値、またはWebサイトの単語や文、タイトルなどのテキストの*文字列*を指定できます。

例えば-

string: "Grav"
integer: 10
float: 10.5
boolean: true

スカラーには、整数、浮動小数点数、ブール値などの値が引用符で囲まれていない場合があります。 文字列値は、エスケープを使用してASCIIおよびUnicode文字を指定する単一または二重引用符が付いた句読点を使用します。

シーケンス

YAMLは配列またはリストの形式でシーケンスを表します。 以下に示すように、リストに配置される開始ダッシュ(-)で各アイテムを定義します。

例えば-

- Apple
- Orange
- Grapes

サブアイテムでネストされたシーケンスを定義し、サブアイテムの各ダッシュの前に単一のスペースを配置するとします。

例えば-

-
   - Apple
   - Orange
   - Grapes

ネストされたリスト内にネストされたシーケンスが必要な場合は、以下に示すようにいくつかのレベルを追加します-

例えば-

-
   -
      - Apple
      - Orange
      - Grapes

マッピング

これは、値とともにキーを定義する方法です。

たとえば、あなたはいくつかの値を特定の要素に割り当てることができます-

Sports: cricket

ここでの値は、「スポーツ」と呼ばれるキーでマップされる「クリケット」です。 このマッピングをシーケンスで使用して、クリケットのアイテムのリストを指定できます。たとえば、「クリケット」という値に対していくつかのプレーヤー名を定義し、名前を子、*スポーツ:クリケット*を親にします。

Sports: cricket
- Sachin Tendulkar
- Rahul Dravid
- M S Dhoni

Grav-フォーム

このhttps://getgrav.org/downloads/plugins[link]で利用可能な form プラグインを使用してフォームを作成できます。 フォームプラグインを検索し、Gravフォルダーにインストールします。

コマンド $ bin/gpm install Form を使用してこのプラグインをインストールすることもできます。 Gravのルートフォルダーに移動し、このコマンドを入力します。 フォームプラグインが自動的にダウンロードされ、必要な依存関係がインストールされます。

シンプルなフォームを作成する

ページYAML frontmatterで定義できる単純なフォームを作成できます。 以下は、フォームの例です-

---
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/datal.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
---

上記のコードは、名前、電子メール、メッセージ、およびCaptchaフィールドを持つ単純なフォームページを示しています。 フォームに記入した後に情報を送信すると、コードに示されているように、YAMLフロントマテリアルに process フィールドを追加してフォームが処理されます。

  • プロセス*フィールドは次の情報を使用します-
  • email オプションは、 from フィールドが電子メールの送信者を指定し、 to フィールドがメールの受信者を指定するなど、2つのフィールドを使用します。
  • subject は、入力された電子メールに電子メールが送信される [feedback] [entered mail] オプションを使用します。
  • メールの本文は、themeフォルダーにある forms/datal.twig ファイルで指定されます。
  • フォーム入力データは user/data フォルダーに保存されます。 テンプレートは、テーマフォルダーにある forms/data.txt.twig ファイルで定義されます。
  • thankyou/ サブフォルダーの下に、ユーザーがフォームを送信したときにそのページにリダイレクトされるサブページを作成します。

次の表に示すように、フォームプラグインでいくつかのフィールドを使用できます-

Sr.No. Field & Description
1

Captcha

これは、ユーザーが人間であるかどうかを判断するためにコンピューティングで使用されるスパム対策フィールドです。

2

Checkbox

簡単なチェックボックスが表示されます。

3

Checkboxes

複数のチェックボックスが表示されます。

4

Date and Datetime

両方のフィールドを使用して、日付と日付をそれぞれ時間とともに表示します。

5

Email

これは検証付きの電子メールフィールドです。

6

Hidden

非表示フィールドを指定します。

7

Password

パスワードフィールドを指定します。

8

Radio

シンプルなラジオボタンが表示されます。

9

Select

選択フィールドを提供します。

10

Spacer

フォームにタイトル、テキスト、または水平線を追加できます。

11

Text

シンプルなテキストフィールドを表示します。

12

Textarea

シンプルなテキスト領域フィールドを表示します。

13

Display

入力フィールドではなく、テキストまたは指示フィールドが表示されます。

フィールドパラメータ

すべてのフィールドは、フォームの外観をカスタマイズするために使用できる次のパラメーターを受け入れます。

Sr.No. Parameter & Description
1

label

ラベルフィールドを定義します。

2

validate.required

要素が必要になります。

3

validate.pattern

検証パターンを指定します。

4

validate.message

検証が失敗すると、メッセージが表示されます。

5

type

フィールドタイプを定義します。

6

default

デフォルトのフィールドタイプを定義します。

7

size

大、x-小、中、長、小などのフィールドサイズを表示します。

8

name

フィールド名を定義します。

9

classes

CSSクラスで文字列を使用します。

10

id

フィールドIDを定義します。

11

style

フィールドのスタイルを指定します。

12

title

フィールドのタイトルを定義します。

13

disabled

フィールドが無効な状態かどうかを判断します。

14

placeholder

これは、ユーザーが値を入力する前に入力フィールドに表示される短いヒントです。

15

autofocus

これは、ページがロードされるときに入力要素が自動的にフォーカスを取得することを指定します。

16

novalidate

送信時にフォームデータを検証しないことを指定します。

17

readonly

フィールドを読み取り専用状態として決定します。

18

autocomplete

ユーザーがフィールドへの入力を開始すると、フィールドにオプションが表示され、以前に入力した値に基づいて値が表示されます。

一部のフィールドには、次のような特定のパラメーターが含まれています-

Sr.No. Parameter & Description
1

date and datetime

これらのフィールドは、 validate.min および validate.max を使用して最小値と最大値を設定します。

2

spacer

アンダーライン*を使用して *<hr> タグを追加し、 text を使用してテキスト値を追加し、 title を<h3>タグとして使用します。

3

select

  • multiple* パラメーターを使用して複数の値を追加します。
4

select and checkboxes

  • options* フィールドを使用して、使用可能なオプションを設定します。
5

display

  • content* パラメーターを使用してコンテンツを表示します。 コンテンツを表示するには、 *markdown* をtrueに設定します。
6

captcha

  • recatpcha_site_key* および *recaptcha_not_validated* パラメーターを使用します。

キャプチャに関する注意

以下に示すように、 g-recaptcha-response というフィールドにcaptcha情報のコードがあります-

- name: g-recaptcha-response
   label: Captcha
   type: captcha
   recatpcha_site_key: 6LelOg4TAAAAALAt1CjjjVMxFLKY8rrnednYVbr8
   recaptcha_not_validated: 'Captcha not valid!'
   validate:
        required: true

reCaptchaは、スパムや悪用からWebサイトを保護するために使用されます。 recatpcha_site_key オプションを使用して、サイトにウィジェットを表示します。 reCaptchaを使用するには、https://developers.google.com/recaptcha/docs/start [reCaptcha docs]を参照してください。 reCaptchaが正しくない場合、 recaptcha_not_validated オプションを使用してメッセージを表示します。

フォームアクション

Eメール

以下に示すように、 process フィールドの下に特定のオプションを含む電子メールを送信できます-

- email:
    from: "{{ config.plugins.email.from }}"
    to: "{{ config.plugins.email.to }}"
    subject: "Contact by {{ form.value.name|e }}"
    body: "{% include 'forms/datal.twig' %}"

2つのフィールドを含む電子メールオプションを使用します。 from フィールドは電子メールアドレスの送信者を指定し、 to フィールドは電子メールプラグイン構成を使用して電子メールアドレスの受信者を指定します。 電子メールフィールドでは、 subject オプションも使用されます。このオプションでは、件名が[Contact by] [name入り]で入力された電子メールに電子メールが送信され、電子メールの本文は、テーマ。

他のページへのリダイレクト

*process* フィールドで定義された *message* および *display* オプションを使用して、別のページにリダイレクトできます。
process:
   - message: Thank you for getting in touch!
   - display: thankyou
*message* オプションは、ユーザーが送信ボタンをクリックしたときに表示されるメッセージを設定します。 ユーザーがフォームを送信すると、別のページにリダイレクトされます。 *form.md* ファイルが保存されている *thankyou* サブフォルダーの下に1つのサブページを作成します。 フォームを送信すると、ページにリダイレクトされ、上記のメッセージが表示されます。
*thankyou/formdata.md* というサブページには、次のコンテンツが含まれます。
---
title: Email sent
cache_enable: false
process:
   twig: true
---

## Your email has been sent!

フォームを送信すると、プラグインはユーザーにメールを送信し、データは data/folder の下に保存されます。

Save

*user/data* フォルダーの下に保存されるファイルにデータを保存するために使用されます。

例えば-

process:
   - save:
      fileprefix: contact-
      dateformat: Ymd-His-u
      extension: txt
      body: "{% include 'forms/data.txt.twig' %}"

データは、拡張子がtxtのテキスト形式で保存されます。 本文はテーマの templates/forms/datal.twig ファイルから取得されます。

次の画面は、単純なフォームを示しています-

Grav Forms

Grav-Webホスティング

ホスティングは、Webサイトホスティングとも呼ばれ、Webサイトを維持および整理するプロセスであり、World Wide Webを介してWebサイトへのアクセスを提供します。 簡単に言えば、それはインターネット上のWebサイトにプラットフォームを提供するサービスです。

Gravはさまざまなタイプのホスティングサービスをサポートしています-

  • Rochen Web Hosting
  • WireNine
  • 重要なウェブホスティング
  • Arvixe
  • SiteGround
  • ドリームホスト

Rochen Web Hosting

長期ホスティングプロバイダーとして、 GetGrav.orgRocketTheme.com の両方に使用できます。 SSDドライブ、Litespeed Webサーバー、Intel XEONプロセッサーを使用してGravのパフォーマンスを向上させます。 2種類のオプションを提供します。 1つは*共有*ホスティングで、もう1つは*バースト*ホスティングです。

Grav Hosting

Rochen Web Hostingの詳細については、https://www.rochen.com/?utm_source = RocketTheme&utm_medium = Showcase&utm_campaign = Promotions [link]をクリックしてください。

WireNine

WireNineは、665か国以上のお客様に信頼できるWebホスティングサービスを提供しています。 Intel Xeon E5 v3 CPU、DDR4 ECC ram、および冗長RAID SSDストレージを使用して、サーバーの機能を強化します。 最大の信頼性と安定性を提供して、100%の稼働時間を保証します。 CloudLinux、Litespeed、MariaDB、PHP、Ruby、Python、Perlなどの最適化されたソフトウェアが含まれています。

Grav Hosting

WireNineホスティングの詳細については、https://www.wirenine.com/[link]をご覧ください。

重要なWebホスティング

もう1つのWebホスティングタイプは、速度とサポートに重点を置いています。 SSDドライブ、Litespeed Webサーバー、Intel XEONプロセッサーを使用してGravのパフォーマンスを向上させます。

Grav Hosting

このhttps://www.crucialwebhost.com/[link]でCrucial Web Hostingの詳細情報を入手できます。

アルビクセ

ArvixeはWebホスティングタイプであり、Webホスティングに比類のない信頼性、品質、および手頃な価格の組み合わせを提供します。 Webホスティング分野で優れた機能を提供することで、多数のWebホスティング賞を受賞しています。

Grav Hosting

Arvixe Web Hostingの詳細については、https://www.arvixe.com/[link]をクリックしてください。

SiteGround

Joomla、WordPress、Magento、その他のWebアプリケーション向けのホスティングソリューションを提供します。 Web Hosting Planning with Care というタグラインがあり、Webホスティングプランを慎重に処理し、Webサイトの実行を高速化する新しい手法を提供します。

Grav Hosting

SiteGroundホスティングの詳細については、https://www.siteground.com/[link]をご覧ください。

ドリームホスト

個人またはビジネス関連のWebホスティングニーズにより多くの機能を提供することにより、機能のリストを提供します。 超高速SSDと、最大64GBのRAMを備えた新しい専用サーバーがあります。

Grav Hosting

Dreamhost Web Hostingの詳細については、https://www.dreamhost.com/[リンク]をクリックしてください。

Grav-サーバーエラー

Gravの設定ミスが原因でサーバーエラーが発生します。 サーバーで内部エラーが発生した場合、または予期しないことが発生した場合、Gravはページを提供および復元できません。

サーバーが運用モードで実行されている場合、ユーザーから情報を隠すために、サーバーエラーメッセージが表示されます。 すべてのエラーメッセージは、フォルダー_ <your_folder_name>/logs/Grav.log_の下にある_Grav.log_ファイルに記録されます。

以下は、サーバーエラーを引き起こす可能性のある理由の一部です-

  • 古い構成
  • 不正なファイル許可
  • 無効なフォーマットされた構成ファイル
  • Gravが認識していないファイルシステムの変更

古い構成

キャッシュをフラッシュして、構成が最新かどうかを確認できます。 次のコマンドを使用して、キャッシュをフラッシュします。

bin/Grav clear-cache

インストールと構成の問題

インストールと構成の問題は-

  • 構成の問題
  • インストールの問題
  • システム要件
  • ファイル許可

Grav-許可

一般に、*許可*は、ホスティング環境で何かを行うことを許可するプロセスです。 許可には、サーバー上のファイルへの読み取りまたは書き込みアクセス、またはファイルシステム上のファイルの編集が含まれます。 Gravは、キャッシュファイルとログファイルを作成するためにファイルシステムに書き込む必要があるフラットファイルベースのCMSです。

Gravは3つの主なシナリオの下にあります-

PHP/Webserverは、ファイルを編集する同じユーザーで実行されます

このシナリオは、ほとんどの共有ホスティング設定で、またローカル開発でもうまく機能します。 専用のWebホストでは、このアプローチを十分に安全であると考えることはできません。

PHP/Webserverは異なるアカウントで同じグループで実行されます

ユーザーとPHP/Webserverアカウント間で共有グループを使用する_775_および_664_権限を使用すると、2つの異なるアカウントにファイルへの*読み取り/書き込み*アクセス権を持たせることができます。 適切な権限を持つルートに_umask 0002_を設定することにより、新しいファイルを作成できます。

異なるアカウント、アクセス許可を手動で修正

このアプローチは異なるアカウントを持ち、ファイルの所有権と許可を更新して、PHP/Webserverユーザーがファイルの*読み取り/書き込み*アクセス権を持つようにします。

以下は、 permissions-fixing シェルスクリプトの簡単なコードです。 このファイルは、セットアップで機能するグループごとに編集できます。

#!/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行。 タイプf! -path "./bin/" | xargs chmod 664_は、ディレクトリのすべてのファイルの664パーミッションを、他のユーザーの_Read_およびグループとユーザーの_Read/Write_に設定します。
  • _find行。 -type f -path "./bin/" | xargs chmod 775_は、ディレクトリ内のすべてのファイルの775パーミッションを、他のユーザーの場合は_RX_に、グループおよびユーザーの場合は_RWX_に設定します。
  • _umask 0002_は、664および775のアクセス許可を持つ新しいファイルを作成するために使用されます。

Grav-interview-questions