Preview HTML Code in Coda

Hello everyone !

I’m trying to render a preview of an HTML Email built with the HTML Email Builder by @BenLee
I’ve managed to do just that, but the workflow is dumb…

Currently :

  • I download the HTML code that resides in my table thanks to the Temp File Pack by @Eric_Koleda as “email-myclientname.html”
  • A python script running on my computer watches the download folder, cuts the downloaded html file (using regex to match the file name), then pastes it on my pCloud public folder, which has a fixed url I know and can reconstruct with the file name.
  • I embed() the url of the html file on my doc and voilà ! I have the preview of the html email

Once the embed with the correct target URL is set up, it takes one click to have the updated email preview, but this is not clean nor scalable, and cannot be completed without a python script running and access to my pCloud account… so it’s somewhat garbage !

I tried to look into building a pack to connect to the pCloud API, but I got out of my depth, it didn’t yield any result and I moved on.

If you have any ideas on what’s the right way of doing this exactly, I’d be glad to read them :slight_smile:
Thanks in advance !

Interesting solution! I propose having a look at this by @Paul_Danyliuk1 and @Artem_F:

Oh, that is interesting. I shall geek out on this a bit longer then !
Thx for the pointer @Rickard_Abraham Rickard.

Ok so that’s a neat trick ! Although the images are not loading properly without right-clicking and opening in a new window :frowning:. But hey it’s still something !

1 Like

If you could convert the images to raw SVGs there might be a chance you could render them :slight_smile:

1 Like

Alright, after some testing, both of those approach are a bit jenky for my use. I’ll just settle with having a button to copy the html data to the clipboard and open JSbin in a new window then paste it there.

Anywho, thanks for the ideas @Rickard_Abraham

1 Like

For my own needs I ended up creating a Pack that may help you as well:

It passes the HTML in the embed URL, which runs into browser and other limits sooner than I’d like. That said, you’re free to give it a try!

1 Like

This will give you a preview of HTML and CSS in Coda without a pack or hidden formulas…

Based on the @Paul_Danyliuk ‘mega-trick’ below

it uses an SVG document to include HTML as a foreign object

input the HTML body,

and the CSS styling (if any)

and it will use those to build an SVG image that renders the HTML for you

This topic was automatically closed 90 days after the last reply. New replies are no longer allowed.