Markdown is a plain text formatting syntax aimed at making writing for the internet easier.
The philosophy behind Markdown is that plain text documents should be readable without tags mussing everything up, but there should still be ways to add text modifiers like lists, bold, italics, etc.
It is an alternative to WYSIWYG (what you see is what you get) editors, which use rich text that later gets converted to proper HTML.
This website, Dev.To used markdown editing, so I guess I don't need to explain more what markdown is :)
Let's see how we can implement this into your .Net project
Prerequisites
Transform existing HTML into Markdown
An example could be that you already have a blog post and you want to post it on other websites that are using markdown.
using CodeHelper.Core.Extensions;
string _markdown = _htmlPage.HtmlToMarkDown();
Transform existing Markdown into HTML
An example could be that your articles are posted here on Dev.To you want to have it available on your blog as well. A blog that accepts HTML only.
using CodeHelper.Core.Extensions;
string _html = _myDevToArticle.MarkDownToHtml();
Test the extension online
Which tags are transformed in both ways
- Heading 1:
h1
- Heading 2:
h2
- Heading 3:
h3
- bold:
<b> + <strong>
- italic:
<i>
- strike:
<s> + <strike>
- quote:
<q>
- break line:
<hr /> + <hr>
- mark:
<mark>
- sub:
<sub>
- sup:
<sup>
- code:
<code>
- fenced code block:
<code>multiple lines
- link:
<a href..
- image
<img src...
- ordered list:
<ol>
- unordered list:
<ul>
- definition list:
<dl>
The extension can handle multiple tags, including lists as well
1. Item 1
2. Item 2
## Title
1. Item 2
2. Item 3
This will result in:
<ol>
<li>Item 1</li>
<li>Item 2</li>
</ol>
<h2>Title</h2>
<ol>
<li>Item 3</li>
<li>Item 4</li>
</ol>
Examples
Definition List
Convert HTML
<dl>
<dt>Beast of Bodmin</dt>
<dd>A large feline inhabiting Bodmin Moor.</dd>
<dt>Morgawr</dt>
<dd>A sea serpent.</dd>
<dt>Owlman</dt>
<dd>A giant owl-like creature.</dd>
</dl>
To Markdown
: **Beast of Bodmin**
A large feline inhabiting Bodmin Moor.
: **Morgawr**
A sea serpent.
: **Owlman**
A giant owl-like creature.
Definition List
Convert Markdown
<dl>
<dt>Beast of Bodmin</dt>
<dd>A large feline inhabiting Bodmin Moor.</dd>
<dt>Morgawr</dt>
<dd>A sea serpent.</dd>
<dt>Owlman</dt>
<dd>A giant owl-like creature.</dd>
</dl>
To Markdown
: **Beast of Bodmin**
A large feline inhabiting Bodmin Moor.
: **Morgawr**
A sea serpent.
: **Owlman**
A giant owl-like creature.
Blog Post to Html
Let's take parts of this posts in Markdown
# Convert HTML into Markdown and Markdown to HTML
Markdown is a plain text formatting syntax aimed at making writing for the internet easier.
## Prerequisites
- [CodeHelper.Core.Extensions](https://www.nuget.org/packages/CodeHelper.Core.Extensions/1.3.2)
using CodeHelper.Core.Extensions;
string _html = _myDevToArticle.MarkDownToHtml();
which will convert into Html
<h1>Convert HTML into Markdown and Markdown to HTML</h1>
Markdown is a plain text formatting syntax aimed at making writing for the internet easier.
<h2>Prerequisites</h2>
<ul>
<li><a href="https://www.nuget.org/packages/CodeHelper.Core.Extensions/1.3.2">CodeHelper.Core.Extensions</a></li>
</ul>
<code >
using CodeHelper.Core.Extensions;
string _html = _myDevToArticle.MarkDownToHtml();
</code >
Top comments (2)
Interesting library
Thank you
We know alreaday some platform who uses it
But when the text is showed publicly, as the data is saved in HTML, no transform ws needed