ServBay 環境で Kirby をインストール・設定する

Kirby とは？

Kirby は、柔軟で強力なファイル駆動型コンテンツ管理システム（CMS）で、さまざまなタイプのウェブサイトを構築するのに適しています。Kirby はデータベースに依存せず、ファイルシステムを使用してコンテンツを保存します。これにより、非常に軽量でデプロイが容易になります。

Kirby のインストール手順

この記事では、ServBay 環境で Composer を使用して Kirby 4.2 をインストールし、設定する方法を紹介します。

手順 1: プロジェクトディレクトリを作成する

まず、ServBay の www ディレクトリ内に新しいプロジェクトディレクトリを作成します：

cd /Applications/ServBay/www
mkdir servbay-kirby-app
cd servbay-kirby-app

手順 2: Composer を使用して Kirby プロジェクトを作成する

ServBay はComposer が既にインストールされています、ので Composer を使用して Kirby プロジェクトを直接作成できます：

composer create-project getkirby/starterkit .

手順 3: Web サーバの設定

1. 新しいサイトを追加する

   ServBay を開き、「ホスト」タブをクリックし、新しいウェブサイトを追加します：

   • 名前：My Kirby Site
   • ドメイン：servbay-kirby.local
   • サイトタイプ：PHP
   • PHP バージョン：8.2
   • サイトのルートディレクトリ：/Applications/ServBay/www/servbay-kirby-app

2. 設定を保存する

   設定を保存します。

手順 4: Kirby の設定

1. コンテンツディレクトリを作成する

   プロジェクトのルートディレクトリには、content ディレクトリが Kirby Starterkit によって既に作成されています。

手順 5: Kirby を実行する

1. Kirby にアクセスする

   ブラウザを開き、https://servbay-kirby.local にアクセスすると、Kirby のデフォルトのウェルカムページが表示されます。

手順 6: Kirby パネルをインストールする（オプション）

Kirby の管理パネルを使用したい場合は、以下の手順でインストールを行います：

1. Kirby パネルにアクセスする

   ブラウザを開き、https://servbay-kirby.local/panel にアクセスすると、Kirby パネルのインストールページが表示されます。

2. 管理者アカウントを作成する

   ページの指示に従って管理者アカウントを作成し、ユーザー名、パスワード、メールアドレスを入力して「アカウントを作成」ボタンをクリックします。

Kirby を使ってウェブサイトを構築する

これで、Kirby が ServBay 環境に正常にインストール・設定されましたので、ウェブサイトの構築を開始できます。以下はいくつかの一般的な操作です：

ページとコンテンツを作成する

1. ページを作成する

   content ディレクトリ内に新しいページディレクトリを作成します。例えば、about ページを作成する場合：

   mkdir content/about
   echo "Title: About Us\n----\nThis is the about page." > content/about/about.txt

2. テンプレートを編集する

   site/templates ディレクトリ内にテンプレートファイルを作成または編集します。例えば、about.php テンプレートを作成します：

   <!-- site/templates/about.php -->
   <h1><?= $page->title() ?></h1>
   <p><?= $page->text() ?></p>

ナビゲーションメニューを設定する

1. テンプレートを編集する

   site/templates ディレクトリ内のメインテンプレートファイル（例えば default.php）を編集してナビゲーションメニューを追加します：

   <!-- site/templates/default.php -->
   <nav>
     <ul>
       <?php foreach ($site->children()->listed() as $item): ?>
         <li>
           <a href="<?= $item->url() ?>"><?= $item->title() ?></a>
         </li>
       <?php endforeach ?>
     </ul>
   </nav>

スタイルとスクリプトをカスタマイズする

1. スタイルを追加する

   assets/css ディレクトリに CSS ファイルを作成し、テンプレートファイルでそれを参照します。例えば、style.css を作成します：

   /* assets/css/style.css */
   body {
     font-family: Arial, sans-serif;
   }

   テンプレートファイルで CSS ファイルを参照します：

   <!-- site/templates/default.php -->
   <link rel="stylesheet" href="<?= url('assets/css/style.css') ?>">

2. スクリプトを追加する

   assets/js ディレクトリに JavaScript ファイルを作成し、テンプレートファイルでそれを参照します。例えば、script.js を作成します：

   // assets/js/script.js
   document.addEventListener('DOMContentLoaded', function() {
     console.log('Hello, Kirby!');
   });

   テンプレートファイルで JavaScript ファイルを参照します：

   <!-- site/templates/default.php -->
   <script src="<?= url('assets/js/script.js') ?>"></script>

以上の手順を完了すると、ServBay 環境で Kirby をインストールし設定でき、ウェブサイトの構築を開始できます。Kirby の柔軟性とファイル駆動のアーキテクチャは、さまざまな種類のウェブサイトを構築するための理想的な選択肢です。