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.
Related
I'm using PHP mpdf library for PDF export. But the HTML code alignment and position of all content changes when i export HTML to PDF.
Please explain how can I export the full HTML page as it is to the PDF page.
<?php $html='<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<style type="text/css">
body, html { height: 100%; margin: 0px; width: 100% !important;}
</style>
</head>
<body>
<center>
<div class="container" style="position: relative; width: 80%; left: 20%; display: block; text-align: center;">
<div style="position: absolute; left: 40%; width: 60%; text-align: center;">
<img src="p1/logo.png">
<h1 style="text-align: center;">TALENTX™</h1>
<h1>Profile</h1>
<h1>Aljoharah AlBabtain</h1>
<p>RESULTS REFERENCE REPORT JUNE 2020</p>
</div>
</div>
</center>
</body>
</html>';
require_once APPPATH . 'libraries/mpdf/autoload.php';
$mpdf = new \mPDF('utf-16','A4','');
$html = $this->load->view('reps/p1',null,true);
$mpdf->WriteHTML($html);
$mpdf->Output("files/test.pdf",'F');
The best way for aligning the HTML content in PDF export or for printout is the <table> approach. Put all your content in the table columns.
I use this approach and all my problem fixed.
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;
}
i've had email working within laravel for a few months now, but decided it's probably time to move them into a queue rather than slowing down users' page loads.
However, as soon as i switch to the database queue driver i get the following error:
local.ERROR: exception
'Symfony\Component\Debug\Exception\FatalErrorException' with message
'Method Swift_Message::__toString() must not throw an exception' in
/Applications/MAMP/htdocs/tp/vendor/laravel/framework/src/Illuminate/Mail/Transport/MailgunTransport.php:0
If i switch back to sync driver, everything works again.
Could this be something to do with permissions, or different users running different jobs?
For reference the queuing is:
Mail::queue('emails.new_team', [], function($message) use ($team)
{
$message->to('hiden#hidden.co', 'hiden');
$message->from('hiden#hiden.co', 'hiden');
$message->subject($team->name.' - Team Just Created!');
});
With new_team email containing (admin is one of my routes):
#extends('emails.baseemail')
#section('content')
<h2 style="margin-bottom: 20px; font-weight: 900; font-size: 25px;">Theres a new team!!</h2>
<div style="margin: 20px 0;">
Go to Admin
</div>
#stop
And Base email containing:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
#yield('specificMETA')
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0">
<link rel="shortcut icon" type="image/x-icon" href="/img/favicon.ico">
</head>
<body style="font-family: 'Dosis', sans-serif; font-weight: 300; color: #666; background: #FDFDFD; margin: 0;" bgcolor="#FDFDFD">
<style type="text/css">
.button:hover {
background: #7f8c8d;
}
.cta:hover {
background: #2980b9;
}
</style>
<div id="header" style="position: inherit; z-index: 73411; font-size: 30px; line-height: 70px; color: #ecf0f1; width: 100%; height: 70px; background: #27ae60;">
<div class="centre_col" style="width: 1024px; margin: 0 auto;">
<div id="header_left" class="l" style="float: left;">
<img alt="tp" src="{{$message->embed(asset('img/tp.jpg'))}}">
</div>
</div>
</div>
<div id="content" style="margin-top: 20px;">
<div class="centre_col" style="width: 1024px; margin: 0 auto;">#yield('content')</div>
</div>
</body>
</html>
It turns out the problem was using asset() within the img tag in the base email.
so <img alt="tp" src="{{$message->embed(asset('img/tp.jpg'))}}">
becomes <img alt="tp" src="{{$message->embed('http://tp.co/img/tp.jpg')}}">
So far i've just had to hard code the path to the image.
Note that it has to be the full path, so i've chosen my live server's path.
This isn't ideal, so if anyone knows how to do relative paths within queued emails, please let me know and i'll accept that answer.
below is my code for php include. I guess I'm inputting the right code, but it just don't seem to abide:
Here is my headertop.php:
'<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>HOME</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<meta name="description" content="Slide Down Box Menu with jQuery and CSS3" />
<meta name="keywords" content="jquery, css3, sliding, box, menu, cube, navigation,
portfolio, thumbnails"/>
<link rel="shortcut icon" href="images/art_favicon.png" type="image/x-
icon"/>
<link rel="stylesheet" href="css/style.css" type="text/css" media="screen"/>
</head>
<header>
<?php
<div id="headertop">
<div id="adams">
<p><span style="color: #F60;">A</span>ncajas <span style="color:
#F60;">D</span>igital <span style="color: #F60;">A</span>rts & <span style="color:
#F60;">M</span>edia <span style="color: #F60;">S</span>olutions</p>
</div>
</div>
?>
</header>
</head>
</html>'
And here is my index.php:
'<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>HOME</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<meta name="description" content="Slide Down Box Menu with jQuery and CSS3" />
<meta name="keywords" content="jquery, css3, sliding, box, menu, cube, navigation,
portfolio, thumbnails"/>
<link rel="shortcut icon" href="images/art_favicon.png" type="image/x-
icon"/>
<link rel="stylesheet" href="css/style.css" type="text/css" media="screen"/>
<style>
body{
background-image: url(images/graphy.png);
font-family:Arial, Helvetica, sans-serif;
margin: 0;
padding: 0;
}
</style>
</head>
<header>
<?php
include ('headertop.php');
?>
</header>
<body>
<div id="contents">
</div>
</body>
</html>'
And of course my CSS for the header part:
'#headertop{
width: 1050px;
height: auto;
background-color: #252525;
margin-left: auto;
margin-right: auto;
position: inherit;
border-top: solid #F60 2px;
margin-bottom: 0px;
/*border-bottom: solid #F60 1px;*/
}
#adams{
font-family:"Trajan Pro";
font-weight: 100;
font-size: 24px;
text-align: center;
color: #CCC;
padding-bottom: 6px;
margin-bottom: 17px;
}
header{
width: 1050px;
height: 300px;
/*background-image:url(../interactive/product_slideshow.swf);*/
/*background-color: #999;*/
margin-left: auto;
margin-right: auto;
}'
Thank you guys for the support.
This should be throwing somewhere an error:
<?php
<div id="headertop">
It is within your headertop.php. Furthermore, I recommend you to turn errors on while coding so this doesn't happen again.
You don't need to set up the full html in the file you're including, only the bit you want to include. Try changing headertop.php to this:
<div id="headertop">
<div id="adams">
<p>
<span style="color: #F60;">A</span>ncajas
<span style="color: #F60;">D</span>igital
<span style="color: #F60;">A</span>rts &
<span style="color: #F60;">M</span>edia
<span style="color: #F60;">S</span>olutions
</p>
</div>
</div>
when I am sending an email via PHP mail functon (I put this html code in one line and add it to the message), lets say this what I want to send:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style type="text/css">
.box h3{
text-align:right;
position:relative;
direction: rtl;
}
.box {
width:70%;
top:80px;
height:200px;
background: whitesmoke;
margin:40px auto;
text-align:right;
direction: rtl;
}
/*==================================================
* Effect 2
* ===============================================*/
.effect2
{
position: relative;
}
.effect2:before, .effect2:after
{
z-index: -1;
position: absolute;
content: "";
bottom: 15px;
left: 10px;
width: 50%;
top: 80%;
max-width:300px;
background: #777;
-webkit-box-shadow: 0 15px 10px #777;
-moz-box-shadow: 0 15px 10px #777;
box-shadow: 0 15px 10px #777;
-webkit-transform: rotate(-3deg);
-moz-transform: rotate(-3deg);
-o-transform: rotate(-3deg);
-ms-transform: rotate(-3deg);
transform: rotate(-3deg);
}
.effect2:after
{
-webkit-transform: rotate(3deg);
-moz-transform: rotate(3deg);
-o-transform: rotate(3deg);
-ms-transform: rotate(3deg);
transform: rotate(3deg);
right: 10px;
left: auto;
}
</style>
</head>
<body>
<div class="box effect2">
<b>שלום,</b>
<p>
אנא לחץ על הקישור המצורף ע"מ לאשר את התחברותך לאתרץ
</p>
<p>
הלינק הוא:
</p>
<b>
תודה מראש,
</b>
<p><b>
צוות האתר
</b></p>
</div>
</body>
</html>
I want to send it via php. When I send this email I am getting the email with it tags and not styled as I wanted.
Thanks
email clients don't support css..
You have to right inline styles..
HTML emails that appear to the receiver as you intended them to appear are not simple. They are more like late '90s html. Styles should be inlined, and you should use tables for layout. Backgrounds don't work reliably on many clients, and for sure you test on a variety of clients because html will vary WILDLY between various clients.
Bonus: forget about javascript / jQuery and the like....
Also, don't count on being able to display CSS3 and html5 elements etc. MANY clients have no support. Outlook doesn't even support margins very well, let alone all the css we have gotten used to. So keep it very simple, use tables for layout, test widely and don't think you will even get close to pixel-perfect.....
here is some help on universally supported html/css
As you have the CSS and HTML already, you can make use of this website to convert the CSS style into inline CSS style for HTML emails.
http://inlinestyler.torchboxapps.com/
Email client doesn't support CSS. So try to write inline CSS as below:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body style="margin:0;padding:0;border=0;font-size:14px;font-family:YOUR_FONT_FAMILY_NAME">
<div style="position:relative;">
<h3 style="text-align:right;position:relative;direction:rtl;">This is heading 3</h3>
<b>שלום,</b>
<p>אנא לחץ על הקישור המצורף ע"מ לאשר את התחברותך לאתרץ</p>
<p>הלינק הוא:</p>
<b>תודה מראש,</b>
<p><b>צוות האתר</b></p>
</div>
</body>
</html>