Stripe payments customized emails

Stripe is very popular payment processing system growing in its customers day by day, it has well written and rich enhanced api with really cool documentation which provides us great flexibility in terms of utilization and customization.

Stripe dashboard itself has pretty standard customization options for emails, you can place your logo and change a bit of text BUT it doesn’t allow you to completely change the look and feel of email.

For example a merchant want to have an email with custom header text/image and custom payment message along with some help links in the footer of the email, stripe dashboard doesn’t allow such customization but of course you can do it by using stripe webhooks.

Webhooks is really a cool feature provided by stripe which allows you to intercept events in your php scripts to do what you want. You can send emails, you can make changes in database etc.

So we are going to make fully customized emails sending out to customers using webhooks. Idea is to disable the success email sending through stripe dashboard rather send our own emails. We will create a hook to our php script and will utilize the “charge.succeeded” event. “charge.succeeded” is triggered when a successful payment has been made, so we will be sending out our own emails to customers as we receive charge.succeeded event.

Lets proceed to creating and sending fully customized emails.

Create Webhooks

First thing to do is to create webhooks in stripe dashboard which will be pointing to our scripts to send events.

Head to stripe webhooks in your dashboard or click the link below.
Stripe Webooks
Click on add endpoint button as circled in image below.

We are going to add two webhooks, one is for live mode and other is for test mode.

Create Live Webhook

Click on “Add endpoint” button and follow the steps as in image below to add live webhook

1. Add the live webhook url, where your live webhook script will be placed for example www.site.com/hooks/live_stripe.php
2. Select the Mode as “Live”
3. Click on Select events
4. Select the events you want to catch in webhook script, we are going to catch charge.succeded event.
5. Create the endpoint.

Create Test Webhook

Click on “Add endpoint” button and follow the steps as in image below to add test webhook

1. Add the test webhook url, where your test webhook script will be placed for example www.site.com/hooks/test_stripe.php
2. Select the Mode as “Test”
3. Click on Select events
4. Select the events you want to catch in webhook script, we are going to catch charge.succeded event.
5. Create the endpoint.

Now we have created our stripe webhooks end points, next step is to turn off default emails, click on the “Emails” link on top or click the following link
Stripe emails

Uncheck the “Successful payments” checkbox and hit Done button.

That’s it, we have done with the stripe now we are heading to create our test_stripe.php and live_stripe.php scripts.

Stripe PHP SDK

You should have stripe php sdk downloaded
For example place php-sdk as /home/usrname/mywebsite/stripe-php
stripe-php-sdk is placed in root directory of your website.

Create a new directory “hooks” in your site root for example
/home/usrname/mywebsite/hooks/

Creating test webhook

First we are going to create the test_stripe.php

Create new php file under your hooks directory and name it as test_stripe.php
like /home/usrname/mywebsite/hooks/test_stripe.php

Open the file and place following code in it

<!--?php
//set stripe library-sdk path
$path = realpath(dirname(__FILE__) . '/../stripe-php/lib');
//include stripe library-sdk
require_once("$path/Stripe.php");
//set your test private api key
Stripe::setApiKey("your_test_private_api_key");
//get the json request from stripe
$body = @file_get_contents('php://input');
//convert the json request to php array
$event_json = json_decode($body);

//create log file to log the test events
$logfile = fopen("./log/test_evnlg.log", 'a');
$date = date("Y-m-d H:i:s");
fwrite($logfile, "\n===============================================\n\tNew Test log $date \n===============================================\n");

//include the webhook script to send emails
include_once("webhook.php");

Save the file. Creating live webhook

Now we go to create a new webhook script for live. Create new php file under your hooks directory and name it as live_stripe.php
like /home/usrname/mywebsite/hooks/live_stripe.php

Open the file and place following code in it

<!--?php
//set stripe library-sdk path
$path = realpath(dirname(__FILE__) . '/../stripe-php/lib');
//include stripe library-sdk
require_once("$path/Stripe.php");
//set your live private api key
Stripe::setApiKey("your_live_private_api_key");
//get the json request from stripe
$body = @file_get_contents('php://input');
//convert the json request to php array
$event_json = json_decode($body);

