正直作業記録です。
あまり役に立つことは無いかもしれません。
はじめに
個人的にちょっとしたサイトを作りたくなり*1、Markdownを扱えるフラットファイルCMSを探してみたところ、Grav CMSが良さそうだったので試してみることにしました。
CMSには特段詳しくないでですが、今回Gravを選定した理由としては、
- Markdownを扱える(必須)
- フラットファイル型である(必須)
- コードのシンタックスハイライトができるプラグインがある(必須)
- 公開されているテーマのデザインが良い
- 特にLearn2テーマが作りたいサイトにぴったりだったので
あたりになります。
今回はとりあえずローカル環境(Windows 10)で動かすところまでやってみます。
Grav CMSを試してみる
1. PHPのインストール
GravはPHP製ですので、まずはPHPをインストールします。
現在のバージョン(Ver.1.1.17)ではPHP 5.5.9以上が必要です。
いまのところバージョンの縛りもありませんので、私は最新のPHP 7.1.2を使うことにします。
公式サイトからPHP 7.1.2をダウンロードし、適当なディレクトリに展開します。
今回はC:\PHP\7.1.2\
に展開しました。
あとはこのディレクトリにPATHを通せばOKです。
私はPHPを常用しないので必要な時だけPATHを通すことにしました。
# PHPのインストール Invoke-WebRequest -Uri "http://windows.php.net/downloads/releases/php-7.1.2-Win32-VC14-x64.zip" -OutFile ".\php-7.1.2-Win32-VC14-x64.zip" Expand-Archive ".\php-7.1.2-Win32-VC14-x64.zip" -DestinationPath "C:\PHP\7.1.2\" # PHPは常用しないので利用時だけPATHを通すことにする $env:PATH += ";C:\PHP\7.1.2\"
また、環境によってはVC14 Runtimeのインストールが必要になりますので、必要があればインストールしてください。
2. php.iniの設定
Gravでは以下の拡張機能を使用するため、php.ini
の設定が必要です。
- gd
- mbstring
- curl
- openssl
今回はとりあえずphp.ini-development
をコピーし、以下の箇所を修正しました。
; php.ini ; extension_dirのコメントを解除 extension_dir = "ext" ; 以下の拡張のコメントを解除し有効化 extension=php_curl.dll extension=php_gd2.dll extension=php_mbstring.dll extension=php_openssl.dll
3. Gravのインストールと起動
GravのインストールはZipをダウンロードして展開するだけです。
コア機能のGRAV CORE
と管理者用UIのついたGRAV CORE + ADMIN PLUGIN
の二種類選べますが、今回はGRAV CORE
にします。
# 別に手動で解凍しても構いませんが折角なので... Invoke-WebRequest -Uri "https://getgrav.org/download/core/grav/1.1.17"-OutFile ".\grav-v1.1.17.zip" Expand-Archive ".\grav-v1.1.17.zip" -DestinationPath ".\grav-v1.1.17"
今回はPHPのビルトインウェブサーバーを使ってGravを起動します。
先ほどのZipを展開したフォルダに移動し
php -S localhost:[ポート番号] system/router.php
を実行すればOKです。
実行例)
cd ".\grav-v1.1.17\grav\" php -S localhost:8000 system/router.php
実行結果はこんな感じ。
この状態でhttp://localhost:8000/
にアクセスすると以下の様になります。
ちなみに設定にエラーがあると以下の様になり、エラーを教えてくれます。
(これはgd拡張を有効にするのを忘れていた際に出たエラーです)
これでGravのインストールは完了です。
あとは\user\
配下の各設定を修正すれば自分の好きなサイトを作ることが出来ます。
コンテンツを修正するだけなら\user\pages\
配下のmarkdownを修正するだけでOKです。
4. プラグインのインストール
Gravではプラグインを追加することで必要な機能を追加することができます。
私の作りたいサイトではコードのシンタックスハイライトが必須なので、この機能を提供してくれるPrism Highlighterプラグインをインストールします。
Gravをインストールしたフォルダの\bin\
フォルダに管理用のCLIコマンドが用意されており、このコマンドを使うことでプラグインをインストールすることができます。
プラグインをインストールするコマンドの書式は以下となります。
bin/gpm install pluginname
今回はWindows環境なのでShebangが使えないのため都度phpコマンドから呼び出す必要があり、Prism Highlighterをインストールするには以下の様にします。
php .\bin\gpm install prism-highlight
ここまで書いておいてアレなのですが、Prism Highlighterはこのコマンドからのインストールに対応していないそうで、実際にこのコマンドを使うと処理自体は完了するのですが、作成されるフォルダ名が不正になってしまします。
このため、以下の様にフォルダをリネームする必要があります。
# プラグインのフォルダ名がおかしいので直す mv .\user\plugins\prism-highlight\ .\user\plugins\prism
Prism Highlighterはgit clone
でインストールするのが正しいやり方だそうです。
# git cloneでPrism Highlighterをインストール cd .\user\plugins\ git clone https://github.com/alvr/grav-prism-highlight.git prism
Prism Highlighterの細かい設定については割愛しますが、インストールした結果は以下の様になり良い感じにコードのハイライトが有効になっています。
5. テーマをインストールする
最後にテーマをインストールします。
プラグイン同様テーマもコマンドからインストールします。
Learn2テーマをインストールするには以下の様にします。
また、
php .\bin\gpm install learn2
テーマをインストールした後はsystem.yaml
(\user\config\system.yaml
のほう)を修正することでテーマを変更します。
pages->theme
の設定をデフォルトのantimatter
からlearn2
に変えればOKです。
# system.yaml pages: theme: learn2
これでテーマの変更は完了です。
learn2
テーマは他のテーマとドキュメントの構造が異なるため、デフォルト設定であるdefault.md
ファイルのままだと表示エラーになりますのでドキュメントの名称をchapter.md
かdocs.md
にして適宜対応してください。
こちらも細かい設定については割愛しますが適用した結果は以下の様になります。
最後に
とりあえずこんな感じです。
今回はローカルの環境でとりあえず動かすところだけやりましたが、Gravの設定や運用環境への展開については公式ブログのチュートリアルを参考にするのが良さそうです。
ちなみにAzureへの展開についてはしばやん先生のブログがとてもわかりやすく参考になります。
*1:つくるサイトについては具体的な形になったらお知らせしたいですね...