it's possible to integrate an observable notebook in a static blog?

I came to this tool from explorable explanations (http://explorabl.es/) and I think that is a wonderful tool to generate insights and explain in a very interactive way.

I want to know if exist someway to integrate an observable notebook to a static site like a blog. I’m not an expert with web tools, but for example, using site generators like jekyll or hugo? (example rmarkdown with blogdown package to integrate r code and markdown syntax to generate static sites with hugo). Actually is possible to integrate an observable notebook as a post in my static stite? a way to import as an html?

An interesting potential utility is to create publication as the one you can find in distill (see this one for example, https://distill.pub/2017/momentum/).

Thx in advance!

2 Likes

Hi,

Yep! See the threads about exporting final code - we’re planning on & working on both iframe-style embeds and a way to export notebooks to run them with an open source runtime.

2 Likes

@alcazar90,

This morning we launched embeddable and downloadable notebooks as ES modules, and you can now (hopefully) easily embed them, or specific parts of them, in a post on your website.

For the full details, see this introduction:

3 Likes

Great resource @jashkenas !

The easiest way for me in the article was https://visionscarto.net/observable-jekyll/ (third example). But I have some troubles with manage the size with this approach…any help to find resource on how to deal with the width adjustemnts!

Regards!

The default width is an Observable standard library reactive variable that listens to the width of the page.

For exporting your sketch to your own blog, I’d recommend setting the appropriate width yourself.

Relevant link to demonstrate how to override the definition of width:

1 Like

Nice! Is it possible now to embed using iframes?