bookmark_borderCreating Customized Form Notification Emails

If you’re sending notifications that need to have a bit more styling and branding, such as sending order receipts on checkout forms, you will probably want to change the notification email template to better match your particular use-case.

The body of the notification email is able to be formatted with HTML and merge tags. By utilizing HTML, the possibilities are endless. In this article, we’ll give you a basic understanding of how to create a notification email template.

We won’t go too in depth, but the following is an example of content that could be within the email body. Don’t worry, we’ll go over it a bit after the example.

<h1>Email Header</h1>
<img src="https://example.com/image.jpg">
Hello {Name (First):1.3}{Name (Last):1.6},

<div style="margin: 20px;">
<p>This is some body content with a margin around it.</p>
</div>

<p style="color: green;">{form_title}</p>

<p style="color: red;">This could be some footer content.</p>

In the above example, we’re doing the following:

  1. Placing a header within h1 tags to format the content as a header.
  2. Embedding an image using an img tag.
  3. Wrapping some content with a small margin.
  4. Outputting the form title using the {form_title} and styling it with green text.
  5. Outputting static content that is styled with red text.

As you can see, a combination of HTML to create the styles and Gravity Forms merge tags can be used to create a template that will be populated with dynamic content.

If you need more information on how to use HTML to style content, the following resources are suggested: