Grav-pages

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

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>