Adding HTML Columns Inside Emails

Sometimes the built-in elements of Groundhogg are not enough for creating the wondrous emails you want to create. That’s why Groundhogg comes with an HTML editor that users can use to edit the HTML directly and create emails they like.

You will need to have the advanced features extension to do this, it is included in the basic plan (and above) or you can purchase it separately.

To start, open the email you want to add columns to and toggle the HTML mode.

Copy the HTML code below, we're going to paste it into the raw HTML of the email.

<table border="0" cellpadding="5" cellspacing="0" width="100%" class="">
    <tbody>
        <tr>
            <td align="left" valign="top" width="50%">
                <!--LEFT COLUMN CODE START-->
                <div class="inner-content">
                    <p> Column 1</p>
                </div>
                <!--LEFT COLUMN CODE END-->
            </td>
            <td align="left" valign="top" width="50%">
                <!--RIGHT COLUMN CODE START-->
                <div class="inner-content">
                    <p> Column 2 </p>
                </div>
                <!--RIGHT COLUMN CODE END-->
            </td>
        </tr>
    </tbody>
</table>

When pasting in the HTML, you want to paste it in between the existing blocks. So in between the left column and right column with your custom code. You can also add more columns by copying adding more TD tag.

Best practice will be to create a single column using email builder then copy all the auto-generated code and past that inside the specific column. You can also turn on the border by setting border =”1″ inside the table tag.