動機

google tasksからタスクリスト壁紙を作成するにて，Macの壁紙に予定表を貼ろうとしましたが難しかった，という話がありました．
運用してみた結果，予定表より標語や心構えを書いたほうが捗りそうだということと，Windowsでやりたいという要求が私から出たため，対応しました．

環境の準備

chocolatey

「Windowsソフトを管理！パッケージ管理システムChocolateyでインストール、アップデートを簡単にする」を参考にしてChocolateyをインストールします．homebrewのwindows版みたいなやつです．

wkhtmltoimageとpandocの導入

choco install wkhtmltopdfとchoco install pandocで入ります．
wkhtmltoimageはwkhtmltopdfに含まれています．
パスが通っていない場合が有るので，その場合は「環境変数の設定 - Windows8の使い方」を参考にして環境変数PATHにwkhtmltoimage.exeとpandoc.exeが含まれるフォルダを登録しておきます．

文章作成

Markdownの編集にはHaroopadが良いのではないかと思います．
以下の様な文章が作成できます．

左が文章，右がMarkdownの適用後です．
いい感じに編集できます．

壁紙作成

1.お好みのCSSを用意します．githubのマークダウンならgit clone https://gist.github.com/2554919.git
2.pandoc -s <作成したマークダウン> -c <お好みのCSS> -o <出力先(html)>
3.wkhtmltoimage --width <画面横解像度> --height <画面縦解像度> <画像化するhtml> <出力画像名(jpg)>

つまり以下のようなbatファイルを作成すれば，ダブルクリックで壁紙が生成されます．

makeImage.bat

pandoc -s <作成したマークダウン> -c <お好みのCSS> -o <出力先(html)>
wkhtmltoimage --width <画面横解像度> --height <画面縦解像度> <画像化するhtml> <出力画像名(jpg)>

これでgithubのマークダウンを適用した場合，結果はこのようになります

見た目を良くする

目標は達成しましたが，あまりテンションが上がらないので以下の画像を背景にしてみます．

まずcssを編集します．まずbodyにbackground-image: url("<背景画像パス>")を加えることで，背景を指定します．
結果は以下です．

背景も文字も黒くて見えねえ！！！！！！！

というわけで文字の見えをhtml+CSSで指定していきます．
まず，pandocの実行オプションに--section-divsを加えます．makeImage.batは以下のようになります．

makeImage.bat

pandoc --section-divs -s <作成したマークダウン> -c <お好みのCSS> -o <出力先(html)>
wkhtmltoimage --width <画面横解像度> --height <画面縦解像度> <画像化するhtml> <出力画像名(jpg)>

これにより，Markdown上での#ごとにまとめられる<div class="level1">が生成されます．
あとは.level1の設定をCSSでしてやれば良いです．以下のものをcssに付け加えました．

.level1 {
  background-color: rgba(255, 255, 255, 0.8);
  border-radius: 30px;
  margin: 20px;
  padding: 10px 40px;
}

結果は以下です．

まあまあ良い感じになったかと思います．
htmlで色々とできるので，君だけの最強の壁紙を作ろう！！！！！！

壁紙に標語を載せる

動機