adbird(広告鳥) 備忘録

Ubuntuでも年賀状の宛名作成(md→pdf 編)

以前、 html + css で年賀状の宛名書き(Ubuntuで年賀状宛名書き) という記事を書いたけど、ごちゃごちゃしたhtmlタグの中に書いていったり、住所の数字を漢数字で書いていくのがスマートじゃないなぁ…と思っていた。

そこで、最近の僕の中での流行りである、markdown(pandoc拡張markdown) → html → pdf で作れないかと試行錯誤して、ようやくできるようになった。
しかも、年賀状を出した人/喪中等で出さなかった人の一覧表まで同時に作れるようにした。

重たいソフトは入らない。cssシェルスクリプト、md(マークダウン)、全部テキストエディタで編集できるよ!

環境、必要なツール・フォント

以下、Ubuntuのレポジトリに入っている場合もあるが、レポジトリのものはヴァージョンが古かったりするなどしてうまくいかないこともあるので注意が必要。また、それぞれのツールがヴァージョンアップするとやっぱりうまくいかないこともあるので、ご了承を。

フォルダ内の構成

任意のフォルダ内が以下のような構成になるようにする。

任意のフォルダ
 ┃
 ┣ list.css
 ┣ makenenga.sh
 ┣ nenga.css
 ┣ test.md

nenga.css

年賀状の宛名のcss
テキストエディタを開いて、以下をコピペして「nenga.css」として保存。

郵便番号などの位置等を調整したい場合は、これらをいじる。

@page {size:100mm 148mm; margin:0; padding:0;}

body {margin: 0; padding:0;}

.sheet {
    width:100mm; height:148mm;
    margin: 0;
    padding:0;
    position: relative;
    page-break-after: always;
}

#title-block-header{
    display:none;
}

p{
    margin:0;
    padding:0;
    font-family:"IPAmj明朝" ; 
}

.郵便番号 {
    font-family:"IPAmj明朝" ; /* IPAmj明朝で文字間等を調整している */
    font-size:12pt;
    margin:0;
    padding:0;
    position:absolute; top:14mm; left:46mm; /* ズレる場合は調整 */
    letter-spacing: 4.4mm; /* 数字の間隔 */
}

.住所 {
    font-family: "IPAmj明朝"; 
    font-size:14pt;
    margin-left:0px;
    padding-top:0px;
    line-height:1.5em;
    letter-spacing:2pt;
    writing-mode: vertical-rl;
    -webkit-writing-mode: vertical-rl;
    text-orientation: upright;
    -webkit-text-orientation: upright;
    position:absolute; top:30mm; right:10mm;
}

.宛名 p{margin:0 2pt 0 2pt;font-family:"IPAmj明朝" ; }

.宛名 {
    font-family:"IPAmj明朝" ;
    font-size:22pt; 
    letter-spacing: 0.1em;
    position: absolute;
    top: 30%;
    left: 50%;
    -webkit-transform: translateY(-10%) translateX(-50%);
    transform: translateY(-10%) translateX(-50%);
    writing-mode: vertical-rl;
    -webkit-writing-mode: vertical-rl;
    text-orientation: upright;
    -webkit-text-orientation: upright;
    line-height:1.3; /*連名時の行間*/
}

.差出人住所 {
    position:absolute; top:70mm; left:17mm;
    writing-mode: vertical-rl;
    -webkit-writing-mode: vertical-rl;
    text-orientation: upright;
    -webkit-text-orientation: upright;
    font-family:"IPAmj明朝" ;
    font-size:10pt; 
    margin:0;
    padding-left:0.5em;
}

.差出人 {
    position:absolute; top:70mm; left:11mm;
    writing-mode: vertical-rl;
    -webkit-writing-mode: vertical-rl;
    text-orientation: upright;
    -webkit-text-orientation: upright;
    font-family:"IPAmj明朝" ;
    font-size:14pt; 
    letter-spacing: 0.1em;
    margin:0;
    padding-top:0.5em;
}

.差出人郵便番号{
    font-size:10pt;
    font-family:"IPAmj明朝"; /* IPAmj明朝で文字間等を調整している */
    margin:0;
    padding:0;
    position:absolute; top:124mm; left:5.5mm; /* ズレる場合は調整 */
    letter-spacing: 2mm; /* 文字の間隔 */
}

