Testing HTML Emails
This article contains the source code of a PHP script that can be used to send an HTML email to yourself for testing before the email is sent to a list.
HTML emails are constructed with HTML tags much like web pages are. But there are some caveats, which the test email may reveal depending on which email reading software is being used.
When testing HTML email to be sent to a list, it is prudent to read the test email on as many different email readers as feasible.
Some caveats:
-
URLs need to be absolute http://... URLs. Relative URLs will not work.
Relative URLs indicate a URL relative to the location of a web page. The HTML email is not an actual web page nor is it on the server from where it originated. Thus, any relative URLs are broken.
Look for relative URLs in href and src attributes and change them to absolute URLs.
-
No JavaScript.
It's not that you can't embed JavaScript. You can. But most email reading software will either ignore it or convert it into visible code.
-
Any code to import files from the internet might be ignored by the email reading software. Examples are CSS styles and images. It generally depends on the preferences set up in the software.
If a required CSS style sheet is not imported, the email will render without the CSS styles.
If possible, embed CSS styles within the email content rather than importing it. A CSS style sheet can be embedded within the email content in the head section of the content source code. Inline styles can also be used.
Images might not display by default, leaving it up to the email recipient to click something to display the images.
This is generally less critical than CSS styles. However, if images absolutely must display, there is a way to embed images instead of using an img tag. It is, however, outside the scope of this article. The technique uses multi-part email and encoded images.
The thing to remember is any request to import a file from a server on the internet may fail to import except with the email recipient's express permission.
-
The email content needs to have HTML markup. Otherwise, it will tend to all run into one paragraph.
The Script to Send an HTML Email for Testing
Upload the PHP script to your server in a password protected area, if possible. Then type its URL into your browser.
The control panel of the PHP script itself is password protected. Putting it into a password protected area is additional security.
Here is the PHP script to send an HTML email. Customization instructions below.
<?php
/*
Script to Send an HTML Email for Testing
Version 1.0
January 30, 2012
Will Bontrager Software, LLC
https://www.willmaster.com/
Copyright 2012 Will Bontrager Software, LLC
This software is provided "AS IS," without
any warranty of any kind, without even any
implied warranty such as merchantability
or fitness for a particular purpose.
Will Bontrager Software, LLC grants
you a royalty free license to use or
modify this software provided this
notice appears on all copies.
*/
//////////////////////////////////////////////////
//
// Customizations:
// Specify a username and password for accessing the control panel.
$Username = "username";
$Password = "password";
// End of customization.
//////////////////////////////////////////////////
$SoftwareName = 'Script to Send an HTML Email for Testing';
$Version = '1.0';
$Message = '';
$LoginCookieName = 'ScriptToSendAnHTMemailForTesting';
$TestingCookieName = 'HTMemailForTestingMemory';
$Username = trim($Username);
$Password = trim($Password);
if( empty($_POST['log_in']) and empty($_COOKIE[$LoginCookieName]) ) { LogIn(); }
else
{
if( isset($_POST['log_in']) ) { SetLoginCookie(); }
elseif( isset($_POST['mail_it']) ) { MailIt(); }
ControlPanel();
}
function PageTop()
{
global $Message;
$me = $_SERVER['PHP_SELF'];
echo <<<TOPOFPAGE
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >
<title>Script to Send an HTML Email for Testing</title>
<style type="text/css">
body { margin:0; font-family:sans-serif; }
th { font-size:12px; }
td { padding-top:3px; }
p, li, td { font-size:14px; line-height:120%; }
a { text-decoration:none; }
.width { width:500px; }
.col1 { width:100px; }
.col2 { width:400px; }
#content { margin:0 0 0 150px; padding:75px 0 100px 50px; width:500px; }
</style>
</head>
<body><div id="content">
<a href="//www.willmaster.com/">
<img style="position:absolute; left:250px; top:20px;" src="//www.willmaster.com/images/wmlogo_icon.gif" width="50" height="50" border="0" alt="Willmaster.com logo"></a>
<h3 style="margin-bottom:50px;">Script to Send an HTML Email for Testing</h3>
<form method="post" action="$me" style="margin-bottom:25px;">
$Message
TOPOFPAGE;
} # function PageTop()
function PageBottom()
{
global $SoftwareName, $Version;
echo <<<BOTTOMOFPAGE
</form>
<hr width="100" align="left">
<p style="margin-top:0;">
$SoftwareName, version $Version<br>
Copyright 2012 <a href="//www.willmaster.com/">Will Bontrager Software, LLC</a>
</p>
</div>
</body>
</html>
BOTTOMOFPAGE;
} # function PageBottom()
function LogIn()
{
PageTop();
echo <<<LOGIN
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td class="col1">Username: </td>
<td><input type="text" name="un" class="col2"></td>
</tr>
<tr>
<td class="col1">Password: </td>
<td><input type="password" name="pw" class="col2"></td>
</tr>
<tr>
<td> </td>
<td style="padding-top:6px;"><input type="submit" name="log_in" value="Log In" class="col2"></td>
</tr>
</table>
LOGIN;
PageBottom();
} # function LogIn()
function SetLoginCookie()
{
global $Username, $Password, $LoginCookieName;
if( $_POST['un'] == $Username and $_POST['pw'] == $Password )
{
setcookie($LoginCookieName,'1');
ControlPanel();
}
else
{
LogIn();
exit;
}
} # function SetLoginCookie()
function MailIt()
{
global $Message, $TestingCookieName;
$to = stripslashes(trim($_POST['to']));
$charset = stripslashes(trim($_POST['charset']));
$charset = preg_replace('/["'."'".']/','',$charset);
$subject = stripslashes(trim($_POST['subject']));
$body = stripslashes(trim($_POST['body']));
if( strpos($body,"\n") === false ) { $body = str_replace("\r","\n",$body); }
else { $body = str_replace("\r",'',$body); }
$headers = array();
$headers[] = 'Mime-Version: 1.0';
$headers[] = "Content-type: text/html; charset=$charset";
$headers[] = "From: $to";
mail($to,$subject,$body,implode("\n",$headers));
$Message = <<<MAILINGSENT
<div style="border:1px solid black; padding:25px; margin:35px 0 50px 0;">
<p style="margin:0;">
A test email has been sent to $to
</p>
</div>
MAILINGSENT;
setcookie($TestingCookieName,"to=$to&charset=$charset&subject=$subject",time() + (10 * 365 * 24 * 60 * 60));
} # function MailIt()
function ControlPanel()
{
global $TestingCookieName;
$prefil = array();
$prefil['to'] = $prefil['charset'] = $prefil['subject'] = '';
if( isset($_COOKIE[$TestingCookieName]) )
{
foreach( explode('&',$_COOKIE[$TestingCookieName]) as $piece )
{
list($key,$value) = explode('=',$piece,2);
$prefil[$key] = $value;
}
}
$to = $prefil['to'];
$charset = $prefil['charset'];
$subject = $prefil['subject'];
PageTop();
echo <<<CP
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td class="col1">Email To: </td>
<td><input type="text" name="to" class="col2" value="$to"></td>
</tr>
<tr>
<td class="col1">Character Set: </td>
<td><input type="text" name="charset" class="col2" value="$charset"></td>
</tr>
<tr>
<td class="col1">Subject: </td>
<td><input type="text" name="subject" class="col2" value="$subject"></td>
</tr>
<tr>
<td colspan="2">Email content:<br>
<textarea name="body" class="width" style="height:200px;"></textarea></td>
</tr>
<tr>
<td colspan="2" style="padding-top:9px;"><input type="submit" name="mail_it" value="Send Test Email" class="width"></td>
</tr>
</table>
CP;
PageBottom();
} # function ControlPanel()
?>
Customization:
Two things need to be customized, the control panel username and the control panel password. You'll find them at about lines 25 and 26 of the PHP script.
The PHP script file can be named anything you wish, so long as has a .php extension. Example: mailtester.php
If you have no secure area for the script, give the file a name unlikely to be guessed, like sdfks32332dSSSds.php (but something different, as that name suggestion is published here). Then, spammers are less likely to find it by guessing the file name.
When the customization is done, upload the PHP script to the server. Then, type its URL into your browser.
Using the PHP Script Control Panel
When the URL of the PHP script is first loaded into the browser, you will be asked to log in. Use the username and password specified in the script when the customization was done.
Cookies are required.
After logging in, you'll see four form fields.
-
Email To: Type in the email address to send the test email to.
-
Character Set: Type in the character set to use for the email. Unless there is reason to do otherwise, specify
"utf-8" (no quotes). For a list of character sets, perhaps incomplete, click here. -
Subject: The subject line for the email.
-
Email content: The source code of the HTML email. (The source code is the content with HTML tags.)
You now have a way to test HTML emails.
As stated before, it is prudent to read the test HTML email on as many different email readers as feasible before sending it to a list.
Will Bontrager
