勉強したことのメモ

Webエンジニア / プログラマが勉強したことのメモ。

HTML / CSSで作成したコンテンツをPDFファイルで出力する方法(TCPDF)

   2025/06/21  PHP CSS HTML

HTML / CSSで作成したコンテンツをPDFファイルで出力させたい。以前mpdfを用いてPDF化する方法をメモったが今回はTCPDFというライブラリを使用してみたかった。以下に対応方法をメモ。

 

TCPDFライブラリに関して

以下よりダウンロードする。

https://github.com/tecnickcom/tcpdf

尚、リファレンスについては非公式かと思われるが以下サイトが参考になった。

http://www.t-net.ne.jp/~cyfis/tcpdf/index.html

http://tcpdf.penlabo.net/

 

ソースコード

<?php
include('./TCPDF/tcpdf.php');

$tcpdf = new TCPDF();
$tcpdf->AddPage();
$tcpdf->SetFont('kozminproregular', '', 10);
$html = <<< EOF
<style>
.fcolor-red{
    color: #f00;
}
</style>
<h1>テスト</h1>
<div class="fcolor-red">赤文字</div>
<img src="./001.jpg" width="50px">
EOF;
$tcpdf->writeHTML($html);
$tcpdf->Output('test.pdf');

 

注意点

HTML / CSSで作成したコンテンツを簡単にPDF化できるもののCSSに関しては制限が多い。そのため出力されるPDFは非常にシンプルなデザインになりがちで業務で使えるかと言われると微妙なところ。

テキストは問題無く表示されるので文章メインのサイトをスクレイピングし、そのデータをPDF化させるとかなら使えるかも。

 - PHP CSS HTML

  関連記事

JavaScriptライブラリChart.jsでグラフの描写する方法
JavaScriptライブラリChart.jsでグラフの描写する方法

JavaScriptでグラフを描写する必要があり、普段はHighchartを使用 ...

JavaScriptにて数値のカウントアップ及びカウントダウンを表示する「countUp.js」ライブラリの利用方法
JavaScriptにて数値のカウントアップ及びカウントダウンを表示する「countUp.js」ライブラリの利用方法

だいぶ前にバニラJSにて数値のカウントアップ及びカウントダウン表示を行う方法をメ ...

JavaScriptでダミー画像(プレースホルダー画像)を表示する「Holder.js」ライブラリの利用方法
JavaScriptでダミー画像(プレースホルダー画像)を表示する「Holder.js」ライブラリの利用方法

サイトの開発段階で「本番用の画像はまだ用意できていない」等の理由によりダミー画像 ...

PHPのHTTPリクエストライブラリ「Requests for PHP」の利用方法
PHPのHTTPリクエストライブラリ「Requests for PHP」の利用方法

PHPで外部のAPI等にリクエストする際に可能であればfile_get_cont ...

HTMXで指定ページ内の指定要素を取得及び出力する方法サンプル
HTMXで指定ページ内の指定要素を取得及び出力する方法サンプル

あるサイトのHTMLタグ内に「hx-〇〇」という見慣れないタグが記述されていた。 ...