Imron Rosyadi
  • Hi 👋🏼
  • Background Removal
  • _v_images
    • 20211023055131420_4883.png
  • Me
    • Hi 👋🏼
    • My Awesome Android Apps
    • Book and Tutorial Plan
    • Browser Extension and Add-On
    • Imron Rosyadi CV
    • My Awesome Gadget
    • My Github Readme
    • Hi 👋🏼
    • MS Word Add In
    • My Workflow
    • Research Plan
    • Services on rosyadi.com and irosyadi Blog Networks
    • List of Uninstalled Windows Apps
    • My Awesome List of Windows Apps
  • Academia
    • Academia Resource
    • Arxiv and Paper Preprint
    • Awesome Browser Research Tools
    • Citation Tools
    • Awesome Conferences Tools
    • Funny Research Papers
    • Awesome Scientific Journal Tools
    • Awesome Latex Tools
    • Awesome Document Research Tools
    • Curated Papers
    • paper-exploration-tool-extended
    • Awesome Paper Exploration Tools
    • Awesome Paper Reading Tools
    • paper-search-extended
    • Paper and Article Search Tools
    • Awesome Research and Academic Writing Assistant Tools
    • How to Write Research Paper
    • PhD How To
    • Research Resources
    • Scientific Report Tools
    • Scihub - Paper Search
    • Technology for Society
    • Thesis Search
  • ai
    • Chat-GPT
    • GPT-2
    • GPT-3
  • App
    • 3D Tools
    • Arduino Graph Plotter Apps
    • Terminal in Arduino
    • Cloud GPU
    • Awesome Desktop Apps
    • Desktop Search App
    • Digitizer - Converting Graph into Data
    • Earth Map and Tools
    • Electronics EDA Tools
    • File Compression Optimization
    • Awesome List of File Converter Apps
    • File Sharing, File Transfer and File Sync
    • Free Apps for Developers
    • Free Apps for Students
    • Free Cloud Compute Infrastructure
    • Google Sheet Tools
    • Image Format Conversion
    • Interactive Code in Webpage
    • Jupyter Notebook Apps
    • Map Tools
    • Awesome List of Maps
    • Movie App
    • Note Calculator
    • Awesome List of OCR Apps
    • Octave Online Server
    • Open Source Apps
    • PC to Android Connection
    • PDF Tools
    • Phone Tools
    • Presentation Apps and Tools
    • Project and Time Management
    • QR Code and Barcode Apps
    • Read Mode Tool
    • Remote Desktop
    • RSS Tools
    • Secure Communications
    • Spreadshseet (Sheet) Apps and Tools
    • Symbolic Math Solver
    • Text Manipulation and Expansion
    • Torrent
    • Tracking Apps
    • Traffic Simulation
    • USB Tools
    • Utility Calculator
    • Website Cloning
    • Windows Application Manager
    • Windows Debloat Tools
    • Windows Launcher
  • Awesome
    • Awesome Free Stuffs from Internet
    • Color Science and Tools
    • Financial Tools
    • Game
    • History Tools and Apps
    • Linux Resources
    • Awesome Microcontroller and Microcomputer
    • Open Source Resources
    • Photography Resources
    • Regex
    • Unicode
    • Vexillology
    • Weather
  • Book
    • Awesome Open Source Documents
    • Book with Code
    • Computer Graphics Books, Tutorials, and Courses
    • Deep Learning Books, Tutorials, and Courses
    • Ebook Reader
    • E-book Search Engine Tools
    • eBook
    • Free and Open Electrical Engineering Books
    • Free and Open Books Repository and Provider
    • Free and Open Books
    • Image Processing Book and Tutorial
    • Interactive Books
    • Libgen - Book Search Engine
    • Math Books, Tutorials, and Courses
    • Numerical Computing Resources
    • Open Glossary
    • Pretext Book
    • Statistics Books, Tutorials, and Courses
    • z-lib - Book Search Engine
  • Course
    • Computer Science
    • Control Design with Frequency Method
    • Control Systems Resources
    • Control Systems
    • Standford CS231n 2017 Summary
    • CS231n Resources
    • Digital Signal Processing
    • Electronic Resources
    • Electronics
    • Embedded Systems
    • Free Online Course
    • Fundamentals of Electrical Engineering
    • Instrumentation
    • Kuliah
    • Linear Algebra
    • Machine Learning Andrew Ng Quizzes
    • Machine Learning by Andrew Ng Resources
    • Machine Learning CS299
    • Math Resources
    • MK Dasar Teknik Elektro
    • MK Internet of Things
    • MK Machine Learning
    • MK Matematika Teknik
    • MK Pengolahan Sinyal Digital
    • MK Sistem Kendali Cerdas
    • MK Sistem Kendali Lanjut
    • MK Sistem Kendali
    • Rangkaian Listrik
    • Statistic and Probability
  • data-engineering
    • Awesome Data Set
    • CSV Tools
    • Data Format Conversion Tools
    • Data Science Books, Tutorials, and Courses
    • Data Science Resources
    • Data Tools
    • Awesome List of Data Visualization
    • Awesome List of Dataset
  • Digital Media
    • IPTV
    • Awesome List of Animation Apps
    • Audio, Music, Radio, and Podcast Streaming Apps
    • Audio and Music Tools
    • Awesome WASM Apps
    • Face and Pose Animation
    • Free Audio and Music
    • Free Icons
    • Free Image
    • Free Videos
    • Generative 3D Image
    • Generative Audio Music
    • Generative Color Colorization
    • Generative Image
    • Generative Machine Learning GAN
    • Generative Text
    • Generative Video
    • GIF Tools
    • Historical Colorization
    • Awesome List of Image Editors, Converters, and Processors
    • Speech to Speech (Fake Voice Generator)
    • Speech to Text Apps
    • Awesome List of SVG Applications
    • Text to Speech Apps
    • Awesome List of Video Editors
    • Visual and Optical Illusion
  • Drawing and Diagram
    • Awesome List of Diagram Apps
    • Drawing Tools
    • Graph Tools and Apps
    • Lightboard
    • Sketching, Hand Drawing, and Hand Writing Web App
  • Hacking, Privacy, and Security
    • Two Factor Authentication
    • Awesome List of Adblock Apps
    • Adblock Testers
    • Bookmarklets
    • Awesome Desktop and Browser Automation
    • DNS Leak Checkers
    • DNS Tools
    • Email Alias and Forwarding
    • Encryption and Cryptography
    • Google Hacking
    • Hosts File Management
    • IP Tools
    • Link Tracker
    • My IP Address Checkers
    • Cloud Network Tools
    • OSINT Tools
    • Paywall Bypass
    • Web-based Ping and Latency Tools
    • Port Forwarding
    • Prank
    • Privacy, Security and Anonymity Apps
    • Subdomain Takeover
    • Userscript
    • VPN and Wireguard
    • Web Scraping
    • Web Testing
    • Website Monitoring
  • How To
    • Anaconda How To
    • Chrome How To
    • Cloudflare How To
    • Docker Howto
    • Google Docs How To
    • Google Sheet How To
    • LanguageTool Word How To
    • MATLAB How To
    • Microsoft Word How To
    • Netlify
    • Network How To
    • Notepad++ How To
    • Obsidian How To
    • Octave How To
    • Powerpoint Howto
    • Shortcut How To
    • Tailscale How To
    • Windows 10 How To
    • Wordpress Howto
    • Zotero How To
  • Learning
    • Anki and Spaced Repetition
    • Certification
    • Language Learning
    • Learning and Education Resources
  • machine-learning
    • Awesome NLP Projects
    • CT-Scan for Covid-19 Classification using Machine Learning
    • Emotion Detection with Machine Learning
    • Face Expression and Detection
    • Face Mask Detection with Machine Learning
    • Interesting Machine Learning Papers
    • Land Cover Classification
    • Machine Learning Books and Tutorials
    • Machine Learning Course
    • Machine Learning Glossary
    • Machine Learning Metrics
    • Machine Learning Resources
    • Machine Learning SOTA and Model Zoo
    • Machine Learning Tools
    • Machine Learning in Agriculture
    • Machine Learning for Earth Science
    • Hardware for Machine Learning
    • Machine Learning for Health
    • Machine Learning for Image Processing
    • Machine Learning Embedded Devices
    • Machine Learning in Mobile Devices
    • Machine Learning News and Blog
    • Machine Learning for Satellite Images
    • Machine Learning for Sport Pose Analysis
    • Machine Learning in Sports
    • Machine Learning Teaching
    • Awesome List of Machine Learning Visualization
    • Neural Network
    • NLP with GPT
    • NLP for Bahasa Indonesia
    • NLP Models
    • Object Detection
    • Reinforcement Learning
    • Safety Helmet and Plate Detection
  • Markdown
    • About Markdown
    • Basic Markdown Cheatsheet (example of Heading 1)
    • Basic Syntax of Markdown
    • Awesome Bookmarklet
    • commonmark
    • complete-markdown-cheatsheet
    • Extended Commonmark
    • Extended Markdown Cheatsheet
    • Extended Syntax of Markdown
    • Getting Started about Markdown
    • List of Library for Commonmark Extension
    • List of Extension in Markdown
    • Markdown Cheatsheet
    • Style Guide for Markdown Writing
    • Markdown Tools and Apps
    • About Pandoc
  • Note
    • 100 Days Challenge
    • Arduino in Industrial
    • About Compiler and Interpreter
    • Convolution
    • Emoji
    • File Format
    • Interesting Blog
    • Interesting Story
    • Kalman Filters
    • Op-Amp
    • Open Culture
    • Open Directory Search
    • Open Source Hardware
    • Open Healthcare Library
    • Patent and Intellectual Property
    • PID Control
    • Routh-Hurwitz
    • Social Media
    • Zeer Evaporation Pot
  • programming
    • Javascripts Books, Tutorials, and Courses
    • Javascript Resources
    • Numpy Resources
    • Programming for Kids Books, Tutorials, and Courses
    • Programming References
    • Programming Resources
    • Python Books, Tutorials, and Courses
    • Python in Browser
    • Python Resources
  • Random Notes
    • 2020 Q3
    • 2020 Q4
    • 2021 Q1
    • 2021 Q2
    • 2021 Q3
    • 2022 October
    • 2022 Q1
    • 2022 Q2
    • 2023 January
    • 2023 May
    • Bookmarks on Ebooks
    • Bookmarks
    • test
  • Research
    • Awesome Google Colab Notebooks
    • Awesome Jupyter Notebooks
    • Debutanizer Column
    • Digital Twin News
    • Digital Twin in Vehicles
    • FPGA
    • NCBI Papers with Code
    • PHM in Motor
    • Plant Identification
    • Open Source Robotic Simulator
    • Awesome Science Blogs and Forums
    • Sign Language Recognition
    • Soft Sensor
    • Solar Energy
    • Time Series Forecasting
    • Virtual Reality and Augmented Reality
  • Web Apps
    • Alternative Frontend of Popular Websites
    • Alternative to Popular Websites
    • Bookmarks Tool
    • Captive Portal Access
    • Color Format Conversion
    • Deepfake - This Thing Does Not Exist
    • Document Tools
    • Domain Name Tools
    • Free Cloud Storage
    • Free Resources in Internet
    • Github Apps and Tools
    • Hacker News Apps
    • Hosted Open Source Services
    • Instagram Apps
    • Awesome List of Interactive and Explorable Webs
    • News Agregator
    • No Code Platforms
    • Number Format Conversion
    • Online IDE
    • Platform as a Service
    • Random Data Generator
    • Reddit Apps
    • Search Engine App
    • Self-hosted Applications
    • Software Search
    • Spartan and Text Only Websites
    • Network Speed Test Apps
    • Twitter Apps
    • Unit Conversion
    • URL Shortener
    • virtual-browser
    • Check Live Status of Website
    • Web Tools
    • Document Tools Suite
    • Wikipedia Apps
    • Awesome Youtube Apps
  • Web Development
    • Awesome CSS
    • Special Markdown Case
    • Markdown for This Blog
    • Classless CSS
    • Developer Tools
    • experimental-heading-1
    • Title
    • Experimental iFrame
    • Experimental Markdown
    • Jamstack and WebApps
    • List of Static Web Generator
    • Web Metrics and Performance Analysis
    • Webdev Resources
    • Web List
    • Website Rank
  • Writing
    • Free GPT Playground
    • Book Publication
    • Online Dictionaries
    • Exobrain Blogs and Digital Gardens
    • Grammar Checkers
    • Awesome Latex Editors
    • Awesome Latex Learning
    • Awesome Markdown Apps
    • Mathematics Editor and Calculator
    • Notetaking Tools
    • Online Documentation Tools
    • Sentence Paraphraser
    • Word Phrase Banks
    • Plagiarism Checkers
    • Text and Markdown Editor
    • Thesaurus
    • Translation
    • Awesome Writing Assistant Tools
    • Writing Prompt
    • Writing Tips
