Markdown

Apa itu Markdown?

Makrdown adalah lightweight markup language bahasa markup yang lebih ringan dari HTML untuk formatting teks.

Dikembangkan oleh John Gruber & Aaron Swartz 2004

File Markdown

File markdown disimpan dengan ekstensi .markdown atau .md

Contoh : belajar.markdown atau belajar.md

Format dasar Markdown

Heading atau judul dibuat menggunakan tanda pagar #

Contoh :

    # Heading 1
    ## Heading 2
    ### Heading 3

Hasilnya:

Heading 1

Heading 2

Heading 3

Bisa juga menggunakan simbol minus - dan samadengan =

Contoh :

    Heading 1
    ---------

    Heading 2
    =========

Hasilnya:

Heading 1

Heading 2

Format Teks

Menulis teks bolt atau tebal

    **tebal**

    __tebal__

Hasilnya:

tebal

Menulis teks tilt atau miring

    *miring*

    _miring_

Hasilnya:

miring

Menulis teks strikline atau dicoret

    ~~dicoret~~

Hasilnya:

~~dicoret~~

Membuat Link

Dibuat menggunakan tanda kurung

    [ini link](https://www.bagoes.github.io/)

Hasilnya:

ini link

menambah tooltips

    [ini link](https://www.bagoes.github.io/ "menuju link")

Hasilnya:

ini link

atau menulis langsung URL

    https://www.bagoes.github.io

Hasilnya:

https://www.bagoes.github.io

Pada web ini ditambah tanda < dan > diantara URL

    <https://www.bagoes.github.io>

Hasilnya:

https://www.bagoes.github.io

agar dibuka pada tab baru

    <https://www.bagoes.github.io>{:target="_blank"}

Hasilnya:

https://www.bagoes.github.io

Menyisipkan Gambar

Seperti membuat link, ditambahkan tanda seru ! didepannya

    ![ini gambar](https://www.bagoes.github.io/img/bgs-avatar.png)

Hasilnya:

Membuat List

Contoh :

    * Nasi Goreng
    * Mie Goreng
    * Nasi Kuning
    * Bubur Ayam

    1. Susu
    2. Kopi
    3. Teh Manis

    - Roti
    - Gorengan

Hasilnya:

Nasi Goreng
Mie Goreng
Nasi Kuning
Bubur Ayam

Susu
Kopi
Teh Manis

Roti
Gorengan

Membuat To Do List atau Check List

    **Kegiatan Hari Ini**
    [x] Bangun tidur
    [ ] Solat
    [ ] Ngaji

    - [ ] Makan
    - [x] Mandi
    - [ ] Kerja

Hasilnya:

Kegiatan Hari Ini [x] Bangun tidur [ ] Solat [ ] Ngaji

Makan
Mandi
Kerja

Membuat Quote

    > Ini untuk membuat *quote*

Hasilnya:

Ini untuk membuat quote

Menulis Inline Code

Menggunakan tanda (`)

    Ini contoh kode pada HTML `<data:post.body/>`

Hasilnya:

Ini contoh kode pada HTML <data:post.body/>

Menulis Source Code

Tanda ``` untuk menulis source code ditambah nama bahasa pemrogramannya

    ```html
        <!DOCTYPE html>
        <html>
        <head>
            <title></title>
        </head>
        <body>

        </body>
        </html>
    ```

Hasilnya:

    <!DOCTYPE html>
    <html>
    <head>
        <title></title>
    </head>
    <body>

    </body>
    </html>

Dan agar teksnya berwarna menggunakan Prism.js untuk syntax hightlighting

Referensi: