Email Template (HTML)
If you want your NPS question to be embedded directly into your email, copy the HTML below into your Klaviyo email template. Alternatively, you can add a button or link to your email that links to your landing page.
If the NPS is embedded directly in an email, users can click the link and have their rating automatically submitted. If the rating is not provided in the URL, the NPS question will be displayed on the landing page so the customer can provide their response. Any configured follow up questions will be displayed after the response is submitted. After the follow up question response is provided, the success message (as configured in the Fairing app) will be displayed, unless there are other questions targeted to your landing page in your Question Stream.
Email Preview
HTML Email Preview
Email HTML
Replace ADD LANDING PAGE URL everywhere it appears in the HTML (lines 42, 62, 82, 101, 120, 139, 158, 177, 196, 215, 234, 273 and 280) with your actual landing page URL.
Note: Do not remove the content after the ? only replace the text ADD LANDING PAGE URL text
<html>
<head>
<title>
On a scale from 0 to 10, how likely are you to recommend our product/company to a friend or colleague?
</title>
</head>
<body>
<div>
<div>
<div>
<div>
<div>
<table border="0" cellpadding="0" role="presentation" style="width:100% !important;line-height:24px !important;margin :0;padding:0" width="100%">
<tbody>
<tr>
<td align="center" bgcolor="#FFFFFF" dir="ltr" height="46" style="border-top: 6px solid rgb(0, 66, 74 ); height: 46px; padding: 19px 0px; background-color: transparent !important;" valign="middle">
</td>
</tr>
<tr>
<td align="center" bgcolor="#F6F6F6" style="border-top: 1px solid rgb(227, 227, 227); background- color: transparent !important;">
<table border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:534px;min-width:534px;margin:0 23px" width="534">
<tbody>
<tr>
<td align="center" style="padding:18px 0">
<table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:374px" width="374">
<tbody>
<tr>
<td align="center" dir="ltr" style="font-size:22px !important; font-family:'Helvetica Neue', Helvetica, Arial, sans-serif !important; font-weight:normal !important; line-height:30px !important; color:#111111 !important; text-align:center !important;">
How likely are you to recommend us to a friend?
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td align="center">
<table align="right" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:44px;height:44px" width="44">
<tbody>
<tr>
<td align="center" bgcolor="#FFFFFF" height="40" style="width: 42px; height: 40px; border-radius: 6px; box-shadow: rgba(0, 0, 0, 0.06) 0px 2px 4px 0px; border-color: rgb(204, 204, 204); border-style: solid; bor der-width: 1px 1px 3px; background-color: transparent !important;" valign="middle" width="42">
<a aria-label="10, Very likely" href="ADD LANDING PAGE URL?i={{ event.extra.id|default:'' }}&r=10" rel="noopener noreferrer" style="display:block;line-height:40px;text-decoration:none;font-size:18px;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-weight:bold" target="_blank">
<span dir="ltr" style="color: #00424A;">
10<span style="color:#E34424;display:none;visibility:hidden;overflow:hidden;line-height:0; font-size:0">
Very Likely
</span></span>
</a>
</td>
</tr>
</tbody>
</table>
<table align="right" border="0" cellpadding="0" cellspacing="0" data-spacer="" role="presentation" style="width:5px;height:44px" width="5">
<tbody>
<tr>
<td height="44" style="width:5px;height:44px;line-height:0;font-size:0" width="5">
</td>
</tr>
</tbody>
</table>
<table align="right" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:44px;height:44px" width="44">
<tbody>
<tr>
<td align="center" bgcolor="#FFFFFF" height="40" style="width: 42px; height: 40px; border-radius: 6px; box-shadow: rgba(0, 0, 0, 0.06) 0px 2px 4px 0px; border-color: rgb(204, 204, 204); border-style: solid; bor der-width: 1px 1px 3px; background-color: transparent !important;" valign="middle" width="42"> <a aria-label="10, Very likely" href="ADD LANDING PAGE URL?i={{ event.extra.id|default:'' }}&r=9" rel="noopener noreferrer" style="display:block;line-height:40px;text-decoration:none;font-size:18px;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-weight:bold" target="_blank">
<span dir="ltr" style="color: #00424A;">
9</span>
</a>
</td>
</tr>
</tbody>
</table>
<table align="right" border="0" cellpadding="0" cellspacing="0" data-spacer="" role="presentation" style="width:5px;height:44px" width="5">
<tbody>
<tr>
<td height="44" style="width:5px;height:44px;line-height:0;font-size:0" width="5">
</td>
</tr>
</tbody>
</table>
<table align="right" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:44px;height:44px" width="44">
<tbody>
<tr>
<td align="center" bgcolor="#FFFFFF" height="40" style="width: 42px; height: 40px; border-radius: 6px; box-shadow: rgba(0, 0, 0, 0.06) 0px 2px 4px 0px; border-color: rgb(204, 204, 204); border-style: solid; bor der-width: 1px 1px 3px; background-color: transparent !important;" valign="middle" width="42"> <a aria-label="10, Very likely" href="ADD LANDING PAGE URL?i={{ event.extra.id|default:'' }}&r=8" rel="noopener noreferrer" style="display:block;line-height:40px;text-decoration:none;font-size:18px;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-weight:bold" target="_blank">
<span dir="ltr" style="color: #00424A;">
8</span>
</a>
</td>
</tr>
</tbody>
</table>
<table align="right" border="0" cellpadding="0" cellspacing="0" data-spacer="" role="presentation" style="width:5px;height:44px" width="5">
<tbody>
<tr>
<td height="44" style="width:5px;height:44px;line-height:0;font-size:0" width="5">
</td>
</tr>
</tbody>
</table>
<table align="right" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:44px;height:44px" width="44">
<tbody>
<tr>
<td align="center" bgcolor="#FFFFFF" height="40" style="width: 42px; height: 40px; border-radius: 6px; box-shadow: rgba(0, 0, 0, 0.06) 0px 2px 4px 0px; border-color: rgb(204, 204, 204); border-style: solid; bor der-width: 1px 1px 3px; background-color: transparent !important;" valign="middle" width="42"> <a aria-label="10, Very likely" href="ADD LANDING PAGE URL?i={{ event.extra.id|default:'' }}&r=7" rel="noopener noreferrer" style="display:block;line-height:40px;text-decoration:none;font-size:18px;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-weight:bold" target="_blank">
<span dir="ltr" style="color: #00424A;">
7</span>
</a>
</td>
</tr>
</tbody>
</table>
<table align="right" border="0" cellpadding="0" cellspacing="0" data-spacer="" role="presentation" style="width:5px;height:44px" width="5">
<tbody>
<tr>
<td height="44" style="width:5px;height:44px;line-height:0;font-size:0" width="5">
</td>
</tr>
</tbody>
</table>
<table align="right" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:44px;height:44px" width="44">
<tbody>
<tr>
<td align="center" bgcolor="#FFFFFF" height="40" style="width: 42px; height: 40px; border-radius: 6px; box-shadow: rgba(0, 0, 0, 0.06) 0px 2px 4px 0px; border-color: rgb(204, 204, 204); border-style: solid; bor der-width: 1px 1px 3px; background-color: transparent !important;" valign="middle" width="42"> <a aria-label="10, Very likely" href="ADD LANDING PAGE URL?i={{ event.extra.id|default:'' }}&r=6" rel="noopener noreferrer" style="display:block;line-height:40px;text-decoration:none;font-size:18px;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-weight:bold" target="_blank">
<span dir="ltr" style="color: #00424A;">
6</span>
</a>
</td>
</tr>
</tbody>
</table>
<table align="right" border="0" cellpadding="0" cellspacing="0" data-spacer="" role="presentation" style="width:5px;height:44px" width="5">
<tbody>
<tr>
<td height="44" style="width:5px;height:44px;line-height:0;font-size:0" width="5">
</td>
</tr>
</tbody>
</table>
<table align="right" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:44px;height:44px" width="44">
<tbody>
<tr>
<td align="center" bgcolor="#FFFFFF" height="40" style="width: 42px; height: 40px; border-radius: 6px; box-shadow: rgba(0, 0, 0, 0.06) 0px 2px 4px 0px; border-color: rgb(204, 204, 204); border-style: solid; bor der-width: 1px 1px 3px; background-color: transparent !important;" valign="middle" width="42"> <a aria-label="10, Very likely" href="ADD LANDING PAGE URL?i={{ event.extra.id|default:'' }}&r=5" rel="noopener noreferrer" style="display:block;line-height:40px;text-decoration:none;font-size:18px;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-weight:bold" target="_blank">
<span dir="ltr" style="color: #00424A;">
5</span>
</a>
</td>
</tr>
</tbody>
</table>
<table align="right" border="0" cellpadding="0" cellspacing="0" data-spacer="" role="presentation" style="width:5px;height:44px" width="5">
<tbody>
<tr>
<td height="44" style="width:5px;height:44px;line-height:0;font-size:0" width="5">
</td>
</tr>
</tbody>
</table>
<table align="right" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:44px;height:44px" width="44">
<tbody>
<tr>
<td align="center" bgcolor="#FFFFFF" height="40" style="width: 42px; height: 40px; border-radius: 6px; box-shadow: rgba(0, 0, 0, 0.06) 0px 2px 4px 0px; border-color: rgb(204, 204, 204); border-style: solid; bor der-width: 1px 1px 3px; background-color: transparent !important;" valign="middle" width="42"> <a aria-label="10, Very likely" href="ADD LANDING PAGE URL?i={{ event.extra.id|default:'' }}&r=4" rel="noopener noreferrer" style="display:block;line-height:40px;text-decoration:none;font-size:18px;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-weight:bold" target="_blank">
<span dir="ltr" style="color: #00424A;">
4</span>
</a>
</td>
</tr>
</tbody>
</table>
<table align="right" border="0" cellpadding="0" cellspacing="0" data-spacer="" role="presentation" style="width:5px;height:44px" width="5">
<tbody>
<tr>
<td height="44" style="width:5px;height:44px;line-height:0;font-size:0" width="5">
</td>
</tr>
</tbody>
</table>
<table align="right" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:44px;height:44px" width="44">
<tbody>
<tr>
<td align="center" bgcolor="#FFFFFF" height="40" style="width: 42px; height: 40px; border-radius: 6px; box-shadow: rgba(0, 0, 0, 0.06) 0px 2px 4px 0px; border-color: rgb(204, 204, 204); border-style: solid; bor der-width: 1px 1px 3px; background-color: transparent !important;" valign="middle" width="42"> <a aria-label="10, Very likely" href="ADD LANDING PAGE URL?i={{ event.extra.id|default:'' }}&r=3" rel="noopener noreferrer" style="display:block;line-height:40px;text-decoration:none;font-size:18px;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-weight:bold" target="_blank">
<span dir="ltr" style="color: #00424A;">
3</span>
</a>
</td>
</tr>
</tbody>
</table>
<table align="right" border="0" cellpadding="0" cellspacing="0" data-spacer="" role="presentation" style="width:5px;height:44px" width="5">
<tbody>
<tr>
<td height="44" style="width:5px;height:44px;line-height:0;font-size:0" width="5">
</td>
</tr>
</tbody>
</table>
<table align="right" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:44px;height:44px" width="44">
<tbody>
<tr>
<td align="center" bgcolor="#FFFFFF" height="40" style="width: 42px; height: 40px; border-radius: 6px; box-shadow: rgba(0, 0, 0, 0.06) 0px 2px 4px 0px; border-color: rgb(204, 204, 204); border-style: solid; bor der-width: 1px 1px 3px; background-color: transparent !important;" valign="middle" width="42"> <a aria-label="10, Very likely" href="ADD LANDING PAGE URL?i={{ event.extra.id|default:'' }}&r=2" rel="noopener noreferrer" style="display:block;line-height:40px;text-decoration:none;font-size:18px;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-weight:bold" target="_blank">
<span dir="ltr" style="color: #00424A;">
2</span>
</a>
</td>
</tr>
</tbody>
</table>
<table align="right" border="0" cellpadding="0" cellspacing="0" data-spacer="" role="presentation" style="width:5px;height:44px" width="5">
<tbody>
<tr>
<td height="44" style="width:5px;height:44px;line-height:0;font-size:0" width="5">
</td>
</tr>
</tbody>
</table>
<table align="right" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:44px;height:44px" width="44">
<tbody>
<tr>
<td align="center" bgcolor="#FFFFFF" height="40" style="width: 42px; height: 40px; border-radius: 6px; box-shadow: rgba(0, 0, 0, 0.06) 0px 2px 4px 0px; border-color: rgb(204, 204, 204); border-style: solid; bor der-width: 1px 1px 3px; background-color: transparent !important;" valign="middle" width="42"> <a aria-label="10, Very likely" href="ADD LANDING PAGE URL?i={{ event.extra.id|default:'' }}&r=1" rel="noopener noreferrer" style="display:block;line-height:40px;text-decoration:none;font-size:18px;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-weight:bold" target="_blank">
<span dir="ltr" style="color: #00424A;">
1</span>
</a>
</td>
</tr>
</tbody>
</table>
<table align="right" border="0" cellpadding="0" cellspacing="0" data-spacer="" role="presentation" style="width:5px;height:44px" width="5">
<tbody>
<tr>
<td height="44" style="width:5px;height:44px;line-height:0;font-size:0" width="5">
</td>
</tr>
</tbody>
</table>
<table align="right" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:44px;height:44px" width="44">
<tbody>
<tr>
<td align="center" bgcolor="#FFFFFF" height="40" style="width: 42px; height: 40px; border-radius: 6px; box-shadow: rgba(0, 0, 0, 0.06) 0px 2px 4px 0px; border-color: rgb(204, 204, 204); border-style: solid; bor der-width: 1px 1px 3px; background-color: transparent !important;" valign="middle" width="42"> <a aria-label="10, Very likely" href="ADD LANDING PAGE URL?i={{ event.extra.id|default:'' }}&r=0" rel="noopener noreferrer" style="display:block;line-height:40px;text-decoration:none;font-size:18px;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-weight:bold" target="_blank">
<span dir="ltr" style="color: #00424A;">
0<span style="color:#E34424;display:none;visibility:hidden;overflow:hidden;line-height:0; font-size:0">
Not Likely
</span></span>
</a>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td style="padding:18px 0">
<table aria-hidden="true" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%" width="100%">
<tbody>
<tr>
<td align="left" style="font-size:18px;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;color:#777777; width:50%;text-align:left" width="50%">
Not likely
</td>
<td align="right" style="font-size:18px;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;color:#777777; width:50%;text-align:right" width="50%">
Very likely
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td align="center" bgcolor="#FFFFFF" height="46" style="border-top: 1px solid rgb(227, 227, 227); height: 46px; background-color: transparent !important;">
<p style="font-size:14px;font-family:'Helvetica Neue', Helvetica, Arial, sans -serif;"> <strong>
Survey not displaying?<br/>
Follow the link below
</strong>
<br/>
<a href="ADD LANDING PAGE URL?i={{ event.extra.id|default:'' }}" rel="noopener noreferrer" target="_blank">
Take the Survey
</a>
</p>
<p style="font-size:14px;font-family:'Helvetica Neue', Helvetica, Arial, sans -serif;">
Or copy and paste the URL below into your internet
browser:<br/>
<a href="ADD LANDING PAGE URL?i={{ event.extra.id|default:'' }}" rel="noopener noreferrer" style="word-break:break-word;" target="_blank">
ADD LANDING PAGE URL?i={{ event.extra.id|default:'' }}
</a>
</p>
</td>
</tr>
<tr>
<td align="center" bgcolor="#FFFFFF" height="46" style="border-top: 1px solid rgb(227, 227, 227); height: 46px; background-color: transparent !important;">
<table border="0" cellpadding="0" role="presentation" style="width:534px;min-width:534px;margin:0 23px" width="534">
<tbody>
<tr>
<td align="center" dir="ltr" height="48" style="height:48px; font-size:14px;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;color:#cccccc;width:40%;text-align:left" valign="middle" width="40%"> <a href="{% unsubscribe_link %}" style="color:#cccccc" target="_blank">
Unsubscribe
</a>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</body>
</html>Updated 12 days ago