//create log file to log the live events
$logfile = fopen("./log/live_evnlg.log", 'a');
$date = date("Y-m-d H:i:s");
fwrite($logfile, "\n===============================================\n\tNew Live log $date \n===============================================\n");

//include the webhook script to send emails
include_once("webhook.php");

Save the file. Now we have created basic test and live scripts, both scripts are using webhook.php to send emails. Lets create a webhook.php file to implement our email logic. Create new php file under your hooks directory and name it as webhook.php like /home/usrname/mywebsite/hooks/webhook.php. Open the file and place following code in it.

 
<?php
//if nothing in event then stop further execution 
if (!$event_json) { 	
    echo "nothing found"; 
    die; 
} 

try {     
    // for extra security, retrieve from the Stripe API, this will fail in Test Webhooks     
    $event_id = $event_json--->{'id'};
    $event = Stripe_Event::retrieve($event_id);
    fwrite($logfile, "\n\n Stripe Event Received as: $event \n");

    if ($event->type == 'charge.succeeded') {
		fwrite($logfile, "Sending payment receipt to customer \n");

		email_payment_receipt($event->data->object);
    }

} catch (Stripe_InvalidRequestError $e) {
   	fwrite($logfile, "ERR " . $e->getMessage() . " \n");
}

//send out payment receipt
function email_payment_receipt($payment) {
    global $logfile;
    fwrite($logfile, "Sending customer payment email\n");

    // retrieve customer from stripe
    $customer = Stripe_Customer::retrieve($payment->customer);
    //fwrite($logfile, "Customer: " . var_export($customer, 1) . "\n");

    $email = $customer->metadata->customer_email;
    $name = $customer->metadata->customer_name;
    $subject = 'Payment has been received';

    send_html_email($name, $email, $subject, payment_received_body($payment, $name, $email));
}

//create email body for payment received
function payment_received_body($charge, $name, $email) {
	global $logfile;

	$date = date("F d, Y", $charge->created);
	$transaction = $charge->receipt_number ? ("#" . $charge->receipt_number) : ("#" . $charge->created);
	$card = $charge->source->last4;

	$amount = format_stripe_amount($charge->amount);
	$html = file_get_contents("invoice.html");

	$search = array("{customerName}", "{customerEmail}", "{total}", "{date}", "{transaction}", "{card}");
	$replace = array($name, $email, $amount, $date, $transaction, $card);
	$html = str_replace($search, $replace, $html);
	return $html;
}

function format_stripe_amount($amount) {
  return sprintf('$%0.2f', $amount / 100.0);
}

function format_stripe_timestamp($timestamp) {
  return strftime("%m/%d/%Y", $timestamp);
}

function send_html_email($name, $to, $subject, $body)
{
	global $logfile;

	$from = "admin@yourwebsite.com";
	$replyTo = $from;
	$headers = "From: " . $from . "\r\n";
	$headers .= "Reply-To: ". $replyTo . "\r\n";
	//$headers .= "CC: susan@example.com\r\n";
	$headers .= "MIME-Version: 1.0\r\n";
	$headers .= "Content-Type: text/html; charset=ISO-8859-1\r\n";

	fwrite($logfile, "Sending EMAIL\n");

	fwrite($logfile, "$name\n");
	fwrite($logfile, "$to\n");
	fwrite($logfile, "$subject\n");
	//fwrite($logfile, "$body\n");

	mail($to, $subject, $body, $headers);

	fclose($logfile);
}

Save your file.

Email Template

Now create an html email template to send out as an email and add placeholders to it

Create new html file as invoice.html, it will look like
/home/usrname/mywebsite/hooks/invoice.html
and put your html in that file with place holders like below

<meta http-equiv=""Content-Type"" content=""text/html;" charset="utf-8"">
<title>Your website Name</title>



