Anyfiddle Snippets converts your existing code snippets in your documentations into runnable code snippets. Anyfiddle Snippets makes your docs interactive and easy to use with very minimal changes.
Start adding the Anyfiddle script tag to your existing docs (This is similar to script tags provided by many analytics services).
Now add some
data- attributes to the container of the code snippet.
<divdata-anyfiddle-snippet-containerdata-anyfiddle-snippet-runtime="node:alpine"data-anyfiddle-snippet-command="node index.js"><code data-anyfiddle-snippet-file="index.js">console.log('Hello world');</code></div>
Defines the container element. All extra elements like Run button and output containers will be added to this.
The docker container image to be used to run the code snippet.
The command to execute in the runtime on clicking the Run button.
The contents of this block will be added as a file to the runtime. Multiple blocks can be defined to add multiple files. The attribute's value will be the name of the file created. These files are created before the command (
All elements with the above attributes will be converted into runnable snippets and a Run is added to the bottom right corner.