# dompdf加入浮水印與頁碼
###### tags: `PHP`,`dompdf`,`浮水印`,`頁碼`
## 需求
加入浮水印，
浮水印圖片要置中，
從第二位開始加入頁碼
發現一篇文章，
[Dompdf Create Watermark and Page Numbers](https://www.codesenior.com/en/tutorial/Dompdf--Create-Watermark-and-Page-Numbers)
大多功能已實現，
將會以此來修改成我要的
## 經驗談與問題
- dompdf設定要注意先後順序
- page_text()方法適用於所有頁面，但請注意頁面從零開始。
- 如果你想忽略第一頁，你應該使用æ ,$canvas->page_script() 方法。
- 如上例所示，$PAGE_NUM可通過page_script()方法訪問變量。
- set_opacity() 方法具有第二個參數，用於將不透明度應用於所有頁面或單個頁面。
- $canvas->image('圖片位置', x,y,w,h) 不明原因首次顯示會在第三頁??
## 最終版
經過多次修改後的最後版本，
完美符合我要的浮水印與頁碼，
```php=
$dompdf = new Dompdf();
$options =$dompdf->getOptions();
$options->setIsPhpEnabled(true);
$options->setIsRemoteEnabled(true);
// $options->setIsHtml5ParserEnabled(true);
$dompdf->setOptions($options);
$dompdf->loadHtml($html);
$dompdf->setPaper('A4', '');
$dompdf->render();
// Instantiate canvas instance
$canvas = $dompdf->getCanvas();
$canvas->set_opacity(.3,'Multiply'); // 初始透明度
$w = $canvas->get_width();
$h = $canvas->get_height();
// 圖片浮水印參數
$watermarkImg = 'lightedu1-min.png';
$watermarkSize = 500;
$watermarkX = ($w - $watermarkSize)/2;
$watermarkY = ($h - $watermarkSize)/2;
// 頁面script
$canvas->page_script('
if ($PAGE_NUM > 1) {
// 頁碼
$current_page = $PAGE_NUM-1;
$font = $fontMetrics->getFont("times", "normal");
$pdf->set_opacity(1,"Multiply"); // 頁碼不需要透明度，暫時不透明
$pdf->text(297.64, 791.89, "$current_page", $font, 10, array(0,0,0));
}
if ($PAGE_NUM >= 1) {
// 浮水印
$watermarkImage="'.$watermarkImg.'";
$watermarkX='.$watermarkX.';
$watermarkY='.$watermarkY.';
$watermarkSize="'.$watermarkSize.'";
$pdf->set_opacity(0.5,"Multiply");
$pdf->image($watermarkImage , $watermarkX , $watermarkY, $watermarkSize, $watermarkSize);
}'
);
file_put_contents('test.pdf', $dompdf->output());
```
## 編輯細節
### 原始範例
[Dompdf Create Watermark and Page Numbers](https://www.codesenior.com/en/tutorial/Dompdf--Create-Watermark-and-Page-Numbers)
已實現
插入文字浮水印
插入圖片
加入頁碼
```php=
use Dompdf\Dompdf;
use Dompdf\FontMetrics;
use Dompdf\Options;
$options = new Options();
$options->set('isPhpEnabled', 'true');
$dompdf = new Dompdf($options);
$dompdf->setOptions($options);
$dompdf->loadHtml('<html>....');
$dompdf->setPaper('A4', '');
$dompdf->render();
// Instantiate canvas instance
$canvas = $dompdf->getCanvas();
$w = $canvas->get_width();
$h = $canvas->get_height();
$pageNumberWidth = $w / 2;
$pageNumberHeight = $h - 50;
$GLOBALS["logo1"]=public_path('images/logo/icon.png');
$GLOBALS["logo2"]=public_path('images/logo/kultur_logo.png');
$canvas->page_script('
if ($PAGE_NUM > 1) {
$current_page = $PAGE_NUM-1;
$total_pages = $PAGE_COUNT-1;
$font = $fontMetrics->getFont("times", "normal");
$pdf->set_opacity(1,"Multiply");
$pdf->text(297.64, 791.89, "$current_page / $total_pages", $font, 10, array(0,0,0));
$pdf->set_opacity(0.2,"Multiply");
$pdf->image($GLOBALS["logo1"], 475.28, 771.89, 50, 50);
$pdf->image($GLOBALS["logo2"], 75.28, 771.89, 50, 50);
}
');
$canvas->set_opacity(.1,'Multiply');//Multiply means apply to all pages.
// Specify watermark text
$text = "http://www.codesenior.com";
// Instantiate font metrics class
$fontMetrics = new FontMetrics($canvas, $options);
$font = $fontMetrics->getFont('times');
$txtHeight = $fontMetrics->getFontHeight($font, 150);
$textWidth = $fontMetrics->getTextWidth($text, $font, 40);
$x = (($w-$textWidth)/2);
$y = (($h-$txtHeight)/2);
//page_text method applies text to all pages.
$canvas->page_text($x, $y, $text, $font, 40,$color = array(255,0,0),
$word_space = 0.0, $char_space = 0.0, $angle = 20.0);
return $dompdf->stream($project->code . '.pdf', array("Attachment" => 0));
```
### 改版1
參考原本改成我需要的
但遇到一個問題
文字浮水印可以從第一頁就出現
但圖片浮水印卻從第三頁開始出現
若拿掉頁碼那段反而會從第四頁開始出現
那麼只好把圖片浮水印放到page_script中
見改版2
```php=
use Dompdf\Dompdf;
use Dompdf\FontMetrics;
use Dompdf\Options;
$dompdf = new Dompdf();
$options =$dompdf->getOptions();
$options->setIsPhpEnabled(true);
$options->setIsRemoteEnabled(true);
$options->setIsHtml5ParserEnabled(true);
$dompdf->setOptions($options);
$dompdf->loadHtml($html);
$dompdf->setPaper('A4', '');
$dompdf->render();
// Instantiate canvas instance
$canvas = $dompdf->getCanvas();
$w = $canvas->get_width();
$h = $canvas->get_height();
// 頁碼
$pageNumberWidth = $w / 2;
$pageNumberHeight = $h - 50;
$canvas->page_script('
if ($PAGE_NUM > 1) {
$current_page = $PAGE_NUM-1;
$total_pages = $PAGE_COUNT-1;
$font = $fontMetrics->getFont("times", "normal");
$pdf->set_opacity(1,"Multiply"); // 頁碼不需要透明度，暫時不透明
$pdf->text(297.64, 791.89, "$current_page", $font, 10, array(0,0,0));
$pdf->set_opacity(0.3,"Multiply"); // 還原透明度
}
');
// 浮水印
$canvas->set_opacity(.3,'Multiply');
// 文字浮水印
$fontMetrics = new FontMetrics($canvas, $options);
$font = $fontMetrics->getFont("tw-kai", "normal");
$canvas->page_text(0, 0, '文字浮水印', $font, 40,$color = array(255,0,0),
$word_space = 0.0, $char_space = 0.0, $angle = 20.0);
// 圖片浮水印
// $canvas->set_opacity(.5,'Multiply'); // 因為圖片本身就很淡，不要再刷淡太多
$watermarkImg = 'lightedu1-min.png';
$watermarkSize = 500;
$watermarkX = ($w - $watermarkSize)/2;
$watermarkY = ($h - $watermarkSize)/2;
$canvas->image($watermarkImg , $watermarkX , $watermarkY, $watermarkSize, $watermarkSize);
// $canvas->page_text($width/3 , $height/3, $watermark, $font = 'tw-kai', $size = 70, $color = array(0,0,0), $wordSpace = 2, $charSpace = 2);
file_put_contents('test.pdf', $dompdf->output());
$dompdf = new Dompdf();
$options =$dompdf->getOptions();
$options->setIsPhpEnabled(true);
$options->setIsRemoteEnabled(true);
$options->setIsHtml5ParserEnabled(true);
$dompdf->setOptions($options);
$dompdf->loadHtml($html);
$dompdf->setPaper('A4', '');
$dompdf->render();
// Instantiate canvas instance
$canvas = $dompdf->getCanvas();
$w = $canvas->get_width();
$h = $canvas->get_height();
// 頁碼
$pageNumberWidth = $w / 2;
$pageNumberHeight = $h - 50;
$canvas->page_script('
if ($PAGE_NUM > 1) {
$current_page = $PAGE_NUM-1;
$total_pages = $PAGE_COUNT-1;
$font = $fontMetrics->getFont("times", "normal");
$pdf->set_opacity(1,"Multiply"); // 頁碼不需要透明度，暫時不透明
$pdf->text(297.64, 791.89, "$current_page", $font, 10, array(0,0,0));
$pdf->set_opacity(0.5,"Multiply"); // 還原透明度
}
');
// 浮水印
$canvas->set_opacity(.5,'Multiply');
// 文字浮水印
$fontMetrics = new FontMetrics($canvas, $options);
$font = $fontMetrics->getFont("tw-kai", "normal");
$watermarkText = '文字浮水印';
$canvas->page_text(0, 0, $watermarkText, $font, 40,$color = array(255,0,0),
$word_space = 0.0, $char_space = 0.0, $angle = 20.0);
// 圖片浮水印
$watermarkImg = 'lightedu1-min.png';
$watermarkSize = 500;
$watermarkX = ($w - $watermarkSize)/2;
$watermarkY = ($h - $watermarkSize)/2;
$canvas->image($watermarkImg , $watermarkX , $watermarkY, $watermarkSize, $watermarkSize);
// $canvas->page_text($width/3 , $height/3, $watermark, $font = 'tw-kai', $size = 70, $color = array(0,0,0), $wordSpace = 2, $charSpace = 2);
file_put_contents('test.pdf', $dompdf->output());
```
### 改版2
```
$dompdf = new Dompdf();
$options =$dompdf->getOptions();
$options->setIsPhpEnabled(true);
$options->setIsRemoteEnabled(true);
$options->setIsHtml5ParserEnabled(true);
$dompdf->setOptions($options);
$dompdf->loadHtml($html);
$dompdf->setPaper('A4', '');
$dompdf->render();
// Instantiate canvas instance
$canvas = $dompdf->getCanvas();
$canvas->set_opacity(.3,'Multiply');
$fontMetrics = new FontMetrics($canvas, $options);
$w = $canvas->get_width();
$h = $canvas->get_height();
// 圖片浮水印
$watermarkImg = 'lightedu1-min.png';
$watermarkSize = 500;
$watermarkX = ($w - $watermarkSize)/2;
$watermarkY = ($h - $watermarkSize)/2;
$canvas->image($watermarkImg , $watermarkX , $watermarkY, $watermarkSize, $watermarkSize);
$part_script_watermark = "\$pdf->image('$watermarkImg' , $watermarkX , $watermarkY, $watermarkSize, $watermarkSize);";
// 頁碼
$pageNumberWidth = $w / 2;
$pageNumberHeight = $h - 50;
$part_script_pageNumber =
'if ($PAGE_NUM > 1) {
$current_page = $PAGE_NUM-1;
$total_pages = $PAGE_COUNT-1;
$font = $fontMetrics->getFont("times", "normal");
$pdf->set_opacity(1,"Multiply"); // 頁碼不需要透明度，暫時不透明
$pdf->text(297.64, 791.89, "$current_page", $font, 10, array(0,0,0));
$pdf->set_opacity(0.3,"Multiply"); // 還原透明度
}
';
$canvas->page_script(
$part_script_watermark.
$part_script_pageNumber
);
```
前三頁的浮水印跑道最上層，把所有文字都蓋掉了@@
那跟頁碼一起產生好了...
那就首頁沒有浮水印，
再想是否與`if ($PAGE_NUM > 1)`有關係
### 改版3
將浮水印的條建設為頁大於等於0才產生`if ($PAGE_NUM >= 0)`
```php=
$dompdf = new Dompdf();
$options =$dompdf->getOptions();
$options->setIsPhpEnabled(true);
$options->setIsRemoteEnabled(true);
$options->setIsHtml5ParserEnabled(true);
$dompdf->setOptions($options);
$dompdf->loadHtml($html);
$dompdf->setPaper('A4', '');
$dompdf->render();
// Instantiate canvas instance
$canvas = $dompdf->getCanvas();
$canvas->set_opacity(.3,'Multiply');
$fontMetrics = new FontMetrics($canvas, $options);
$w = $canvas->get_width();
$h = $canvas->get_height();
// 圖片浮水印
$watermarkImg = 'lightedu1-min.png';
$watermarkSize = 500;
$watermarkX = ($w - $watermarkSize)/2;
$watermarkY = ($h - $watermarkSize)/2;
$part_script_watermark =
'$watermarkX='.$watermarkX.';'.
'$watermarkY='.$watermarkY.';'.
'$watermarkSize="'.$watermarkSize.'";'.
'if ($PAGE_NUM > 0) {
$pdf->set_opacity(0.5,"Multiply");
$pdf->image("lightedu1-min.png" , $watermarkX , $watermarkY, $watermarkSize, $watermarkSize);
}
';
// 頁碼
$part_script_pageNumber =
'if ($PAGE_NUM > 1) {
$current_page = $PAGE_NUM-1;
$total_pages = $PAGE_COUNT-1;
$font = $fontMetrics->getFont("times", "normal");
$pdf->set_opacity(1,"Multiply"); // 頁碼不需要透明度，暫時不透明
$pdf->text(297.64, 791.89, "$current_page", $font, 10, array(0,0,0));
}
';
// 頁面script
$canvas->page_script(
$part_script_watermark.
$part_script_pageNumber
);
file_put_contents('test.pdf', $dompdf->output());
```
程式看起來沒問題，
但第二頁(顯示頁碼的第一頁)的浮水印蓋過文字...
其他都正常...
那我全部放一起好了
Sign in with Wallet
Connect another wallet