Powered by GitBook
On this page
  • 1. h2 Heading
  • h3 Heading
  • 2. Paragraphs
  • 3 Line Break
  • 4. Emphasis
  • 5. Blockquotes
  • 6. Lists
  • 6.1. Unordered
  • 6.2. Ordered
  • 6.3. Offset in Oredered List
  • 7. Elements in Lists
  • 8. Code
  • 9. Links
  • 9.1. Email Linkify
  • 10. Reference-style Links
  • 11. Images
  • 12. Escaping Characters
  • 13. HTML Code
  • 13.1. HTML: Bold, Italic, Strikethrough
  • 13.2. Others HTML Code
  • 14. Horizontal Rules
  • 15. Heading ID
  • My Great Heading
  • 16. Code Fencing and Highlighting
  • 17. Tables
  • 18. Text Formatting
  • 18.1. Strikethrough
  • 18.2. Highlighting and Underline
  • 19. Task Lists (Checkbox, Tick Mark)
  • 20. Emojies
  • 20.1. Copy Pasted Emojies
  • 20.2. Shortcode Emoji
  • 21. Typographic Replacements, Superscript, Subscript
  • 22. HTML Entities and Character Codes
  • 23. Latex
  • 23.1. Inline Equation
  • 23.2. Newline Equation
  • 24. Specific HTML Code
  • 24.1. Drop Down List
  • 24.2. Summary
  • 24.3. Definition
  • 24.4. Abbreviation
  • 26. Admonition Styles
  • 26.1. Admonition with CSS
  • 26.2. Admonition with Quote
  • 26.3. Admonition with Table
  • 27. Footnote

