Embedding Wolfram Notebook's

Mike's Notes

My working notes on building the first plug-in.

Resources

• https://www.wolfram.com/featureset/notebooks/
• https://www.blog.ajabbi.com/2025/03/creating-environment-for-plug-ins.html
• https://wordpress.org/documentation/article/wolfram-embed/
• https://www.wolfram.com/broadcast/video.php?v=455
• https://www.wolfram.com/broadcast/video.php?c=88&v=525
• https://reference.wolfram.com/language/workflow/CreateInteractiveContentForTheWeb.html.en
• https://discover.commoninja.com/wordpress/plugin/wolfram-notebook-embedder
• https://wordpress.org/documentation/article/embeds/
• https://wordpress.org/documentation/article/embed-block/
• https://www.conradwolfram.com/
• https://computerbasedmath.org/
• https://www.w3.org/TR/2014/REC-html5-20141028/embedded-content-0.html#the-iframe-element

Embedding Wolfram Notebook's

By: Mike Peters
04/03/2025

Mike is the inventor and architect of Pipi and the founder of Ajabbi.

I want to visually explain to Ajabbi users the maths that Pipi uses. I am not a mathematician, but I have learned to use maths visually in experiments and for analysing data.

Pipi

Pipi makes use of these kinds of maths:

• Fuzzy Logic
• Markov
• Monte Carlo
• Statistics
• Algorithms
• Etc

Ajabbi SaaS

The applications being built also need to use math directly, and users may need access to mathematical tools. The Pipi Content Management System Engine (CMS) generates the UI and content on every web page, so this means using forms rather than direct coding.

Wolfram

Last year, I took some free online training provided by Wolfram on creating and editing Notebooks. Afterwards, one of their people contacted me, leading to an open discussion about how to embed Wolfram Notebooks and maths training on the Ajabbi website.

One of their partnership people contacted me. They said that WordPress had also provided embedding. So, the first port of call is to see how WordPress does it.

Since then, Wolfram has kindly given me access to Wolfram One for three months so that I can experiment, test, and post some examples.

To do

• Make the first plug-in to embed Wolfram Notebooks onto the ajabbi.com web pages using a simple web form.
• Extend the plug-in to be generic and work with other 3rd-party websites.
• Configure an embedded notebook to analyse live data at Ajabbi (I don't know how yet).
• Embed free relevant maths instruction beside the notebooks.

WordPress

WordPress offers a plug-in for embedding content from third-party websites. The plug-in appears as a simple web form.

Embedding

Embedding makes use of the HTML tag iFrame.

Code

<iframe src="demo_iframe.htm" height="200" width="300" title="Iframe Example"></iframe>

Properties

Attribute	Value	Description
allow		Specifies a feature policy for the <iframe>
allowfullscreen	TRUE	Set to true if the <iframe> can activate fullscreen mode by calling the requestFullscreen() method
	FALSE
allowpaymentrequest	TRUE	Set to true if a cross-origin <iframe> should be allowed to invoke the Payment Request API
	FALSE
height	pixels	Specifies the height of an <iframe>. Default height is 150 pixels
loading	eager	Specifies whether a browser should load an iframe immediately or to defer loading of iframes until some conditions are met
	lazy
name	text	Specifies the name of an <iframe>
referrerpolicy	no-referrer	Specifies which referrer information to send when fetching the iframe
	no-referrer-when-downgrade
	origin
	origin-when-cross-origin
	same-origin
	strict-origin-when-cross-origin
	unsafe-url
sandbox	allow-forms	Enables an extra set of restrictions for the content in an <iframe>
	allow-pointer-lock
	allow-popups
	allow-same-origin
	allow-scripts
	allow-top-navigation
src	URL	Specifies the address of the document to embed in the <iframe>
srcdoc	HTML_code	Specifies the HTML content of the page to show in the <iframe>
width	pixels	Specifies the width of an <iframe>. Default width is 300 pixels