<table border=""0"" cellpadding=""0"" cellspacing=""0"" width=""640px"" style=""margin:20px" auto;"="">
<tbody><tr>
<td align=""center"">
<table border=""0"" cellpadding=""0"" cellspacing=""0"" style=""margin-bottom:30px;"">
<tbody><tr>
<td align=""center""><a href=""link_to_your_website""><img src=""your_website_logo"" alt=""your-website-name"" style=""margin-bottom:15px;""></a></td>
</tr>
<tr>
<td>
<h1 style=""font-family:Verdana," geneva,="" sans-serif;="" font-weight:bold;="" font-size:24px;="" color:#000;="" text-align:center;="" margin:0="" 0="" 15px="" 0;"="">Title of your payment receipt</h1>
</td>
</tr>
<tr>
<td>
<h2 style=""font-family:Verdana," geneva,="" sans-serif;="" font-weight:normal;="" font-size:22px;="" font-style:italic;="" color:#ff0000;="" text-align:center;="" margin:0="" 0="" 20px="" 0;"="">Payment Receipt</h2>
</td>
</tr>
<tr>
<td align=""center"">
<table width=""100%"" border=""0"" cellpadding=""0"" cellspacing=""0"">
<tbody><tr>
<td align=""right""><img src=""visa.png"" alt=""""></td>
<td align=""left"">
<h3 style=""margin:0px" 0px="" 10px;"="">{card}</h3>
</td>
</tr>
</tbody></table>
</td>
</tr>
</tbody></table>
</td>
</tr>
<tr>
<td>
<table border=""0"" width=""100%"" cellpadding=""0"" cellspacing=""0"">
<tbody><tr bgcolor=""#dcddd6"">
<td align=""left"" style=""padding:15px" 20px;"="">{date}</td>
<td align=""right"" style=""padding:15px" 20px;"="">{transaction}</td>
</tr>
</tbody></table>
</td>
</tr>
<tr>
<td>
<table border=""0"" width=""100%"" cellpadding=""0"" cellspacing=""0"">
<tbody><tr>
<td align=""left"" style=""border-bottom:1px" solid="" #ececec;="" padding:15px="" 20px;="" color:#8b8e8d;"="">Description</td>
<td align=""right"" style=""border-bottom:1px" solid="" #ececec;="" padding:15px="" 20px;="" color:#8b8e8d;="" margin:0="" 20px;"="">Price</td>
</tr>
<tr>
<td align=""left"" style=""border-bottom:1px" solid="" #ececec;="" padding:10px="" 0px="" 10px="" 20px;"=""><span style=""display:" block;="" background:#ececec;="" padding:10px="" 5px;"="">Payment from {customerName} for Your Website</span></td>
<td align=""right"" style=""border-bottom:1px" solid="" #ececec;="" padding:10px="" 20px;"="">
<h4 style=""font-family:Arial," helvetica,="" sans-serif;="" font-size:16px;="" margin:0px;"="">{total}</h4>
</td>
</tr>
<tr>
<td align=""right"" style=""padding:20px" 0px;"=""><span style=""font-family:Verdana," geneva,="" sans-serif;="" font-size:18px;"="">Total</span></td>
<td align=""right"" style=""padding:10px" 20px;"="">
<h4 style=""font-family:Arial," helvetica,="" sans-serif;="" font-size:18px;="" margin:0px;"="">{total}</h4>
</td>
</tr>
</tbody></table>
</td>
</tr>
<tr>
<td align=""center"" style=""border-top:1px" solid="" #ececec;="" padding:20px="" 20px;"=""> Have a question or need help? <a href=""#"" onmouseover="this.style.textDecoration="none"" onmouseout="this.style.textDecoration="underline"" style=""color:#085296;"">Send us an email</a> Or give us a call at (000) 000-0000</td>
</tr>
<tr>
<td align=""center"" style=""padding:0px" 20px;"=""> Having trouble viewing this email? <a href=""#"" onmouseover="this.style.textDecoration="none"" onmouseout="this.style.textDecoration="underline"" style=""color:#085296;"">View it in your Browser</a> You are reveiving this email because you made a payment to
      Your website Name</td>
</tr>
</tbody></table>

Testing emails

Upload the code to your webserver. Go to stripe dashboard and turn it to test mode. Create a test payment or subscription, you will receive the customized email. Now turn it back to live mode so your customers can get the customized emails.

Please suggest enhancements in your comments.

Thanks 🙂