Install the Wolfram Notebook Embedder Library

Install this library to embed a cloud notebook into a webpage and interact with it using JavaScript.

Using a Script Tag from a CDN...

Get the library

Go to the relevant HTML file and enter the following to import the library with a cross-origin request:

<script crossorigin src=""></script>

Use the library

Create a container where you want to render the notebook in the HTML file:

<div id="notebookContainer"></div>

Embed a notebook into the given DOM node:

    {allowInteract: true}

Using an Import Statement...

This Workflow uses npm and webpack. For more detailed information about webpack, refer to their documentation.

Verify that Node.js is installed

Call node -v from the command line:

$ node -v

Set up the project

Create a directory that holds all of the files and change into that directory:

$ mkdir wolfram-notebook-webpack && cd wolfram-notebook-webpack

Initialize npm with defaults:

$ npm init -y

Install webpack locally:

$ npm install webpack --save-dev

Install the webpack-cli to run webpack on the command line:

$ npm install webpack-cli --save-dev

Create a project structure that looks like the following:

    |- package.json
    |- package-lock.json
    |- /node_modules
    |- /src
        |- index.js
    |- /dist
        |- index.html

Get the library

Install the library locally into the parent wolfram-notebook-webpack directory with npm:

npm install --save wolfram-notebook-embedder

Use the library

Change into the distribution subdirectory:

$ cd dist

Open index.html and create a container where you want to render the notebook:

<div id="notebookContainer"></div>

Change into the source subdirectory:

$ cd ../src

Open index.js, import the library and embed a notebook into the given DOM node:

import * as WolframNotebookEmbedder from 'wolfram-notebook-embedder';

    {allowInteract: true}

Create the build

Change into the parent directory:

$ cd ..

Open the package.json file and change the value of the dependencies key to the following:

"dependencies": {
    "wolfram-notebook-embedder": "^0.1.5"

Use npx to create the build:

$ npx webpack


The library exposes an embed function that renders a notebook into a DOM node. It returns a Promise that resolves to an object with various methods to further interact with and control the notebook. See the Wolfram Notebook Embedder library interface documentation for more information.