とあるweb屋の仕事術

10年以上現役のweb製作屋さん。web製作雑務全部やる。

webページ(HTML)をPDF化するなら mPDF が便利。ただし使えるCSSが限定されるから注意。

webページ(HTML)をPDF化するなら mPDF が便利。ただし使えるCSSが限定されるから注意。

「webページ(HTML)をPDF化したい。」

クライアントからそんな相談をされたら mPDF を使いましょう。

 

受託でweb製作をやっていると

このニーズはそこそこ多くて

何回か要望いただいたことがあります。

 

とはいえPDF化するのも簡単ではありません。

要望を詳しくヒアリングすると、

 

  • 社内資料用に印刷して確認したい
  • スポンサーに確認依頼を出すのに使いたい
  • ユーザから印刷できないと問い合わせが来た
  • 見積りや請求書など業務ツール系の画面をそのまま印刷したい

 

などが多いです。

 

PDFにする必要があるかどうかはしっかりと

ヒアリングして判断しましょう。

 

単にwebページを見た目どおりに

印刷したいだけであれば、

スクリーンショットを撮る方法を

教えてあげればそれだけでよかったりします。

 

スクリーンショットの方法について詳しく解説されている

下記のページを案内すれば良いと思います。

requlog.com

 

さて、本題。

スクリーンショットではなく、やはりPDFにしたいと

いう場合は、mPDF というライブラリを使用して

PDF化するのが簡単かなと思います。

 

わかりやすく解説されているのがこちら。

gray-code.com

 

具体的なソースの解説もあり参考になります。

実際にクライアントワークで実務で使用してみたところ

問題ありませんでした。

ただ、実装時にCSSでハマりました。

 

PDF用にHTMLとCSSを別に用意するのですが、

レガシーなものしか利用できず、HTML5のタグや

CSS3などのモダンなプロパティは効かないという

罠があります。

なので、少しHTML/CSS組みは工夫が必要で

工数も少しかかるといった感じでした。

 

mPDF でサポートされているHTMLタグ、CSSはこちら。

Supported CSS – CSS & Stylesheets – mPDF Manual

 

mPDFの公式リファレンス、仕様は以下になります。

参考まで。

mpdf.github.io