granshe.HTMLやCSS、JavaScriptに関する話題を中心に、Web制作について知ったこと、覚えておきたいことをメモしておく個人的スペースです。ないブログに表示されています。新しい記事を書く事で広告が消えます。(Fri)Markdownで記事を書く、データベース不要のCMS、Picoを使ってみただいぶご無沙汰しておりました。久しぶりに自分のブログを見に行ったら広告が出現していて震えました。前回から3ヶ月も経っていたとは。激務に激務を重ね、ようやく落ち着いてきたので、広告消すためにも記事を。案件が落ち着いてきたというのもあり、今までまわりになかった技術に手を出すようになり始めました。Text2を使ってみたり、Emmetをつついてみたり。Markdownについても最近触れる機会が多く。そんなときに、Markdownでコンテンツを記述する、データベース不要のCMS『Pico』なるものを見つけたので、今回ご紹介いたします(通販風)。Picoとは本家サイトはこちらです。→Picoすっげえシンプルで、(DBを使わないので)表示がめっちゃ早いCMS。Webを簡単に作れるぜ!(超意訳)とのこと。特長は、データベースがなく、テキストをマークダウン形式で書くところ。ヘッダーとフッターとサイドナビをPHPで自動で付与します。URLのルールとかはPico本家のドキュメントを見てください(割愛)。ファイルはマークダウン形式(拡張子は「.md」)で生成して、直接サーバ上に置きます。簡単にファイルを作成できるプラグインは後ほどご紹介します。あ、データベースは必要ありませんが、PHPは必要です。5.2.4以上のバージョンが必要です。自分は、Twitterでお気に入り登録した記事が埋もれて探せなくなるのを救出するために、まとめリンク集をためしに作ってみました。(まだ調整中ですがフライングで導入方法1.ダウンロードPicoダウンロードページから、Downloadボタンを押してファイルを取ってきます。このタイミングで、同時にプラグインも落としました。Picoプラグインページから、お好みのプラグインを取ってきます。自分はあまりRSSに興味がなかったので(ブログとして使う想定ではないので)RSSは除き、それ以外の二つはダウンロードしました。以降は、上記プラグインをダウンロードした前提で話が進みます(汗)。5.2.4以上がサーバにインストールされている必要があります。PHPのバージョンを確認したら、Pico-masterの中身をお好きなディレクトリにアップします。ダウンロードしたプラグインは、Pico本体の「/plugins/」ディレクトリの中に入れてください。Editorというプラグインは、入れるとWeb上でMarkdown形式で記事を記載&プレビューでき、自動でファイルを保存してくれるのでぜひ入れることをオススメします。Editorをダウンロードしたら、フォルダ内にある「pico_editor_config.php」を開きます。任意のパスワードを設定してください。(何でもかまいません。)パスワードはそのまま指定するのではなく、ジェネレータで変換したものを入れてください。パスワードの設定が終わったら、Pico本体のpluginsディレクトリの中にアップします。入力すると、ログイン画面が開きます。先ほど設定したパスワードを入力して、ログインします。ログインすると、デフォルトのファイルが3つほど表示されていると思います。何度か試してみたのですが、どうもこのエディタは、エディタ上で作られてないファイルは編集も削除も出来ないようです。デフォルトのファイルに関しては、エディタからではなく、サーバ側から直接削除します。ファイルを削除し、Pico本体の「/content/」フォルダの直下に入っている「index.md」をテキストエディタで編集してトップページを作りました。4.サイトの設定サイトのタイトルを編集するには、Pico本体のルートフォルダにある「config.php」を修正します。'Pico';をコメントの外に出して調整します。'ディレクトリ名'を指定してください。アクセスし、ログインして記事投稿画面に遷移します。画面の左側上部にある「+」マークでページを追加します。ページ追加のコツですが、2点あります。titleの画面では、ファイル名(英数字)を入力すること。新規作成すると、テキスト内にコメントで「Title:」と入っている部分があるので、そのファイル名を日本語に変更する。すると、ディレクトリ名は英数字になり、サイト内のメニューとしては日本語が表記されるようになります。エディタの右下に「目のマーク」があるのですが、これを押すとマークダウンされたものが簡易的にプレビューされます。文字を入力していると、画面右上に「Saved」というアイコンが出ますが、このエディタでは情報はリアルタイムにセーブされます。「セーブしてないからデータ消えるよ?いいの?(実際は英語)」とアラートが出るので、キャンセルを押して、しばらく待つか、適当に文字を入力してみるか、「目のマーク」を押してプレビューしていると「Saved」が出るので、セーブされたことを確認して別のページに移動してください。セーブまでには若干のタイムラグがあります。「/content/」ディレクトリ配下にFTPでファイルをアップロードすれば、ページを作ることは可能です。一度セッティングが終わって使い慣れれば、かなり楽です。自分が主につまづいたポイントを整理します。アップロードしたけど、トップページが表示されない。→PHPのバージョンが足りていなかった。Editorで記事が編集できない。Editorで作成したファイルでないと、編集が出来ないようです。(デフォルトで入っているファイルは編集できない)Markdownの記法を忘れた。おためしくださいませ。某Web製作会社の入社5年目のマークアップエンジニア。専門はHTMLとCSSとMT(自称)。