Was this helpful?

  1. Web Development

Markdown for This Blog

Common markdown format for Gitbook, gatsby-starter-bee, and VNote.

1. h2 Heading

markdown

# h1 Heading
## h2 Heading
### h3 Heading
#### h4 Heading
##### h5 Heading
###### h6 Heading

display

h3 Heading

h4 Heading

h5 Heading

h6 Heading

2. Paragraphs

markdown

This is the first paragraph.

This is the second paragraph

display

This is the first paragraph.

This is the second paragraph

3 Line Break

markdown

This is the first line.  
And this is the second line.<br>
And finally this is the last line.

display

This is the first line. And this is the second line. And finally this is the last line.

4. Emphasis

markdown

**This is bold text**  
__This is bold text__  
*This is italic text*  
_This is italic text_  
This text is ___really important___  

display

This is bold text This is bold text This is italic text This is italic text This text is really important

5. Blockquotes

markdown

> This is the first line of paragraph, followed by blank line
> 
> Blockquotes can also be nested...
>> ...by using additional greater-than signs right next to each other...
> > > ...or with spaces between arrows.
>
> ### with a heading
> 
> - and list
> - list
> - with **bold** and *italic* text

display

This is the first line of paragraph, followed by blank line

Blockquotes can also be nested...

...by using additional greater-than signs right next to each other...

