Strapdown.js
Strapdown.js makes it embarrassingly simple to create elegant Markdown documents. No server-side compilation required.
https://github.com/arturadib/strapdown
strapdownjs.com is currently not working.
A Markdown parser that uses Marked to convert Markdown in .html files to HTML.
Marked is used for this conversion.
It differs from other Marked parsers in that it applies the Bootstrap and Bootswatch theme.
If you want to build and publish a decent website, you should now use a static site generator.
There is a Bootswatch theme in MkDocs.
MkDocs
https://github.com/mkdocs/mkdocs-bootswatch
🎈 Strapdown.js | ふうせん🎈 FU-SEN - 🗾 日本語情報
Table of Contents
Original Strapdown.js
The original Strapdown.js is based on Bootstrap 2. This also applies to the Bootswatch theme:
Also, use the JavaScript code prettifier to color the code. It has already been archived:
https://github.com/googlearchive/code-prettify
strapdownjs.com is currently not working. So the following code doesn’t work:
<script src="https://strapdownjs.com/v/0.2/strapdown.js"></script>
Instead replace the following code via jsDelivr and it will work.
<script src="https://cdn.jsdelivr.net/gh/arturadib/strapdown@gh-pages/v/0.2/strapdown.min.js"></script>
for example:
<html>
<title>Strapdown.js Sample</title>
<xmp>
You include **Markdown** in this.
</xmp>
<script src="https://cdn.jsdelivr.net/gh/arturadib/strapdown@gh-pages/v/0.2/strapdown.min.js"></script>
</html>
take this a little further:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Strapdown.js Sample</title>
<meta name="description" content="Strapdown.js Sample" />
</head>
<body>
<textarea theme="simplex">
You can use `<textarea>` instead of `<xmp>`.
</textarea>
<script src="https://cdn.jsdelivr.net/gh/arturadib/strapdown@gh-pages/v/0.2/strapdown.min.js"></script>
</body>
</html>
The original source has style="display:none;", but this can be omitted.
This will give you a different display temporarily, but you will hardly notice it.
You may need to add <meta charset="utf-8" /> if you use it in non-English.
Some web services add this in the HTTP header and may not need it.
You can add any tag inside the <head> as needed.
Custom CSS should be put under strapdown.js. It is before </body>.
When you put it in <head> as you are used to, some of it doesn’t work.
<script src="https://cdn.jsdelivr.net/gh/arturadib/strapdown@gh-pages/v/0.2/strapdown.min.js"></script>
<link rel="stylesheet" href="sample.css">
</body>
Additional features and forks
Strapdown.js got a lot of attention and gave birth to some additional features and derivations:
https://github.com/joedf/strapdown-topbar
https://github.com/ndossougbe/strapdown
https://github.com/chaitin/strapdown-zeta
https://github.com/Naereen/StrapDown.js
My fork version
🎈 https://github.com/fu-sen/strapdown
I wanted to use a Bootstrap 4-based Yeti theme. That was the trigger for the fork.
It sticks to changing the Bootstrap theme without adding any features.
I ended up with versions from Bootstrap 2 to 5 themes version.
CDN
🎈 https://github.com/fu-sen/strapdown.js
Thanks to jsDelivr we can use Strapdown.js on our CDN.
