サイト作成ツール

Markdown で書いた文書は、pandoc で HTML 文書に変換できますが、ヘッダ部分まで含んだ完全なHTML 文書を作成して、Web サイトにアップロードするまでの工程には少々工夫が必要です。サイト作成に必要なツールはシェルスクリプトで作ります。用意するのは、次のようなツールです。

HTML 文書を作成するためのテンプレート template.md
テンプレートを利用して新しい Markdown 文書を作成するツール ./new
Markdown 文書を HTML 文書に変換する前に w3m でチェックするスクリプト ./vmd
Markdown 文書を HTML 文書に変換するスクリプト ./mk
作成した HTML 文書をアップロード用のディレクトリに送るスクリプト ./send
アップロード用の HTML 文書を Filezilla でウェブサイトにアップロードする

原稿の Markdown 文書や変換した HTML 文書は markdown/simple というディレクトリを作成してその中で作業します。HTML の文書をアップロードするためのディレクトリは public_html/simple というディレクトリを作成してその中に markdown/simple の HTML 文書のみをコピーします。Filezilla でウエブサイトにアップロードするときに余計なファイルをアップロードしないためです。

テンプレート template.md

Markdown では body タグ部分のマークアップだけなので、pandoc で HTML に変換してもその部分だけの不完全な HTML 文書になってしまいます。しかし、Markdowm は HTML のタグはそのまま変換せずに残すので、html タグや head タグの部分を記述したテンプレートを用意すれば、body タグの部分を Markdown で記述すれば、完全な HTML 文書を pandoc (Markdown HTML 変換コマンド）で作成できます。

新しい HTML 文書を作成するときは、このテンプレート template.md をコピーして使います。body タグ内部に Markdown でマークアップを行い、コピーから作成した文書をそのまま pandoc で HTML 文書に変換できます。

このサイトで使うテンプレート template.md は次のようになります。

<!doctype html>
<html lang="ja">
<head>
<title></title>
<meta charset="utf-8">
<style>body {width: 600px; margin: auto;}</style>
</head>
<body>
[目次](index.html)



[戻る](index.html)
</body>
</html>

新しい文書の雛形を作る　new

テンプレートを利用して新しいファイルを作成するシェルスクリプトは new です。次のようにファイル名 foo を引数に実行すると、新規文書の雛形 foo.md が作成されます。

~/markdown/simple$ ./new foo
~/markdown/simple$ ls foo.md
foo.md

new スクリプトのソースは次のようになります。

~/markdown/simple$ cat new
#!/bin/sh

cp template.md $1.md

new スクリプトは次のように chmod コマンドで実行可能にしておく必要があります。

~/markdown/simple$ chmod +x new

Markdown 文書を表示するスクリプト vmd

Markdown 文書を pandoc で HTML 文書に変換する前にレンダリングをチェックしたい場合は多いです。vmd (view md) コマンドは w3m を利用してそれを実現できます。vmd スクリプトの使い方は次のようになります。

~/markdown/simple$ vmd foo.md

vmd スクリプトのソースは次のようになる。

~/markdown/simple$ cat vmd
#!/bin/sh

pandoc $1 | w3m -T text/html

w3m についてはこのサイトの I Love CUI のページで解説しています。標準入力の文字列をレンダリングできるので上のスクリプトのような芸当ができるのです。

Markdown 文書を HTML で変換する。

Markdown 文書を HTML 文書に変換するには次のようにシンプルに pandoc を使います。

~/markdown/simple$ pandoc foo.md > foo.html

しかし、タイプミスで変な動作にならないように、mk スクリプトで定式化すると便利です。mk の引数には foo.md の foo の部分だけを使います。

~/markdown/simple$ ./mk foo

mk スクリプトのソースは次のようになります。

~/markdown/simple$ cat mk
#!/bin/sh

pandoc $1.md > $1.html

HTML ファイルをアップロード用のディレクトリにコピーする send

作業用のディレクトリで作られた HTML をアップロード用のディレクトリに移すスクリプトが send です。.html の拡張子を持つファイルだけをコピーします。使い方は単に ./send コマンドを実行するだけです。

~/markdown/simple$ ./send

send スクリプトのソースは次のようになります。

~/markdown/simple$ cat send
#!/bin/sh

cp *.html ~/mnet/public_html/simple

ファイルのアップロード

最後の工程が HTML 文書のアップロードです。ftp や Filezilla を利用します。ファイルのアップロードの方法については既知のものとしてここでは述べません。

上で紹介した色々なスクリプトはどれも簡単なものです。必要なスクリプトは必要なときに間に合せで作るというシェルスクリプトの手軽さがよく分かります。

戻る