...or with spaces between arrows.

with a heading

  • and list

  • list

  • with bold and italic text

6. Lists

6.1. Unordered

markdown


+ To start a list, there should be an empty line above
+ Create a list by starting a line with `+`, `-`, or `*`
- Changing the sign will add a linespace
+ Add text under an item  
This is a text under an item. Notice that there are two spaces at the end above.
- Sub-lists are made by indenting 2 spaces:
  * Item 2a
  * Item 2b
* Item 3

To end a list, there should be one empty line above.  

display

  • To start a list, there should be an empty line above

  • Create a list by starting a line with +, -, or *

  • Changing the sign will add a linespace

  • Add text under an item This is a text under an item. Notice that there are two spaces at the end above.

  • Sub-lists are made by indenting 2 spaces:

    • Item 2a

    • Item 2b

  • Item 3

To end a list, there should be one empty line above.

6.2. Ordered

markdown

1. Item 1
1. Item 2  
Notice that the sequence number is irrelevant. 
Markdown will change the sequence automatically when renderring. 
Notice that there are two spaces at the end above to make a new text under item.
3. Sub-lists are made by indenting 4 spaces
    1. Item 3a
    2. Item 3b
8. Any number for item 4

display

  1. Item 1

  2. Item 2 Notice that the sequence number is irrelevant. Markdown will change the sequence automatically when renderring. Notice that there are two spaces at the end above to make a new text under item.

  3. Sub-lists are made by indenting 4 spaces

    1. Item 3a

    2. Item 3b

  4. Any number for item 4

