Hello,

I have created a custom HTML e-mail template. Now I would like to implement the e-mail template in a user-friendly way. 

01. I've made a template which contains a fixed header and footer. I want the ability to drag-and-drop content blocks at the place of the code below:

<!-- v Content block v -->

<table cellpadding="0" cellspacing="0" border="0" width="100%">

<tr>

<td align="center" data-klaviyo-region="true" data-klaviyo-region-width-pixels="600">

<div class="klaviyo-block klaviyo-text-block">Sleep HTML content blok</div>

</td>

</tr>

</table>

<!-- ^ Content block ^ -->

02. I've created an universal content block with the following code.

<table cellpadding="0" cellspacing="0" border="0" width="100%">
    <tr>
      <td style="box-sizing: border-box;width:100%;" >
        <table cellpadding="0" cellspacing="0" border="0" style="max-width: 690;" align="center"><tr><td>
            <table class="fullwidth" cellpadding="0" cellspacing="0" border="0" style="margin: 0 auto; background-color:#ecd4ff;" align="center" >
            <tr>
                <td style="padding-bottom:20px;">
                    <a href="https://www.seepje.com" target="_blank"><img src="https://d3k81ch9hvuctc.cloudfront.net/company/RYE9sb/images/d18b8060-d131-4724-8615-43dea1214f26.png" class="fullwidth" alt="Alt-tekst" style="display:block;" ></a>
                </td>
            </tr>
            <tr>
                <td class="padding-lr20" style="padding-left:30px;padding-right:30px;padding-bottom:20px;">
                    <table cellpadding="0" cellspacing="0" border="0" width="100%">
                    <tr>
                    <td style="text-align: center;" align="center">
                        <center>
                        <a class="obvinarrowblack" href="https://www.seepje.com" style="font-family: 'Obviously-NarrowBlack', 'Anton', 'Roboto Condensed', Helvetica, Trebuchet MS, Tahoma, sans-serif; font-size:24px; line-height:26px; background-color:#f2ffa1; text-decoration: none; padding: .6em 2em .8em 2em; color: #014203; display:inline-block; border-radius:2em; mso-padding-alt:0;text-underline-color:#f2ffa1"><!-- if mso]><i style="mso-font-width:200%;mso-text-raise:100%" hidden> </i><span style="mso-text-raise:50%;"><!oendif]-->Lorem ipsum!<!--hif mso]></span><i style="mso-font-width:200%;" hidden>&emsp;&#8203;</i><!gendif]-->
                        </a>
                        </center>
                    </td>
                    </tr>
                    </table>
                </td>
            </tr>
            </table>
        </td></tr></table>
        </td>
    </tr>
</table>

03. I've created an e-mail campaign to combine the first two steps. At the place of the code inside <!-- v Content block v --> I'm able to drag-and-drop the universal content block. I use the "Unlink and edit independently" option to solely edit the content block for this e-mail instance. 

04. Now I'm looking for a possibility to create simple input fields for the marketeers to insert content into the universal content block while editing. They don't want to adjust the e-mail content via the HTML source code, that is currently being displayed in the content block.

Can someone help me how I can implement this smarter/ easier? Or maybe point me in the direction of the corresponding documentation or an agency? 

Looking forward to your response.

Kind regards,
Henri