Notepad/Markdown: how to output raw HTML?

Hi,

I’m using the Notepad/Markdown widget to take a few notes that I want to embed in a HTML template.

Let’s say I’m using the Notepad for the field $Notes.

This field contains a basic text like “Hello world

I would like to output a raw HTML like <p>Hello <strong>world</strong></p>

Instead of that I get :

  • Hello **world** when using Mardown
  • {"ops":[{"insert":"Hello "},{"attributes":{"bold":true},"insert":"world"},{"insert":"\n\n"}]} when using Notepad

I don’t mind using one widget or the other. Do you think their is a way to output raw HTML with one of these two custom widgets? I saw that Quill editor (which I guess you’re using) is able to do that but I was not successful with quill.root.innerHTML.

Thanks,
Fabien

Hi,

I think the problem is that those two editors expect markdown or custom Delta structure as an input, they don’t know how to work directly with HTML. So you will need to add a second column to your table to store the HTML alongside the actual content (that you can get from those editors).

With Markdown editor you can use txt.markdown("Hello **world**") function that will render HTML for you, and with Quill your code snippet should do the work.

Hi Jarek,

Thanks for your reply! Since the markdown content is contained in $Notes column, I used this:

=txt.markdown($Notes)

It returns an error ("'txt" not defined). I’m not sure how to use your formula (I’m a newbie with python).

To extract HTML content you need to run this code (as a JavaScript function) from within the widget.

To do that you would need to modify one of these widgets’ source codes and host it yourself (on GitHub or any other place you like). Are you comfortable with this? I can send you a complete HTML file for one of those widgets with that modification.

OK I see. If you can send me the file that would be great. I know how to host it. I think I can finish the work :slight_smile:

Here is a source code for the Markdown widget that requires two columns in setup: one for the markdown content, and a second for the HTML content:

Markdown gist

Thank you! That is much more code than I thought. I’ll implement it. Thanks again!