An MkDocs plugin that lets you edit code fences in JSFiddle.
Project description
MkDocs JSFiddle Plugin
A plugin for MkDocs that lets you augment your code fences with an "Try it in JSFiddle" button.
Installation
This package can be installed via pip.
pip install mkjsfiddle
Then, add jsfiddle
to the plugins
section of your mkdocs.yml
file.
plugins:
- jsfiddle
Usage
Code fences will be left alone by default, as many code blocks may not
form a coherent block for a user to edit. To opt in for a given code fence,
add jsfiddle-
to your fence language declaration, like so.
```jsfiddle-html
<!DOCTYPE html>
<!-- Some content here -->
```
The html
above will be preserved for syntax highlighting, and the
jsfiddle-
will be dropped. Other languages are theoretically
supported, but will have no impact besides code highlighting.
The default behavior is for a simple HTML parser to extract the inline JS
and CSS elements and put their contents in the appropriate JSFiddle panels.
More specifically, if you have a script
tag with the attribute type=text/javascript
AND not having the src
attribute, or if you have a style
tag with the attribute
type=text/css
, it will be extracted to the appropriate panel. If you have multiple
of these, they will all be extracted and concatenated with some newlines thrown in as
breaks.
If you prefer to opt out of this behavior and just dump everything as-is into
the HTML box, you can add -htmlonly
to the language string (for a full string that
looks something like jsfiddle-html-htmlonly
).
Known limitations
We attempt to keep formatting as-is, but make no guarantees in the default mode. The
-htmlonly
option however should preserve formatting (if it does not, please submit
a bug report). This has been developed and tested with Material for MkDocs,
and has not been tested extensively with additional styles. Pull requests to improve styling
are welcome.
Project details
Download files
Download the file for your platform. If you're not sure which to choose, learn more about installing packages.
Source Distribution
Built Distribution
File details
Details for the file mkjsfiddle-1.0.1.tar.gz
.
File metadata
- Download URL: mkjsfiddle-1.0.1.tar.gz
- Upload date:
- Size: 6.6 kB
- Tags: Source
- Uploaded using Trusted Publishing? Yes
- Uploaded via: twine/4.0.1 CPython/3.11.3
File hashes
Algorithm | Hash digest | |
---|---|---|
SHA256 | 88563c248eeeeb367f46fe2605d3f80b6786bc41d27d2e3e640b76e5e270526b |
|
MD5 | 6c42dcc9f47e288a724646b9b088b559 |
|
BLAKE2b-256 | f1efbd43a2d9784ef36d2ea861462cd6a85a2b7e07be4c0f77a11e5dc9aea2b9 |
File details
Details for the file mkjsfiddle-1.0.1-py3-none-any.whl
.
File metadata
- Download URL: mkjsfiddle-1.0.1-py3-none-any.whl
- Upload date:
- Size: 6.2 kB
- Tags: Python 3
- Uploaded using Trusted Publishing? Yes
- Uploaded via: twine/4.0.1 CPython/3.11.3
File hashes
Algorithm | Hash digest | |
---|---|---|
SHA256 | cbd8ce498f048bd23b50d475e337558cf2b9d03957d6b25fd1a2158998767c88 |
|
MD5 | f1788c374af2a4910f065c78905c5341 |
|
BLAKE2b-256 | 197bf95fe4b07a134e678d02e2d3466ab8fdcf17da4be1bc596dad582c4f308a |