Creating a drag and drop functionality in my own HTML

  • 22 May 2021
  • 2 replies

Badge +4

Hi everyone
I code my email templates from scratch and I would like to use the modules I built as drag and drop blocks in Klaviyo, so my clients can create newsletters without my help in the future. 

I tried the method described in this very confusing article where you add the following code to your HTML:

<td align="center" data-klaviyo-region="true" data-klaviyo-region-width-pixels="600">
<div class="klaviyo-block klaviyo-text-block">

But no matter where I insert these snippets — surrounding the <p> or replacing a <td> in the table stack — it doesn't seem to work.

I end up seeing this, but I can't save the blocks or edit them:


What am I doing wrong? 



Best answer by David To 22 May 2021, 15:44

View original

2 replies

Userlevel 7
Badge +60

Hey @Kim Derkx,

Thanks for sharing your question with the Klaviyo Community!

I would recommend taking a look at my comment in a similar Community post made by @RichardGayler below:

In it you’ll find a video created by one of our internal team members which guides you on how to include this specific HTML to your template to offer your custom HTML template drag and drop-functionality. Keep in mind that the template will not appear to have drag-and-drop capability until you’ve included the HTML and used the template in a campaign or flow email. It will remain as a custom code in the Template Library view. 

Hope this helps!


Badge +4

Hi thanks for the quick reply!

I did see that post and video yesterday, and I couldn't make it work at that point. But I started over today and now it does work!! Magic! And I just needed to read your explanation to finally understand, thank you so much!