Email Configuration

How to set up email notifications and customer invoices for your payment.

PreviousCheckout Redirect Form (Pro)NextDecimal Form Field (Pro)

Last updated 12 days ago

Email Configuration

How to set up email notifications and customer invoices for your payment.

In most cases, site owners want to receive notifications during payment processing, such as when a payment is successful or failed, and even do some automation tasks with email.

Prerequisites

WP SMTP provider works

Supported Emails

We currently offer notifications for three event types:

Payment Succeeded
Payment Failed
Customer Invoice

These can be enabled/disabled and customized individually to match your site's style. Let us know if any other email notifications would be helpful for your workflow and we'll consider adding them.

When specifying recipient(s), you can enter multiple emails separated by commas. For example:

Supported merge fields:

The following merge tags can be used to dynamically insert data into the email content:

Note: Some fields may be empty depending on the payment type - for example, shipping details may be empty if no shipping required when collect payment information

{site_title}
{site_url}
{header_text}

{amount}
{description}
{currency}
{created}
{format_date}
{format_time}
{amount_currency}
{matedata}
{payment_method.type}
{payment_method.card.brand}
{payment_method.card.last4}
{customer.name}
{customer.email}
{customer.phone}
{customer.address.country}
{customer.address.state}
{customer.address.city}
{customer.address.line1}
{customer.address.line2}
{customer.address.postal_code}
{billing_detail.address.country}
{billing_detail.address.state}
{billing_detail.address.city}
{billing_detail.address.line1}
{billing_detail.address.line2}
{billing_detail.address.postal_code}
{shipping_detail.address.country}
{shipping_detail.address.state}
{shipping_detail.address.city}
{shipping_detail.address.line1}
{shipping_detail.address.line2}
{shipping_detail.address.postal_code}
{error.message}
{receipt.url}
{payment_intent_id}

Metadata merge field (Pro Only)

Metadata is a powerful feature that allows you to store all the submitted form data, which can be leveraged to populate email templates with field names. This information can also be found in the Stripe Dashboard.

The {metadata} is a formatted key-value string including the specified metadata (for checkout redirection) or form values (for payment form)

We can split them by giving an existing key. For example, if a form id key is called 'first_name', we can use it in email as {metadata.first_name}

Customize Default Template Colors (Pro Only)

We provide a default template for email notifications, but you can easily customize its theme to match your brand’s colors. The following color settings are available:

Base Color: #4a90e2
Background Color: #f7f7f7
Body Background Color: #ffffff
Body Text Color: #3c3c3c

The body content remains unchanged and can be configured in the email content editor (available for all three email types).

Once you unlock this feature, you’ll see the Customize Email Template section, where you can modify the supported colors.

To style button links as shown above, switch the editor to Code Mode and add the class button to your link:

<a class="button" href="{receipt.url}" target="_self">View Receipt</a>

Override the Default Template Layout (Pro Only)

If you want more control over your email template—beyond just colors—you can fully customize the layout, including headers, footers, and other structural elements.

To override the default template, place an HTML file named default.html in your theme folder at:

{themefolder}/elementor-pay-addons/emails/default.html

This custom template supports all email and payment merge fields.

A special merge field, {{__email_body__}} (wrapped in double braces), is reserved for dynamic content replacement. This ensures the email body you configure in the editor is automatically inserted into your custom template.

<!-- Your custom template structure -->  
<div class="email-container">  
    {{__email_body__}}  
</div>

A full example file:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html dir="ltr" lang="en">
  <head>
    <link
      rel="preload"
      as="image"
      href="https://payaddons.com/wp-content/uploads/2025/01/logo-blue.png" />
    <meta content="text/html; charset=UTF-8" http-equiv="Content-Type" />
    <meta name="x-apple-disable-message-reformatting" />
    <!--$-->
  </head>
  <body
    style='background-color:#f6f9fc;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Ubuntu,sans-serif'>
    <table
      align="center"
      width="100%"
      border="0"
      cellpadding="0"
      cellspacing="0"
      role="presentation"
      style="max-width:37.5em;background-color:#ffffff;margin:0 auto;padding:20px 0 48px;margin-bottom:64px">
      <tbody>
        <tr style="width:100%">
          <td>
            <table
              align="center"
              width="100%"
              border="0"
              cellpadding="0"
              cellspacing="0"
              role="presentation"
              style="padding:0 48px; color:#525f7f">
              <tbody>
                <tr>
                  <td>
                    <img
                      alt="payaddons"
                      height="21"
                      src="https://payaddons.com/wp-content/uploads/2025/01/logo-blue.png"
                      style="display:block;outline:none;border:none;text-decoration:none"
                      width="100" />
                    <hr
                      style="width:100%;border:none;border-top:1px solid #eaeaea;border-color:#e6ebf1;margin:20px 0" />
                    <p
                      style="font-size:16px;line-height:24px;color:#525f7f;text-align:left;margin-bottom:16px;margin-top:16px">
                      Thanks for submitting your account information.
                      You&#x27;re now ready to make live transactions with
                      Stripe!
                    </p>
                    <hr
                      style="width:100%;border:none;border-top:1px solid #eaeaea;border-color:#e6ebf1;margin:20px 0" />
                    {{__email_body__}}
                    <p
                      style="font-size:16px;line-height:24px;color:#525f7f;text-align:left;margin-bottom:16px;margin-top:16px">
                      — The payaddons dev team
                    </p>
                    <hr
                      style="width:100%;border:none;border-top:1px solid #eaeaea;border-color:#e6ebf1;margin:20px 0" />
                    <p
                      style="font-size:12px;line-height:16px;color:#8898aa;margin-bottom:16px;margin-top:16px">
                      Stripe, 354 Oyster Point Blvd, South San Francisco, CA
                      94080
                    </p>
                  </td>
                </tr>
              </tbody>
            </table>
          </td>
        </tr>
      </tbody>
    </table>
    <!--/$-->
  </body>
