Chinese characters work fine in the HTML page, but when i try to covert HTML to PDF with below code, all Chinese characters got converted to question marks.
I tried to use all types of chinese font libraries but still no success. Please help me fix it.
$html = '<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="Content-Type: application/pdf; charset=utf-8"/>
<link rel="stylesheet" href="style.css">
<div style="width:800px; height:970px; padding:20px; border: 10px solid #787878">
<style>
body {
body {font-family: "simsun"}
}
</style>
<div style="width:750px; height:915px; padding:20px; border: 5px solid #787878">
</br>
<div><img class="imgA1" src="logo.png" ></div>
<!--<img class="imgB1" src="logo.png">-->
</br></br></br></br>
<h6 style="font-size:16px !important; text-align:center;"> <b>'.$goal.'</b></h6><br/><br/>
<b>立約人</b></br></br>
甲方 : <span style="font-size:18px;"><b>'.$user[0]['user_name'].'<b> </span>
<br><br>
乙方 : <span style="font-size:18px;"><b>'.$judge_name.'</b></span><br/><br/>
<b>四. 本合約壹式貳份，雙方各執壹份為憑。</b><br/><br/>
裁判簽名___________________<br/><br/>s中華民國 月 日
</div>
</div></html>';
$dompdf->loadHtml($html);
$dompdf->setPaper('A4', 'landscape');
/* Render the HTML as PDF */
$dompdf->render();
header('Content-Type: application/pdf; charset=utf-8');
header('Content-disposition: inline; filename="' . $no . '.pdf"', true);
/* Output the generated PDF to Browser */
$dompdf->stream();
#font-face {
font-family: 'Firefly Sung';
font-style: normal;
font-weight: 500;
src: url(http://eclecticgeek.com/dompdf/fonts/cjk/fireflysung.ttf)
format('truetype');
}
* {
font-family: Firefly Sung, DejaVu Sans, Verdana, Arial, sans-serif;
}
Related
I'm using Dompdf v2.0.1 to make a report. I'm using a custom font from Google Fonts (Josefin Sans) but the spaces are rendered incorrectly.
But when rendering the page as HTML, spaces are displayed correctly.
Below I'll paste the HTML and PHP code I'm using to generate the PDF.
<!DOCTYPE html>
<html lang="pt-BR">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Josefin+Sans:wght#300;400;700&display=swap" rel="stylesheet">
<title>Relatório de atendimentos</title>
<style>
#page {
margin: 16px;
padding: 0;
}
body {
font-family: 'Josefin Sans', sans-serif;
font-size: .8em;
}
table {
width: 100%;
border-collapse: collapse;
border: none;
}
td, th {
padding: .3em;
}
td {
border: solid 1px #000;
font-weight: 300;
}
.title {
font-size: 1.2em;
color: #FFF;
text-align: center;
background-color: #363435;
border-color: #363435;
}
</style>
</head>
<body>
<table>
<thead>
<tr>
<th class="title">Relatório detalhado de tickets</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<b>GERADO POR: </b> sadsadsad
</td>
</tr>
</tbody>
</table>
</body>
</html>
<?php
declare(strict_types=1);
namespace App\Actions\Report;
use Dompdf\Dompdf;
class GenerateReport
{
public static function run(array $data): string
{
return GenerateReportString::get($data);
$pdf = new Dompdf([
'isRemoteEnabled' => true,
'isJavascriptEnabled' => false,
'dpi' => 200,
]);
$pdf->setPaper('A4', 'landscape');
$pdf->loadHtml(
GenerateReportString::get($data)
);
$pdf->render();
return $pdf->output();
}
}
I tried setting the charset to UTF-8 in the HTTP header (Content-Type: application/pdf; charset=UTF-8), but the result is the same.
This is due to a font subsetting bug in the underlying php-font-lib library, see issue 2445. Not all fonts are impacted, but for those that are you can temporarily work around the issue by disabling subsetting.
$dompdf = new Dompdf(["IsFontSubsettingEnabled" => false]);
Note: This isn't a great solution if the font is large since it will impact the overall PDF size.
I have a problem with letter generating the letter 'N' become become 'ᴉ' (i upside down). I am working Laravel 9 using barryvdh/laravel-dompdf. In pc it is okay but when I open in my iphone (ios 16) I got this problem.
In My controller
public function recreate_card(Student $student){
$students[] = $student;
// return view('templates/student-card', compact('students'));
$pdf = Pdf::loadView('templates/student-card', compact('students'));
return $pdf->stream('student_card.pdf');
}
HTML Template
<!DOCTYPE html>
<html lang="en">
<head>
<title>{{ __('Student Card') }}</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<style type="text/css" media="screen">
html {
font-family: sans-serif;
line-height: 1;
margin: 15mm;
font-size: 1mm;
/* overflow: hidden; */
}
body {
font-family: "Arial (sans-serif)";
font-weight: 400;
line-height: 1.5;
color: #212529;
text-align: left;
background-color: #fff;
font-size: 3mm;
padding-top: 15mm;
}
...
<td class="fw-bold" colspan="2" style="text-align: center; font-size: 3.5mm; color: #014669;">{{ strtoupper($student->first_name).' '.strtoupper($student->last_name) }}</td>
...
Result that I got:
My Expectation: Supposed to be 'BO MATIN'
I found the solution. I change font-family in body from font-family: "Arial (sans-serif)"; to font-family: Arial, sans-serif;
I download Bamini font and try to download pdf. I got ??????????????? for tamil words.
$html='<!DOCTYPE html><html>
<style>
#font-face {
font-family: "Baamini";
src: url("baamini.ttf") format("truetype");
font-weight: normal;
font-style: normal;
}
body{
font-family: "Baamini";
}
</style>';
$html.='<head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /></head>';
$html.='<body><table style="border:1px solid;" width="100%"><tr><td colspan="2" align="center" style="border-bottom:1px solid;">';
$html.='<h3 style="font-family: Baamini;">சமூக நல அமைப்பு <h3>';
$html.='<h5>தொடர்பு எண் : ##########</h5></td></tr></table></body></html>';
$dompdf = new Dompdf();
$dompdf->loadHtml($html);
$dompdf->setPaper('A4', 'landscape');
$dompdf->render();
$dompdf->stream();
I am trying to include an external css into my PHP file:
<head>
<link rel="stylesheet" type="text/css" href="css/base.css">
</head>
my CSS File:
.carousel-inner > .item > img,
.carousel-inner > .item > a > img {
width: 100%;
margin: auto;
display: block;
margin-top:50px;
}
body {
font: 20px Montserrat, sans-serif;
line-height: 1.8;
overflow-y:hidden;
}
.container-fluid {
background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAWklEQVQoU2P8P5PhPwMDAwNjOgMjiMYFGIlWiM2E1oMvwbZU24vDbUFYN/P/f4Z0RjAfv0J8DgT5AUM3ksnIejEV4jAZa5B8mhkH9gxf+iIsnkEyiWiF2GwHAGuiJAtmjT1hAAAAAElFTkSuQmCC);
repeat;
position: relative;
padding-bottom: 70px;
}
p{
}
.btn-success {
background-color: #85C1E9;
border:0;
}
.bg-1 {
background-color: #1abc9c; /* Green */
color: #ffffff;
}
.bg-2 {
background-color: #474e5d; /* Dark Blue */
color: #ffffff;
}
.bg-3 {
background-color: #ffffff; /* White */
color: #555555;
}
.navbar {
padding-top: 0px;
padding-bottom: 0px;
border: 0;
border-radius: 0;
margin-bottom: 0;
font-size: 15px;
letter-spacing: 4px;
}
col-sm-4:hover {
color:#85C1E9;
}
.navbar-nav li a:hover {
color: #85C1E9 !important;
}
.helper {
margin:auto;
padding-top: 50px;
}
.col-sm-4:hover {
background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAAAJklEQVQYV2OMq7zlw4ADMIIkF7WrbUGX/3+G4f+ASS4MVtuMzcEAiGEnwSwsT0sAAAAASUVORK5CYII=")
repeat;
}
The stylesheet is obviously used, but the plaintext is also seen in the PHP file. If tried adding type or leave it away, href as /css/base.css and without leading /, but somehow I won't get rid of the plain text in my file. Any Idea whats causing it?
The PHP File:
<html>
<head>
<title>Awesome Title</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="css/base.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script type="text/javascript" src="/js/my.js"></script>
<script>
...
</script>
<header id="myPage" data-spy="scroll" data-target=".navbar" data-offset="50">
...
</head>
</header>
<body>
..
</body>
EDIT:
Found the error, there was a sneaky include(css/base.css)
I tried to validate your css using the W3 Css validator and it told me there's a parse error in your css. Namely you're closing the background-image: with a semicolon while on the line below theres a repeat;. This is a syntax error, and I think because it can't parse the css, it's just displayed as plain text.
You should know if you want to give styles to php output commands, like echo or print you have to type all of your html codes .
And type your php codes middle of body tags in HTML format . Like this :
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<?php
$text = "Hello World !";
echo "<p>" . $text . "</p>";
?>
</body>
</html>
But another problem that your code has is you typed a header tag inside head tags and close it after head closing tag and this will break the html programming grammar .
I have been trying for weeks to convert plain-text emails and insert the converted HTML into a template using Mandrill. I can convert the plain-text emails to HTML using the Rules Engine. I can also insert HTML into a template using the Rules Engine. However, I cannot seem to do both.
I am using this template:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="viewport" content="width=device-width"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>Andrew College</title>
</head>
<body style="background: #F4F4F4;">
<div style="max-width:600px; margin: 0 auto; padding-top:20px;">
<img src="https://www.andrewcollege.edu/sites/default/files/attachments/aclogo.png" style="padding: 10px 0px; max-width: 50%; height: auto;" alt="Andrew College"/>
</div>
<div style="max-width:600px; margin-left: auto; margin-right: auto; background:#ffffff; padding: 10px 10px 10px 10px; border: 1px solid #cfcfcf;">
<span mc:edit="main" style="text-align:left; font-family:sans-serif; font-size: 16px; line-height: 150%;">Some sample text.</span>
</div>
<p style="text-align:center; font-family: sans-serif; font-size:13px; line-height:150%">© Andrew College
</p>
</body>
</html>
Rules Engine setup:
If sender's email matches xxx#xxx.com, then set HTML Generation from Text ON and set template to TestTemplate using template block main.
However, the final email only shows the blank template. Using Gmail's Show Original Content function produces these results:
Content-Type: multipart/alternative; boundary="_av-zlN5SA0dJJ8qF-AJlRIGAg"
--_av-zlN5SA0dJJ8qF-AJlRIGAg
Content-Type: text/plain; charset=utf-8; format=flowed
Content-Transfer-Encoding: 7bit
This is a test of the HTML template.
Thanks,
Bob User
--_av-zlN5SA0dJJ8qF-AJlRIGAg
Content-Type: text/html; charset=utf-8
Content-Transfer-Encoding: 7bit
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="viewport" content="width=device-width">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Solution Guard, LLC</title>
</head>
<body style="background: #F4F4F4;">
<div style="max-width:600px; margin: 0 auto; padding-top:20px;">
<img src="https://www.andrewcollege.edu/sites/default/files/attachments/aclogo.png" style="padding: 10px 0px; max-width: 50%; height: auto;" alt="Solution Guard">
</div>
<div style="max-width:600px; margin-left: auto; margin-right: auto; background:#ffffff; padding: 10px 10px 10px 10px; border: 1px solid #cfcfcf;">
<span style="text-align:left; font-family:sans-serif; font-size: 16px; line-height: 150%;"></span>
</div>
<p style="text-align:center; font-family: sans-serif; font-size:13px; line-height:150%">© Andrew College
</p>
<img src="http://t.andrewcollege.edu/track/open.php?u=30210239&id=75c6cdc68840499ea44157a2300a98ab" height="1" width="1"></body>
</html>
--_av-zlN5SA0dJJ8qF-AJlRIGAg--
Is there any way to insert the plain-text section into the HTML template? I appreciate all the help.
You won't be able to do both using rules since templates applied using rules will only place currently available HTML content into the template block (in your case "main").
And the process to convert plain-text to HTML occurs after rules are applied because if the template or HTML gets changed during the rules processing, the automatically-generated HTML would no longer match what was generated and have to be run again. So you'd want to handle the conversion to HTML prior to relaying the messages to Mandrill.