grav cmsから始めましょう

Sep 12, 2025

操作方法

（画像クレジット：未来）

gravは違いを持つコンテンツ管理システム（CMS）です。コンテンツ管理システムは、WordPress（または他の）のプラットフォームを備えた現代のWebには一般的です。 ウェブホスティング プロバイダ）広い割合のウェブサイトを動かす。開発者がコードを別々に処理している間に、テキスト以外のユーザーにとって簡単に使いやすいグラフィカルインタフェースを提供します（使いやすい方法と同様の方法で）。 ウェブサイトビルダー ）。

主な欠点は、CMSが不要な機能で膨満したとき、または開発者が対抗生産的な方法で機能するようになります。基本的なCMS-Built Webサイトでさえも ランディングページ データベースに依存しているため、移行と管理を大きくする必要があるよりも大きなタスクを作成できます。

出来事肉汁、軽量で、柔軟なことを目的として構築されたCMS。それでも、グラフィカルインターフェイス、ユーザー管理、およびCMSに予想されるのと同じ機能を備えたオプションの管理パネルがまだあります。

GravはMySQLまたは類似の従来のデータベースを持っていないが、フォルダとプレーンテキストファイルに格納されているデータベースの種類があります。これらのファイルは、YAMLに保存されている構成を持つマークダウン構文でコンテンツを格納します。保存するコンテンツがある場合は、これらを試してください クラウドストレージ オプション。

新しいシステムを学ぶと同様に、gravは始めるために少し努力し、そしてドキュメントは改善されていない、いくつかの質問を未回転させ、事前に作った「スケルトン」を掘り下げることを残しました。このチュートリアルでは、grvをインストールし、デフォルトのクォークテーマを使用してページを追加します。

ファイルをダウンロードしてください このチュートリアルのために。

正しいCMSを選択する方法

01.ローカル環境を設定します

Gravには、ApacheやNginxなどのWebサーバー、およびPHPの少なくともバージョン7.1.3が必要です。

一緒に動作するローカルの洗濯、MAMP、またはLAMPサーバーを設定します。 git and composerもまた、これらがコマンドラインで使用できることを確認するために使用されます。

02.作業ディレクトリを作成します

ローカルサーバーのWebルート内で、新しいディレクトリを作成し、それを「grv-project」と呼びます。

そうでない場合は、PHPがインストールされていることを確認してください。

03.肉のコピーを取り付けます

WebサイトからZIPファイルをダウンロードし、それを以前に作成したフォルダに抽出するための最も簡単な方法です。

GITのインストール方法を使用して、Grav CLIを探索します。ローカルサーバーのWebルートに移動して、次のコマンドを実行します。

 git clone -b master https://github.com
GetGrav / grav.git grav-project

04.依存関係をインストールします

Get started with Grav CMS: Install dependencies — 必要な依存関係をインストールするには、Composerを使用します（画像クレジット：Webデザイナー）

Zipでインストールするとスキップします。ディレクトリを "grav-project"に変更してから、Composerを使用して必要な依存関係をインストールします。

インストールされたら、Grav CLIを使用してテーマとプラグインを取り付けます。 Windowsでは、「PHP」でGravコマンドを追加する必要があります。

 CD緊縛プロジェクト
Composer Install --no-dev -o.
ビン/グラビアインストール

05.インストールをテストします

Get started with Grav CMS: Test the installation — 404を手に入れないようにしてください（画像クレジット：Webデザイナー）

ヴェフは、LOCALHOST / Grav-Projectでアクセスできます。ブラウザでこのページを開くと、Gravのようこそ画面が表示されます。

タイポグラフィページをクリックしてエラーをテストします。 404エラーが発生した場合は、ドキュメントの「Grav」のトラブルシューティングを参照してください。

06.新しいページを追加してください

Get started with Grav CMS: Add a new page — 墓図はテキストファイルとして保存されています（画像クレジット：Webデザイナー）

gravsのページは、ディレクトリ "user / pages"のテキストファイルです。新しいページを作成するには、 "grav-project / user / pagesディレクトリ"に移動し、03.aboutという名前の新しいフォルダを作成してから、default.mdと呼ばれる新しいファイルを作成します。

Gravはページをレンダリングするために「Markdown Syntax」を使用します。

07.管理パネルをインストールします

コンテンツの作成と管理プロセスをスピードアップし、Grav CMの全ユーザーフレンドリーな可能性を解除するために、管理パネルモジュールをインストールできます。コマンドラインから、次のコマンドを実行します。

 PHP BIN / GPM Install Admin

08.管理ユーザーを作成します

Get started with Grav CMS: Create an admin user — 管理モジュールがインストールされていると、管理ユーザーを作成できます。（画像クレジット：Webデザイナー）