6.3. Offset in Oredered List

  • didn't work in Gitbook

markdown

57. will started with offset 57
1. so it will be 58
2. this is 59

display

  1. will started with offset 57

  2. so it will be 58

  3. this is 59

7. Elements in Lists

markdown

* To add another element in a list while preserving the continuity of the list...
* indent the element four spaces
     like this
* ...or add blank lines in between

    I need to add another paragraph below the second list item.

* the third list item.

    > A blockquote would look great below the second list item.

* the fourth list item.

display

  • To add another element in a list while preserving the continuity of the list...

  • add blank lines in between

    I need to add another paragraph below the second list item.

  • the third list item.

    A blockquote would look great below the second list item.

  • the fourth list item.

markdown

1. This image is inline ![wikquote](https://upload.wikimedia.org/wikipedia/commons/thumb/f/fa/Wikiquote-logo.svg/35px-Wikiquote-logo.svg.png).
2. Linux mascot is called Tux.

   ![Tux, the Linux mascot](https://upload.wikimedia.org/wikipedia/commons/thumb/a/af/Tux.png/220px-Tux.png)
3. Tux is is really cool.
4. For quote in ordered list, add five spaces.
     > A blockquote would look great below the second list item.
5.  But, for code blocks in the lists, add eight spaces or two tabs:

        <html>
          <head>
            <title>Test</title>
          </head>

6.  So okay for now

display

  1. Linux mascot is called Tux.

  2. Tux is really cool.

  3. For quote in ordered list, add five spaces.

    A blockquote would look great below the second list item.

  4. But, for code blocks in the lists, add eight spaces or two tabs:

     <html>
       <head>
         <title>Test</title>
       </head>
  5. So okay for now

8. Code

markdown

This is inline `code`.

display

This is inline code.

markdown

    // add four spaces before for code
    like this

display

// add four spaces before for code
like this

markdown

    <html>
      <head>
        <title>HTML code with four spaces</title>
      </head>

display

<html>
  <head>
    <title>HTML code with four spaces</title>
  </head>

9. Links

markdown

This is [link](https://example.com/)  
This is [link with title](https://example.com/ "title text!")
https://example.com/  
<https://www.markdownguide.org>  
I love supporting the **[EFF](https://eff.org)**.  
This is the *[Markdown Guide](https://www.markdownguide.org)*.  
See the section on [`code`](#code).  
But  `https://www.example.com`  
but be careful with [%20 link](https://www.example.com/my%20great%20page)  
example [without %20](https://www.example.com/my great page)

display

9.1. Email Linkify

  • didn't work in Gatsby and Gitbook

markdown

fake@example.com didn't work in Gatsby and Gitbook  
<fake@example.com> is okay  

display

10. Reference-style Links

markdown

I know [Indonesia][1]  
I also know [etymology of Indonesia][2]  
I knew [History of Indonesia][3]  
It doesn't have [hobbit-hole][hh].

[1]: <https://en.wikipedia.org/wiki/Indonesia>
[2]: https://en.wikipedia.org/wiki/Indonesia#Etymology "Etymology of Indonesia"
[3]: https://en.wikipedia.org/wiki/Indonesia#History 'History of Indonesia'
[hh]: <https://en.wikipedia.org/wiki/Hobbit#Lifestyle> "Hobbit lifestyles"

display

11. Images

markdown

![Wikipedia with Optional Text](https://upload.wikimedia.org/wikipedia/commons/thumb/d/de/Wikipedia_Logo_1.0.png/240px-Wikipedia_Logo_1.0.png "Optional Text")  
![Wikipedia with Alt Text, reference style][id1]  

[id1]: https://upload.wikimedia.org/wikipedia/commons/thumb/d/de/Wikipedia_Logo_1.0.png/240px-Wikipedia_Logo_1.0.png "Optional Text"

display

12. Escaping Characters

markdown

\* star  
\\ backslash itself  
\` backtick  
\{ \} curly braces  
\! exclamation mark

display

* star \ backslash itself ` backtick { } curly braces ! exclamation mark

13. HTML Code

  • very restricted in Gitbook

13.1. HTML: Bold, Italic, Strikethrough

markdown

This <em>word</em> is italic.  
This <strong>word</strong> is bold.  
This <del>word</del> is deleted with strikethorouugh.

display

This word is italic. This word is bold. This word is deleted with strikethorouugh.

13.2. Others HTML Code

  • didn't work in Gitbook

markdown

<font color=red>red color</font>  
<mark>highlight</mark>  
<ins>underline</ins>  
<small>smaller text</small>  
H<sub>2</sub>O  
x<sup>2</sup>+y<sup>2</sup>=0  
Variable of triangle area: 1/2 x <var>b</var> x <var>h</var>, where <var>b</var> is the base, and <var>h</var> is the vertical height.

display

red color highlight underline smaller text H2O x2+y2=0 Variable of triangle area: 1/2 x b x h, where b is the base, and h is the vertical height.

14. Horizontal Rules

  • didn't work in Gitbook

markdown

___

---

***

but only didn't work for Gitbook

display




15. Heading ID

  • didn't work for Gatsby

markdown

### My Great Heading {#heading-ids}

Link to [Heading IDs](#heading-ids)

display

My Great Heading

16. Code Fencing and Highlighting

markdown

```
This is a fenced code block.
```
~~~
No language indicated, so no syntax highlighting.
s = "There is no highlighting for this."
~~~

```python
def function():
    #indenting works just fine in the fenced code block
    s = "Python syntax highlighting"
    print s
```

```javascript
var s = "JavaScript syntax highlighting";
alert(s);
```

```ruby
require 'redcarpet'
markdown = Redcarpet.new("ruby syntax highlighting")
puts markdown.to_html
```

display

This is a fenced code block.
No language indicated, so no syntax highlighting.
s = "There is no highlighting for this."
def function():
    #indenting works just fine in the fenced code block
    s = "Python syntax highlighting"
    print s
var s = "JavaScript syntax highlighting";
alert(s);
require 'redcarpet'
markdown = Redcarpet.new("ruby syntax highlighting")
puts markdown.to_html

17. Tables

markdown

| Syntax      | Description | Test Text is long    |
| :---        |    :----:   |          ---: |
| [Example](https://www.example.com/)      | **Title**       | `Here's this  is` |
| Paragraph   | Text        | And more   |

display

Syntax
Description
Test Text is long

Title

Here's this is

Paragraph

Text

And more

18. Text Formatting

18.1. Strikethrough

markdown

~~strikethrough~~  

display

strikethrough

18.2. Highlighting and Underline

  • didn't work in Gitbook and Gatsby

==highlight, fail in Gitbook and Gatsby==  
_underline, fail in Gitbook and Gatsby_  

display

==highlight, fail in Gitbook and Gatsby== underline, fail in Gitbook and Gatsby

19. Task Lists (Checkbox, Tick Mark)

markdown

- [x] Write the press release
- [ ] Update the website
- [ ] Contact the media

display

20. Emojies

20.1. Copy Pasted Emojies

markdown

Gone camping! ⛺ Be back soon.  
That is so funny! 😂  

display

Gone camping! ⛺ Be back soon. That is so funny! 😂

20.2. Shortcode Emoji

  • didn't work in Gitbook

  • in Gatsby and VNote, use Github Emoji Shortcode

markdown

Shortcode emoji examples :grinning: :smiley: :smile: :grin: :laughing: :joy:

display

21. Typographic Replacements, Superscript, Subscript

  • dind't work in Gatsby and Gitbook

markdown

autoreplacement of (c) (C) (r) (R) (tm) (TM) (p) (P) +-  
superscript x^2^ and subscript H~2~O

display

autoreplacement of (c) (C) (r) (R) (tm) (TM) (p) (P) +- superscript x^2^ and subscript H2O

22. HTML Entities and Character Codes

markdown

&copy; &  &uml; &trade; &iexcl; &pound;  
&amp; &lt; &gt; &yen; &euro; &reg; &plusmn; &para; &sect; &brvbar; &macr; &laquo; &middot;  
x&sup2; y&sup3; &frac34; &frac14;  &times;  &divide;   &raquo; &#124;  
18&ordm;C  &quot;  &apos;

display

© & ¨ ™ ¡ £ & < > ¥ € ® ± ¶ § ¦ ¯ « · x² y³ ¾ ¼ × ÷ » | 18ºC " '


23. Latex

23.1. Inline Equation

  • Equation with one dollar sign $ works inline in VNote

  • Equation with two dollar signs $$ works inline in Jekyll and Gitbook, but not in VNote

markdown

Inline equation with one dollar sign: $E=mc^2$ (worked in VNote and Gatsby).  
Inline equation with two dollar sign: $$E=mc^2$$ (worked in Gatsby, Jekyll and Gitbook).

display

Inline equation with one dollar sign: $E=mc^2$ (worked in VNote and Gatsby). Inline equation with two dollar sign: E=mc2E=mc^2E=mc2 (worked in Gatsby, Jekyll and Gitbook).

23.2. Newline Equation

markdown

Newline equation with two dollar signs.

$$\sin(\alpha)^{\theta}=\sum_{i=0}^{n}(x^i + \cos(f))$$

display

Newline equation with two dollar signs.

sin⁡(α)θ=∑i=0n(xi+cos⁡(f))\sin(\alpha)^{\theta}=\sum_{i=0}^{n}(x^i + \cos(f))sin(α)θ=∑i=0n​(xi+cos(f))

24. Specific HTML Code

  • didn't work in Gitbook

24.1. Drop Down List

markdown

<details>
  <summary>Click this List ▶</summary>
  <p>
    <ul>
      <li>irosyadi: https://irosyadi.netlify.app</li>
      <li>irosyadi: https://irosyadi.gitbook.io</li>
      <li>irosyadi: https://irosyadi.github.io</li>
    </ul>
  </p>
</details>

display

Click this List ▶
  • irosyadi:

  • irosyadi:

  • irosyadi:

24.2. Summary

markdown

<details>
  <summary>Clik this Term ▶</summary>
  <p>Term is explanation of something</p>
</details>

display

Clik this Term ▶

Term is explanation of something

24.3. Definition

markdown

<dl>
<dt>First Term</dt>
<dd>This is the definition of the first term.</dd>
<dt>Second Term</dt>
<dd>This is one definition of the second term. </dd>
<dd>This is another definition of the second term.</dd>
</dl>

display

First TermThis is the definition of the first term.Second TermThis is one definition of the second term.This is another definition of the second term.

24.4. Abbreviation

markdown

The <abbr title="Hyper Text Markup Language">HTML</abbr> specification is maintained by the <abbr title="World Wide Web Consortium">W3C</abbr>.

display

The HTML specification is maintained by the W3C.

26. Admonition Styles

26.1. Admonition with CSS

  • didn't work in Gitbook

markdown

<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/irosyadi/irosyadi@master/alert.min.css">

<div class="alert alert-success"><strong>🎯 SUCCESS!</strong> <br> Success text. </div>  
<div class="alert alert-info"><strong>📌 INFO</strong> <br> Info text. </div>  
<div class="alert alert-warning"><strong>⚠️ WARNING!</strong> <br> Warning text. </div>  
<div class="alert alert-danger"><strong>⛔ DANGER!</strong> <br> Success text. </div>  

display

🎯 SUCCESS! Success text.📌 INFO Info text.⚠️ WARNING! Warning text.⛔ DANGER! Success text.

26.2. Admonition with Quote

  • worked in everywhere

markdown

> **⚠️ WARNING!**
> > This is a warning for you...

display

⚠️ WARNING!

This is a warning for you...

26.3. Admonition with Table

  • worked in everywhere

*** markdown***

| **⚠️ WARNING!**                |
| :--------------------------- |
| This is a warning for you... |

display

⚠️ WARNING!

This is a warning for you...

27. Footnote

  • didn't work in Gitbook

markdown

Here's a simple footnote,[^1] and here's a longer one,[^bignote], and [^withcode].  

[^1]: This is the first footnote, in Gitbook, there is no new line between.  
[^bignote]: Here's another one.  
[^withcode]: `code` or code in paragraphs  

display

Here's a simple footnote, and here's a longer one,, and . But there is problem with Gitbook for footnote.

  1. Here's another one.

PreviousSpecial Markdown CaseNextClassless CSS

Last updated 2 years ago

Was this helpful?

This image is inline .

Tux, the Linux mascot

This is This is I love supporting the . This is the . See the section on . But https://www.example.com but be careful with example [without %20]( great page)

fake@example.com didn't work in Gatsby and Gitbook is okay

I know I also know I knew It doesn't have .

Link to

Shortcode emoji examples

CSS delivered from:

😀
😃
😄
😁
😆
😂
fake@example.com
Indonesia
etymology of Indonesia
History of Indonesia
hobbit-hole
https://cdn.jsdelivr.net/gh/irosyadi/irosyadi@master/alert.css
link
link with title
https://example.com/
https://www.markdownguide.org
EFF
Markdown Guide
%20 link
https://www.example.com/my
code
Heading IDs
Example
Wikipedia with Alt Text, reference style
Wikipedia with Optional Text
wikquote