以前、VS CodeでMarkdownをPDFに自動で変換する方法を書いたのだけど、今度はHTMLファイルに変換する必要が出てきたので勉強がてら、Pythonで書くことにしました。と言っても難しい処理では全然ないんだけど・・・_(┐「ε:)_
ちなみに、前の記事で紹介した拡張機能Markdown PDFを使えばHTMLにも変換できます。ただ、今回はVS Codeがないというシチュエーションでファイル変換したいのと、自分が作成したスタイルシートでHTMLファイルを生成したかったため、VS Codeの拡張機能を頼らない方法を取りました。
というわけで、Pythonを使ったMarkdownファイルをHTMLへ変換する手順について書きます。
こちらにソースコード一式を置いてあります。
Markdownは事前にpip
しておく。
pip install Markdown
一応プラットフォームに関しては、MacやWindowsに限らず動作する・・・はず_(┐「ε:)_
フォルダ中に存在するmdファイルを取得して、HTMLファイルに変換します。
mdtohtml.py
Pythonで記述された本体。実行の際は当ファイルを指定します。
style.css
CSSが書かれたファイル。生成されたHTMLファイルに<style>
タグで記述されます。スタイルの変更を行いたい場合、当ファイルを書き換えてHTMLを生成してください。
変換したいmdファイルがあるフォルダに上記の2ファイルを配置します。
$ ls
README.md iamacat.md main.css mdtohtml.py
配置したら、そのフォルダにて下記のコマンドを実行します。
$ python mdtohtml.py
iamacat.md の変換を開始します
-----------------------------------
iamacat.md を iamacat.html へ変換しました
README.md の変換を開始します
-----------------------------------
README.md を README.html へ変換しました
$ ls
README.html README.md iamacat.html iamacat.md main.css mdtohtml.py
実行されたフォルダ中に存在するmdファイルを取得して、HTMLファイルに変換して同じフォルダーに出力します。mdファイルが複数ある場合は、すべてHTML化します。
基本的には、HTML化はMarkdownに丸投げしています。丸投げした後、必要な<html>
タグなどを付与しているだけです。
import markdown
import re
import glob
# Markdown拡張
mdextensions = ["tables"]
# mdファイルの変換
def convertHtml(mdpath, htmlpath, style):
with open(mdpath, 'rt', encoding="utf-8") as f:
text = f.read()
# Markdown の import 文を除去
text = re.sub('@import ".+"\n', '', text)
# HTMLに変換
body = markdown.Markdown(extensions=mdextensions).convert(text)
html = '<html lang="ja"><meta charset="utf-8">'
html += '<style>' + style + '</style>'
html += '<body>' + body + '</body></html>'
# HTMLで出力
with open((htmlpath), "w", encoding="utf-8") as g:
g.write(html)
if __name__ == '__main__':
# スタイルは、style.cssを参照する
with open('./style.css', 'rt', encoding="utf-8") as f:
style = f.read()
for mdfile in glob.glob("*.md"):
print("%s の変換を開始します" % mdfile)
htmlname = re.sub(r'.md$', '.html', mdfile)
convertHtml(mdfile, htmlname, style)
print("-----------------------------------")
print("%s を %s へ変換しました" % (mdfile, htmlname))
途中のstyle.css
は任意のスタイルを記述したファイルを、pyファイルと同じフォルダに格納しておきます。
なお、style.cssの内容はとりあえず下記の内容を記述しています。用途に応じて、追記したり別のcssファイルに置き換えてもらえればいいかと思います。
body {
font-family: "Hiragino Kaku Gothic Pro",sans-serif;
font-size: 14px;
padding: 0 12px;
line-height: 23px;
}
img {
max-width: 100%;
max-height: 100%;
}
hr {
border: 0;
height: 2px;
border-bottom-width: 2px;
border-bottom-style: dotted;
}
h1 {
padding-bottom: 0.4em;
line-height: 1.2;
border-bottom-width: 1px;
border-bottom-style: solid;
}
h1, h2, h3, h4, h5, h6 {
font-weight: normal;
}