Test HTML-Email Forms (with phpMailer)

Instructions

First, I have re-worked this program so you do not have to be a PHP programmer to use it. However, if you would like to use this program locally you will need to set up a local server (such as xampp). See 'Install Locally' below.

This is an aid in creating HTML Email templates. With this program you can delete comments and hsl color values are replaced with hex values. The latter part is primarily because of advice about using hsl and hsla to find good color matches. Any email template within the email root folder or subfolder can be previewed quickly as you code, then sent to your own email accounts & viewed on your own devices. Once everything seems OK, then the template can be tested with Email On Acid without wasting any credits. PHP programmers can download the final product with the image paths altered and the snippets needed for embedding the images with phpMailer.

On the 'Get Code' page, checking 'Yes' or 'No' will delete all or none of the HTML & CSS comments. 'Only *' will cause any/all comments with an asterisk (*) included to be deleted. Clicking 'Get Code' when 'Select' is checked will reveal a dropdown so you can go through each HTML and CSS comments to 'Save' or 'Delete' it. If you have ghost-tables, then you should double-check the code 'After' to see which comments have been kept before sending. This does not effect the file itself, only what is sent or downloaded is altered.

To the left of the 'Preview' button is the refresh icon. This does the same as 'Get Code' while keeping whatever is being looked at in view (preview, before, after, values or snippets). 'Preview' is to look at the email itself. Click and drag the right edge to resize the image for smaller screens. 'Before' and 'After' is for looking at the code before and after it is processed. 'Values' and 'Snippets' show how the images references have been handled, as well as any hsl to hex conversions.

Warning: the preview uses an iframe to display the html. Cached files and images may sometimes need to be cleared.

Customized settings

Customize the color scheme for image references, color values, comments and hsl errors as well as the box-shadow and border-radius. These settings will not be saved unless you are logged-in or you are running the program locally. Also, any email address you enter will not be saved for your account only and will not be displayed to any other users. Like the color settings, email addresses entered by un-registered users will be deleted when the browser is refreshed.

Upload Template

First, any templates that are uploaded to this site without being logged-in are subject to deletion at any time. Registered users can have up to 2 templates uploaded at a time. Double-click any template to delete it.

Most of the instructions needed for the folder structure is given on the 'Upload Zip' page. Be sure to enclose the src values with double quotes, single quotes may cause an error. Starting each image location with "./" is also recommended to make it easier for this program to read and edit. Unfortunately, this program does NOT inline CSS... Yet.

Download Template

Downloading a template is for PHP programmers that use phpMailer. The 'Download' button does not become active until after a template is picked and 'Get Code' is clicked. The downloaded folder includes the html template after the image src values and any hsl or hsla colors are changed to hex values. A snippets.php file is also included for use with the program that will actually send the email. PHP programmers who are working with phpMailer should be able to work with the absolute path at the beginning of the snippets.php file.

Non PHP programmers can still benefit by downloading and installing this program. Not only will it make it easy to send test emails to any email address, it can also be a good place to keep all your original email templates with the original image src values. No more downloading needed.

Install Locally

Assuming you have a code editor set up already, you will also need to install a local server, like xampp. There is plenty of instruction on the internet for doing this. Once a local server is set up, put this program into the htdocs folder and you are almost ready to go.

You will also need a Gmail account, and you'll need to get a 3rd party password from Gmail. Again, you can find plenty of instruction for this online. Finally, open the Config.class.php file in the classes folder. Find "'phpMailer' => [...]" and enter the username (your gmail account, example@gmail.com), and the 3rd party password. The subject and who the email is from (you or your company name) can also be set here.

To run the program, use your browser to navigate to: localhost / this program.

Trouble-shooting

Let's say you download this program, you have a local server and everything is placed within the correct folders. There is one possible 'hiccup' that you may experience having to do with a ZipArchives class that is included by default for PHP 5.6 and above.

Let's further assume you are using a recent version of xampp with PHP 5.6 or above, but both download buttons result in a 404 error. To correct this you need to go into the php.ini file in xampp/php. Uncomment (remove #) from the line:

'#extension=zip'

Then stop and re-start the Apache server.

If this still does not work, click 'Config' in the xampp control panel, then click 'Apache (httpd-ssl.conf)'. Finally, add or uncomment the line:

'LoadModule deflate_module modules/mod_deflate.so'

Stop and start the apache server again and refresh the email form tester. Everything should work from there.