Writing blog posts using Wordpress or any other alternative using a WYSIWYG editor is easy and fast but some other blogging platforms or Jamstack websites force you to use Markdown, and this method could be really faster and more efficient when you master the Markup language.
It’s similar to Vim vs Vscode, you could code twice faster on vim if you master the shortcuts.
Here’s the basics of Markdown style:
# H1 For Example
## H2 For Example
### H3 For Example
#### H4 For Example
##### H5 For Example
###### H6 For Example
Emphasis, aka italics, with asterisks (*
asterisks*
) or underscores (underscore).
Strong emphasis, aka bold, with asterisks (**) or underscores (__).
Strikethrough uses two tildes (~~). Scratch this.
> Blockquotes are very handy in email to emulate reply text.
> This line is part of the same quote. Use (>) character to start a blockquote.
Blockquotes are very handy in email to emulate reply text. This line is part of the same quote.
Quote break. (there is no > at the beginning of this line.)
This is a very long line that will still be quoted properly when it wraps. Oh boy let’s keep writing to make sure this is long enough to actually wrap for everyone. Oh, you can put Markdown into a blockquote.
This is a horizontal separator:
Just insert --- (3 hyphens) in the beginning of the line
To start a numbered list use numbers followed by a point then a space (1. ).
To start an unordered list just put a hyphen then a space (- ).
[Inline-style link](https://www.google.com)
[Inline-style link with title](https://www.google.com "Google's Homepage")
[Reference-style link][arbitrary case-insensitive reference text]
[You can use numbers for reference-style link definitions][1]
Or leave it empty and use the [link text itself].
Some text to show that the reference links can follow later.
[arbitrary case-insensitive reference text]: https://www.mozilla.org
[1]: http://slashdot.org
[link text itself]: http://www.reddit.com
Images included in _posts folder are lazy loaded.
Inline-style:
And this is how to create tables in Markdown.
| Tables | Are | Cool |
| ------------- |:-------------:| ----:|
| col 3 is | right-aligned | 1600 |
| col 2 is | centered | 12 |
| zebra stripes | are neat | 1 |
| Markdown | Less | Pretty |
| -------- | --------- | ---------- |
| _Still_ | `renders` | **nicely** |
| 1 | 2 | 3 |
Result:
Tables | Are | Cool |
---|---|---|
col 3 is | right-aligned | 1600 |
col 2 is | centered | 12 |
zebra stripes | are neat | 1 |
Markdown | Less | Pretty |
---|---|---|
Still | renders | nicely |
1 | 2 | 3 |
To add a code block with a specific language highlighting, use “language_name" put your code then close with
var s = 'JavaScript syntax highlighting'; var s = 'JavaScript syntax highlighting';
alert(s);
Lorem ipsum dolor sit amet consectetur adipisicing elit. Tenetur vero esse non molestias eos excepturi, inventore atque cupiditate. Sed voluptatem quas omnis culpa, et odit.
s = "Python syntax highlighting"
print s
I like to share my opinion about new dev technologies, I share some open source code too. If you're interested you can join me.