I want to visualize README.md files from a project in github, in my website. What is the best way to do this? Like fetch the markdown code and process the mark down locally? Or there is a way to fetch the already processed markdown from github?
24 Answers
One possible solution is to use a javascript-based markdown parser, such as .
That library can be loaded from the browser and can display the markdown. In this example (taken from the aforementioned site), you would need to fetch and insert the markdown in the output of your site:
<!DOCTYPE html> <html> <body> <textarea oninput="this.editor.update()" rows="6" cols="60">Insert proxied **Markdown** here.</textarea> <div> </div> <script src="lib/markdown.js"></script> <script> function Editor(input, preview) { this.update = function () { preview.innerHTML = markdown.toHTML(input.value); }; input.editor = this; this.update(); } var $ = function (id) { return document.getElementById(id); }; new Editor($("text-input"), $("preview")); </script> </body> </html> 1Here is a much better way to do it that seems to be more in line with the questions and it certainly suited my needs. This implements a server-side, back-end processor that servers up HTML rendered from Markdown on the fly.
Here is an excerpt for PHP, but other languages are supported and documented in the link:
PHP
Download PHP Markdown (or PHP Markdown Extra) and 2. PHP SmartyPants from Michel Fortin. 3. Put markdown.php and smartypants.php somewhere in PHP's include path (or in the same directory as render.php).
Add an alias in your Apache config:
Alias /markdown/ "/var/www/support/markdown/"
- Add rewrite rules. This
can be done in the .htaccess file for a specific folder, or in the global Apache config. Some common extensions are included, but you can adjust them to your needs. (You might want to process all text as Markdown by adding "txt".)
RewriteEngine on RewriteRule .+.(markdown|mdown|md|mkd)$ /markdown/render.php RewriteRule .+.(markdown|mdown|md|mkd)-text$ /markdown/render.php [L]
3Use Github API - Markdown on your javascript.
An example of zeromd.js Just serve the md.htm file and md files, and visit directly by url: /md.htm?src=README.md