</html>

PreviousCheckout Redirect Form (Pro)NextDecimal Form Field (Pro)

Last updated 12 days ago

In most cases, site owners want to receive notifications during payment processing, such as when a payment is successful or failed, and even do some automation tasks with email.

Prerequisites

WP SMTP provider works

Supported Emails

We currently offer notifications for three event types:

Payment Succeeded
Payment Failed
Customer Invoice

These can be enabled/disabled and customized individually to match your site's style. Let us know if any other email notifications would be helpful for your workflow and we'll consider adding them.

When specifying recipient(s), you can enter multiple emails separated by commas. For example:

{customer.email},

Supported merge fields:

The following merge tags can be used to dynamically insert data into the email content:

Note: Some fields may be empty depending on the payment type - for example, shipping details may be empty if no shipping required when collect payment information

{site_title}
{site_url}
{header_text}

{amount}
{description}
{currency}
{created}
{format_date}
{format_time}
{amount_currency}
{matedata}
{payment_method.type}
{payment_method.card.brand}
{payment_method.card.last4}
{customer.name}
{customer.email}
{customer.phone}
{customer.address.country}
{customer.address.state}
{customer.address.city}
{customer.address.line1}
{customer.address.line2}
{customer.address.postal_code}
{billing_detail.address.country}
{billing_detail.address.state}
{billing_detail.address.city}
{billing_detail.address.line1}
{billing_detail.address.line2}
{billing_detail.address.postal_code}
{shipping_detail.address.country}
{shipping_detail.address.state}
{shipping_detail.address.city}
{shipping_detail.address.line1}
{shipping_detail.address.line2}
{shipping_detail.address.postal_code}
{error.message}
{receipt.url}
{payment_intent_id}

Metadata merge field (Pro Only)

The {metadata} is a formatted key-value string including the specified metadata (for checkout redirection) or form values (for payment form)

We can split them by giving an existing key. For example, if a form id key is called 'first_name', we can use it in email as {metadata.first_name}

Customize Default Template Colors (Pro Only)

We provide a default template for email notifications, but you can easily customize its theme to match your brand’s colors. The following color settings are available:

Base Color: #4a90e2
Background Color: #f7f7f7
Body Background Color: #ffffff
Body Text Color: #3c3c3c

The body content remains unchanged and can be configured in the email content editor (available for all three email types).

Once you unlock this feature, you’ll see the Customize Email Template section, where you can modify the supported colors.

To style button links as shown above, switch the editor to Code Mode and add the class button to your link:

<a class="button" href="{receipt.url}" target="_self">View Receipt</a>

Override the Default Template Layout (Pro Only)

If you want more control over your email template—beyond just colors—you can fully customize the layout, including headers, footers, and other structural elements.

To override the default template, place an HTML file named default.html in your theme folder at:

{themefolder}/elementor-pay-addons/emails/default.html

This custom template supports all email and payment merge fields.

<!-- Your custom template structure -->  
<div class="email-container">  
    {{__email_body__}}  
</div>

A full example file:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html dir="ltr" lang="en">
  <head>
    <link
      rel="preload"
      as="image"
      href="https://payaddons.com/wp-content/uploads/2025/01/logo-blue.png" />
    <meta content="text/html; charset=UTF-8" http-equiv="Content-Type" />
    <meta name="x-apple-disable-message-reformatting" />
    <!--$-->
  </head>
  <body
    style='background-color:#f6f9fc;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Ubuntu,sans-serif'>
    <table
      align="center"
      width="100%"
      border="0"
      cellpadding="0"
      cellspacing="0"
      role="presentation"
      style="max-width:37.5em;background-color:#ffffff;margin:0 auto;padding:20px 0 48px;margin-bottom:64px">
      <tbody>
        <tr style="width:100%">
          <td>
            <table
              align="center"
              width="100%"
              border="0"
              cellpadding="0"
              cellspacing="0"
              role="presentation"
              style="padding:0 48px; color:#525f7f">
              <tbody>
                <tr>
                  <td>
                    <img
                      alt="payaddons"
                      height="21"
                      src="https://payaddons.com/wp-content/uploads/2025/01/logo-blue.png"
                      style="display:block;outline:none;border:none;text-decoration:none"
                      width="100" />
                    <hr
                      style="width:100%;border:none;border-top:1px solid #eaeaea;border-color:#e6ebf1;margin:20px 0" />
                    <p
                      style="font-size:16px;line-height:24px;color:#525f7f;text-align:left;margin-bottom:16px;margin-top:16px">
                      Thanks for submitting your account information.
                      You&#x27;re now ready to make live transactions with
                      Stripe!
                    </p>
                    <hr
                      style="width:100%;border:none;border-top:1px solid #eaeaea;border-color:#e6ebf1;margin:20px 0" />
                    {{__email_body__}}
                    <p
                      style="font-size:16px;line-height:24px;color:#525f7f;text-align:left;margin-bottom:16px;margin-top:16px">
                      — The payaddons dev team
                    </p>
                    <hr
                      style="width:100%;border:none;border-top:1px solid #eaeaea;border-color:#e6ebf1;margin:20px 0" />
                    <p
                      style="font-size:12px;line-height:16px;color:#8898aa;margin-bottom:16px;margin-top:16px">
                      Stripe, 354 Oyster Point Blvd, South San Francisco, CA
                      94080
                    </p>
                  </td>
                </tr>
              </tbody>
            </table>
          </td>
        </tr>
      </tbody>
    </table>
    <!--/$-->
  </body>
</html>