Mix Markdown with HTML, and have it rendered on the fly by Javascript!
- Include showdown.js in your HTML. Also include
markdownhere.jsfrom this repo (or by loading it from//wafi.iit.cnr.it/webvis/markdownhere/markdownhere.js), having care to put the<script>tag right before the end of the body. - Insert Markdown content in whatever HTML element you want, then add the special
x-mdhereclass to it. Take care of removing any unwanted indentation from Markdown code (indented lines are interpreted as code blocks). - That's it! Load the page in your favorite browser to see your Markdown turned into HTML. Add CSS to taste. If you want, open the page source to see the original Markdown.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Markdown here!</title>
<script src="showdown.js"></script>
</head>
<body class="x-mdhere">
This is *Markdown*.
</body>
<script src="//wafi.iit.cnr.it/webvis/markdownhere/markdownhere.js"></script>
</html>You can try a demo here.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent