Add reviews or client testimonials to your emails
The Testimonial in Pine comes in very handy when you need to add a quote or user message to your emails.
Avatar
Centered, with a user avatar image and some text.
<table cellpadding="0" cellspacing="0" role="presentation" width="100%">
<tr>
<td class="px-sm-30" align="center">
<div class="spacer py-sm-20" style="line-height: 40px;"></div>
<table cellpadding="0" cellspacing="0" role="presentation">
<tr>
<td class="col" align="center" width="500">
<img src="https://i.imgur.com/pX1z2AY.png" alt="Avatar" width="50">
<h3 style="font-weight: 300; font-style: italic;">Sometimes when you innovate, you make mistakes. It is best to admit them quickly, and get on with improving your other innovations.</h3>
<small style="color: #969AA1; text-transform: uppercase;">Steve Jobs</small>
</td>
</tr>
</table>
<div class="spacer py-sm-20" style="line-height: 40px;"></div>
</td>
</tr>
</table>Border
Simple, with left-aligned text, and a thin border on the left.
<table cellpadding="0" cellspacing="0" role="presentation" width="100%">
<tr>
<td class="px-sm-30" style="padding: 0 60px;">
<div class="spacer py-sm-20" style="line-height: 40px;"></div>
<table cellpadding="0" cellspacing="0" role="presentation" width="100%">
<tr>
<td class="col pl-sm-30" width="550" style="border-left: 1px solid #EEEEEE; padding-left: 30px;">
<h3 style="font-weight: 500; font-style: italic; margin-top: 0;">Sometimes when you innovate, you make mistakes. It is best to admit them quickly, and get on with improving your other innovations.</h3>
<small style="color: #969AA1; text-transform: uppercase;">Steve Jobs</small>
</td>
</tr>
</table>
<div class="spacer py-sm-20" style="line-height: 40px;"></div>
</td>
</tr>
</table>Icon
Similar to the previous one, this Testimonial removes the left border in favour of a quote icon.
<table cellpadding="0" cellspacing="0" role="presentation" width="100%">
<tr>
<td style="padding: 0 20px;">
<div class="spacer py-sm-20" style="line-height: 40px;"></div>
<table cellpadding="0" cellspacing="0" role="presentation" width="100%">
<tr>
<td class="col" width="550" style="padding: 0 10px;">
<img src="https://i.imgur.com/U1j9njD.png" alt="Quote" width="33">
<h3 style="font-weight: 500; font-style: italic;">Sometimes when you innovate, you make mistakes. It is best to admit them quickly, and get on with improving your other innovations.</h3>
<small style="color: #969AA1; text-transform: uppercase;">Steve Jobs</small>
</td>
</tr>
</table>
<div class="spacer py-sm-20" style="line-height: 40px;"></div>
</td>
</tr>
</table>