hypertext literals in Framework

Community Help
1

I guess I don’t understand how to use htl in Observable markdown. I put a line

html`<b>Hi there!</b>`

in my markdown file, expecting to see a greeting in bold on the corresponding page - instead I see html<b>Hi there!</b>. How is this supposed to work? BTW just to be safe I surrounded that line with empty lines. A bit baffled, I tried explicitly importing html on the same page, but nothing changed.

PS I copied and pasted the svg example from the documentation, and that didn’t work either.

1 Like
2

According to Observable’s Markdown documentation, you can simply write HTML directly into Markdown. Thus, you could just write

<b>Hi there!</b>

and that should display as Hi there!

If you want to insert HTML into markdown that’s been built up programmatically, be sure to use proper placeholder interpolation syntax. For example, you might define some HTML in a Javascript cell:

```js
  const s = html`<b>Hi there!</b>`
```

You could then refer to that in Markdown:

Just wanted to say ${s}
1 Like
3

Okay, now I feel silly - I missed the part where the hypertext literal must be in a js block. All’s fine now.

1 Like