Blog

Ideas, tips and news about online marketing – Infusionsoft – WordPress.

Creating a Callout Box in Infusionsoft Emails

Creating a box with a pretty background color — and text and a link in it — is not possible in the Drag & Drop Builder. That’s a frustrating (non-feature) — but a little bit of HTML coding can take care of that for you.

Here’s a simple tutorial to workaround that with a little bit of HTML coding.

The result will look like this callout box (below):

 

Infusionsoft---Screenshot-featuring-Callout-Box

To do it:

♦ Create an email template under:

Marketing > Templates  

♦ Click on the Add a Template dropdown box – and select Email

♦ Click on Edit Email Body Box

♦ Click on a spot on the email where you want to insert the Callout box

♦ Select Snippets Tab Then, the HTML box option

IS - Screenshot - HTML Snippet

♦ Revise this Coding Box to insert the correct LINK in the URL section.

♦ Revise the text that you want to insert in the Callout box

<!--CallOUtBox-->
<table class="CallOutBlueBox" style="margin: 0 auto; padding: 15px; width: 600px; display: block;">
<tbody>
<tr style="margin: 0; padding: 0;">
<td style="margin: 0; padding: 0; background-color: #ecf8ff;">
<p class="callout" style="margin: 0; padding: 15px; font-family: Helvetica, Arial; margin-bottom: 15px; font-weight: normal; font-size: 14px; line-height: 1.6; background-color: #ecf8ff;">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt. <a style="margin: 0; padding: 0; font-family: Helvetica, Arial; color: #2ba6cb; font-weight: bold; font-size: 18px;" href="INSERT URL HERE">CLICK HERE »</a></p>
&nbsp;</td>
</tr>
</tbody>
</table>

♦ Cut and paste into the HTML snippet box

Comments on this entry are closed.