Admin Moduleがインストールされていると、Webサイト上のページを更新すると、新しい管理者ユーザーを作成するようにプロンプトが表示されます。詳細を記入して、パスワードをメモしてダッシュボードに進みます。

09.管理インターフェイスで編集

管理パネルのセットアップ上のページをクリックすると、左側のバーのページをクリックしてから、以前に行った概要ページをクリックします。

このロードが読み込まれると、ページの内容を簡単に編集できるコンテンツエントリ領域が表示されます。

10.子ページを追加します

[管理]パネルの[タイポグラフィ]ページを削除してから、置き換えるために新しいページを追加します。

タイトルとフォルダ名のサービスを入力し、次に[続行]をクリックし、残りのオプションをデフォルト値として保存します。このページのコンテンツを入力して[保存]をクリックします。

これで「追加」ボタンで別のページを作成してサービス名を入力します。「見える」が[はい]に設定されていることを確認してから続行します。

11.ホームページをモジュラリングに設定します

Get started with Grav CMS: Set homepage to modular — より複雑なページについては、テンプレートをモジュール式に変更します。（画像クレジット：Webデザイナー）

テキストやヘッダーを簡単にページに追加できるのは、基本的なWebサイトにとって迅速かつ簡単ですが、Webサイトには複雑な要件があることがわかります。ホームページを編集し、[詳細設定]タブで、ページテンプレートをモジュール化するように変更します。必ずページを保存してください。

12.モジュールを追加します

Get started with Grav CMS: Adding a module — ヒーローモジュールを追加しましょう（画像クレジット：Webデザイナー）

モジュールは、異なるスタイルのセクションを含むページを構築するときに使用できるテーマによって設定されたコンテンツブロックです。

ホームページが変換されたので、ホームページの事前に作成されたコンテンツを削除して、変更を保存します。その後、ページの上部にある[]をクリックします 追加＆gt;モジュラを追加します そしてタイトル「ヒーロー」を記入して「ホーム」にページを設定してください。モジュラーテンプレートの場合は、「ヒーロー」オプションを選択してください。

13.ヒーローモジュールを入力します

Get started with Grav CMS: Populate the Hero module — モジュールは彼らの親ページのブロックにレンダリングします（画像クレジット：Webデザイナー）

モジュールは、管理パネルのサブページと同じように扱われますが、サブページを作成する代わりに、それらのコンテンツをそれらの親ページのブロックにレンダリングします。新しく作成されたヒーローモジュールを編集し、ヘッダーを追加し、テキストを追加し、英雄イメージを「ページメディア」に追加します。ページを保存してください。

14.機能モジュールを追加します

上記のステップを繰り返しますが、機能モジュールを選択します。ページを編集するときは、レイアウトを設定できる「機能」タブに注意して、アイコン、ヘッダー、テキストを持つ個々の列を追加します。これらの列の4つを追加してコンテンツを入力します。

15.テキストブロックを追加します

ホームページの最後のモジュールは標準のコンテンツブロックになります。これを追加して、この領域に目的のコンテンツを入力し、画像を添付してページを保存します。

最後に、親ホームページを含めて、それまでに各ブロックを開き、「詳細」タブに移動して[Body Classes]フィールドを空にすることでCSSクラスを削除します。これらは、各ブロックをカスタマイズできるテーマによって設定されたCSSクラスです。

16.オプションを設定します

サイトのロゴとテーマのオプションの配列を設定するには、「テーマ」メニューに向かい、次にクォーク、現在アクティブなテーマをクリックします。

これらの設定を調整してから、「設定」をクリックして「サイトのタイトル」などのオプションにアクセスします。

この記事はもともとCreative Web Design Magazineの第291号に掲載されました ウェブデザイナー 。 ここで問題291を購入してください 。

関連記事：

ヘッドレスCMSとしてWordPressを使用してください
MO.JSライブラリとのアニメーション化方法
Atomic Designを使用している必要があります

grav cmsから始めましょう

01.ローカル環境を設定します

02.作業ディレクトリを作成します

03.肉のコピーを取り付けます

04.依存関係をインストールします

05.インストールをテストします

06.新しいページを追加してください

07.管理パネルをインストールします

08.管理ユーザーを作成します

09.管理インターフェイスで編集

10.子ページを追加します

11.ホームページをモジュラリングに設定します

12.モジュールを追加します

13.ヒーローモジュールを入力します

14.機能モジュールを追加します

15.テキストブロックを追加します

16.オプションを設定します

操作方法 - 最も人気のある記事

Apple Watch Appを作る方法

角度8の内側は何ですか？

グリッドとFlexboxでブログを構築する

これらのヒントを含むグラファイトからもっとゲットする

欠陥のある組成を修正する方法

5分以内に図を描く

あなたのキャラクターが色と光でポップします

夢のようなファンタジー森林シーンを描く方法

カテゴリ