/** For screen preview **/
@media screen {
    body { background: #e0e0e0 }
    .sheet {
    background: white;
    box-shadow: 0 .5mm 2mm rgba(0,0,0,.3);
    margin: 5mm;
    }
}

@media print {
  body {
    width:100mm; height:148mm; /* needed for Chrome */
    }

list.css

一覧表用のcss
同じくテキストエディタを開いて、「list.css」として保存。

body {
  counter-reset: number; 
}
.sheet {
    border-bottom-style: groove;
    border-width: 1px;
    margin:0 0 0 0;
    padding:0 0 10pt 0;
}

#title-block-header{
    display:none;
}

p{
    margin:10pt 0 0 0;
    padding:0;
    font-family:"IPAmj明朝"; 
}

.郵便番号 {
    margin-right:1em;
    font-size:12pt;
    font-family:"IPAmj明朝";
    float: left;
}

.郵便番号:before {
    counter-increment:number;
    content: "(" counter(number) ")〒";
}

.住所 {
    font-size:12pt;
    float: left;
}

.宛名 {
    margin:0 0 0 0;
    font-size:12pt;
    display: block;
    text-align:right;
}

.差出人住所 {display:none;}
.差出人 {display:none;}
.差出人郵便番号{display:none;}

/*改ページ*/
.pagebreak{
    page-break-before:always;
    padding-top:0em;
    text-align: justify;
    text-justify: inter-ideograph;
}

makenenga.sh

シェルスクリプト。コマンド並べただけ。 テキストエディタを開いて、以下をコピペして「makenenga.sh」として保存

ド素人の考えた方法なので、知識・技能のある人から見たら「なんて面倒くさい、非効率なことやっているんだ」と思われそうで、恥ずかしい限りです…(^_^;)。

#!/bin/sh

#ここからは一覧表作成
#mdの別名保存
cp $1.md `date +%Y%m%d-$1一覧`.md
#喪中等で出さなかった人を一覧に表示
sed -i -e 's/<!--NoPost/※以下、今年は出していない。/g' `date +%Y%m%d-$1一覧`.md
sed -i -e 's/NoPost-->//g' `date +%Y%m%d-$1一覧`.md
#htmlに変換
pandoc `date +%Y%m%d-$1一覧`.md -c list.css -s -t html5 -o `date +%Y%m%d-$1一覧`.html
#改行を削除
sed -i -e 's/<br \/>//g' `date +%Y%m%d-$1一覧`.html
#PDF出力
wkhtmltopdf --disable-smart-shrinking --page-size A4 --orientation Landscape --footer-center '[page]/[topage]' --margin-top 20 --margin-left 20 --margin-right 20 --margin-bottom 20 `date +%Y%m%d-$1一覧`.html `date +%Y%m%d-$1一覧`.pdf

#ここからハガキ出力作業
#mdの別名保存
cp $1.md `date +%Y%m%d-$1年賀状`.md
#郵便番号を除く算用数字を漢数字へ。算用数字のままがいいときは、コメントアウトする。
sed -i -e '/[0-9]\{7\}/!y/1234567890*/一二三四五六七八九〇*/' `date +%Y%m%d-$1年賀状`.md
#htmlに変換
pandoc `date +%Y%m%d-$1年賀状`.md -c nenga.css -s -t html5 -f markdown+hard_line_breaks -o `date +%Y%m%d-$1年賀状`.html
#<p></p>ではさむ調整
sed -i -e 's/<span/<p><span/g' `date +%Y%m%d-$1年賀状`.html
sed -i -e 's/<\/span><br \/>/<\/span><\/p>/g' `date +%Y%m%d-$1年賀状`.html
sed -i -e 's/<p><p><span/<p><span/g' `date +%Y%m%d-$1年賀状`.html
#住所の縦棒(ダッシュ)へ置換
sed -i -e '/<\/header>/,/<!--NoPost/ y/-−ー*/―――*/' `date +%Y%m%d-$1年賀状`.html
sed -i -e 's/<!――NoPost/<!--NoPost/g' `date +%Y%m%d-$1年賀状`.html

#PDF出力
google-chrome --headless --print-to-pdf=`date +%Y%m%d-$1年賀状`.pdf `date +%Y%m%d-$1年賀状`.html

#いらない中間ファイルを削除。上手くpdfができないときは、ここをコメントアウトして、htmlソースを見てみる。
rm -f `date +%Y%m%d-$1一覧`.md
rm -f `date +%Y%m%d-$1一覧`.html
rm -f `date +%Y%m%d-$1年賀状`.md
rm -f `date +%Y%m%d-$1年賀状`.html

test.md

テキストエディタを開いて、以下のような書き方で「test.md」を作成していく。
完全にpandoc拡張markdownです…。

最初の「%年賀状」を書かないと、Pandocから「タイトル入れなさい」ってエラーが出るのでちゃんと書く。
数字は半角数字で。

%年賀状

:::::sheet
[1112222]{.郵便番号}
[鹿児島市霧島町11―2]{.住所}
[霧島 太郎 様]{.宛名}
[鹿児島市桜島町111<br />火山ビル101号]{.差出人住所}
[桜島 花子]{.差出人}
[2223333]{.差出人郵便番号}
:::::

:::::sheet
[2223333]{.郵便番号}
[鹿児島市錦江湾町55−1]{.住所}
[金目鯛 次郎 様]{.宛名}
[鹿児島市桜島町111<br />火山ビル101号]{.差出人住所}
[桜島 花子]{.差出人}
[2223333]{.差出人郵便番号}
:::::

<!-- 宛名面に差出人氏名住所を書かないのであれば以下でOK -->

:::::sheet
[3334444]{.郵便番号}
[鹿児島市藺牟田池町22-1<br />白鳥ビル110号]{.住所}
[白鳥 玲子 様]{.宛名}
:::::

<!-- 連名の場合 -->

:::::sheet
[4445555]{.郵便番号}
[鹿児島県鹿児島市桜島町1122-1<br />火山灰マンションあ−100号]{.住所}
[山下 太郎 様
   花子 様
   一郎 様
   次郎 様]{.宛名}
:::::

<!-- 喪中等で今年は出さない場合は、以下の「NoPost」と「NoPost」の行の間に書く。 「NoPost」の行の前後には必ず1行開ける-->

<!--NoPost

:::::sheet
[6667777]{.郵便番号}
[鹿児島市桜島町77-7]{.住所}
[山田 太郎 様]{.宛名}
[]{.差出人住所}
[]{.差出人}
[]{.差出人郵便番号}
:::::

:::::sheet
[7778888]{.郵便番号}
[鹿児島市桜島町88-8]{.住所}
[山田 花子 様]{.宛名}
[]{.差出人住所}
[]{.差出人}
[]{.差出人郵便番号}
:::::

NoPost-->

スクリプト実行

フォルダ内で右クリック > 端末で開く で端末を起動。以下を打ちんでエンターキーを押せば、pdfファイルが2つできているはず。

$ sh makenenga.sh test

ファイル名(test)を入力するときは、拡張子(.md)はいらないので注意。

pdfファイル完成

f:id:adbird:20181221020535p:plain
年賀状宛名面
f:id:adbird:20181221020623p:plain
年賀状一覧