Writing Markdown In Blogger
Update
Added tests and support for nested blocks and lists plus youtube video and gists instead of just images.Here, have a look at tinydown, compatible with both node and web.
Something I've been thinking about since last year JS1K contest ... what if I could just write mark down on internet and let crawlers and bots do the math while I just write all I need to?
tinydown and CloudReflection
This is basically all it took to create a markdown blogger enabled service as CloudReflection is.That's correct, if I edit that post the text I gonna deal with is this one:
This is basically the same text I've used in the original demo page, except links and images are now finalyl supported.
Isn't a tiny markdown parser lovely ?
=====================================
A markdown is an _easy to read and quite easy to parse_ syntax, ideal for documents
that could be understood by human, and easily converted by machines.
You are reading markdown now!
-----------------------------
This blogpost is generated on the fly via the proposed script.
Here the code **example** used for this page:
this.onload = function () {
document.body.innerHTML = tinydown(
document.body.textContent
);
};
You can find a very nice guide about [how to markdown here](http://daringfireball.net/projects/markdown/syntax "markdown style guide").
### What is supported ?
* headers with = or - notation
* headers with # notation
* blockquotes and nested blockquotes
* ordered and unordered lists
* images with optional alt ant title
* inline links with arbitrary title
* <em> via single asterisks/underscore, or double for <strong> tag
* inline `code` via `` ` `` backtick
### What is not supported ? ###
* paragraphs are missings
* nested lists and nested markdown inside lists
* links with references and/or id
* raw html is not recognized, validated, parsed
> and just to demonstrate it works
> > this is a nested blockquote example :-)
> have a lovely day
- - -
© WebReflection
That is going to look exactly the same way you look at it in the following iframe:
What Else On Blogger Side
So I had to include a couple of scripts:- <script src='http://webreflection.github.io/tinydown/test/build/tinydown.js'/>
- <script src='http://webreflection.github.io/tinydown/test/build/onstuff.js'/>
tinydown
parser, the second one is just some logic to parse the right content at the right time.If you want to play with
npm install tinydown
parser consider that's just a function and is not as complet eas any other fully compatible markdown parsers ... it just gives me basically everything I need to write my technical posts on blogger ... can I ask anything more? I don't think so!Bear in mind you should not use same scripts with github external repository file in your production code/blog ... just follow these direction, and stay tuned with the tiny down repository.
Comments
Post a Comment