Hello @Don,

Thanks for sharing your question with the Klaviyo Community.

The tags can be added in before or after you import the HTML. Also, if you have not done so already, I recommend reviewing our documentation on adding drag and drop support to a Klaviyo template for more information.

Also, we only recommend using custom HTML for technically savvy marketers, or for anyone who has access to a developer. While our product does support custom HTML, our  team cannot help you build out your custom templates beyond offering the general guidance covered in this documentation.

Thanks for being a member of the Community. 

Thanks for the reply. I’ve reviewed all the docs several times, but none specifically address my question (AFAICT). I was hoping that by dropping in the above code, I would get an editable block in my template that would function just like the native drag-n-drop blocks. Instead I get the screenshot with “Editable” hovering over it. Technically, it is editable, but not in the seamless way the native blocks are. Especially for the image where you have no easy way to swap it for another image. Does that help clarify my question? Thanks!

Hi @Don,

Thanks for your reply.

The template will not appear in the drag-and-drop editor until you use it in a campaign or flow email. It will remain as custom code in the Template Library view. Once it’s in a campaign or flow email it will be fully customizable. 

Hi Dov,

That’s what I was expecting, but the screenshot above is from a campaign I tried setting up using the  drag-n-drop code I inserted to a text area in the template. That’s the point where I figured I needed some help. Thanks!

Hi @Don,

Yes it sounds like something funky is going on in between...a colleague of mine put together a short loom video on this (using the example of inserting a product block) but also includes the basic steps for including an editable text block. Can you try running through these steps? You can find that video here. If you are prompted for a password - it is “klaviyo”. I hope that is helpful. 

Hi Dov,

Thanks for that. I had watched the video previously. The *only* difference is that I am not importing an html template from outside Klaviyo. I am starting with a KL drag-n-drop template, and adding a bit of custom html into a text block. (See original post for a sample of the html).

From there I save the template and and add it into a campaign. At that point all I see are the little ‘editable’ boxes over my block. I’m not able to edit the content in those areas like you would with a normal KL block. Does that help clarify?

Thanks!

Hi @Don,

I just wanted to clarify that when you add custom HTML to a text block in Klaviyo’s drag and drop template editor, that you’ll need to add it to the “source” section of the block.

I’m also thinking that you may not need to include the tags in the Import a Custom HTML Template with Drag and Drop Support because you are not using a custom HTML template. Rather, you’re using the drag and drop editor and modifying the HTML associated with a text block. Have you done this? As for troubleshooting any errors with how the HTLM renders, you’ll need to consult a web designer as Klaviyo support is unable to troubleshoot any custom HTML work.

I hope this helps!

Julie

Hi Julie,

Thanks for looking at this.

1. I am definitely adding code in the source view
2. Re your second point. When I add straight html to a text block that works fine as far as it goes, but since it always remains as html, it’s not always easy for content creators to work with. I was hoping to be able to insert custom html with KL drag-n-drop tags in it and have the result be a custom block with drag-n-drop support for a non-coder to easily use.
3. No problems with how the html is rendering (I’m a web designer ;)

I feel like I’m either missing something really silly, or what I’m trying to do is not possible!

Don

Hi @Don,

Another thought that I had was rather than using the tags from the HTML/drag and drop help article have you seen our help center article on how to insert an image into a text block? I’m curious if this gets you closer to the look that you’re aiming for when previewing. 

Also, could you clarify your main objective with the image block. It sounds like you are able to accomplish the goal of rendering an image but would like the image to appear as an image rather than HTML in preview? Do I have that correct?

Best,

Julie

Hi Julie,

The goal of this is to create a layout that cannot be achieved using KL’s built-in blocks (via custom html), and then inserting KL’s drag-n-drop code into that html to make the block easier to edit for non-coders.

Re your suggestion: yes that would work, but it comes back to trying to avoid having content creators having to look into the code.

Thanks!

Don

Hey @Don,

Really appreciate you sharing your goal of wanting to build a custom HTML template and incorporating Klaviyo’s drag-and-drop editor functionality to it to make it easier for non-coders to edit. I believe such a feature would be great and can certainly be leveraged by a number of our wonderful members who are content creators to share some of their more custom templates with others. I’ll share this feedback with our product team!

At present though, you have the capability of applying Klaviyo’s drag-and-drop editor functionality to a custom HTML template, when applying this to an existing elements of the HTML template, you are only given limited editing capabilities from the Klaviyo editor. This would not cause the element which you’ve added the drag-and-drop functionality to have the native Klaviyo drag-and-drop capabilities. Instead, by being able to incorporate the drag-and-drop capability to your custom HTML template; this offers you the functionality to drag in any of the native Klaviyo block elements to your custom HTML template such as product or table blocks.

I hope this helps answers some of the confusion! Thanks for being a Klaviyo Community member and sharing your feedback! 

David

Thanks, David. That aligns with what I thought was going on. Disappointed to get confirmation, but good to get it resolved!

Don