Reporting Using Markdown in Jupyter Notebook

5 minute read

By - Vishnu Prakash Singh
24th Aug,2019

Notes:

  • Convert the code cell of jupyter notebook into markdown cell using the drop down box in task bar.
  • Same can be done using shortcut ‘m’ in command mode or esc + ‘m’ in edit mode.
  • In each cell of the tutorial, codes is above and corresponding output is below in the same cell.

1.1) Writing in Italics

*I am writing this line in italic using markdown syntax 1.*
_I am writing this line in italic  using markdown syntax 2._
<i>I am writing this line in italic using HTML syntax.</i>
# Add <br> at the end of sentence to break it if more than one line is being copy pasted at a time.

I am writing this line in italic using markdown syntax 1.
I am writing this line in italic using markdown syntax 2.
I am writing this line in italic using HTML syntax.


1.2) Writing in Bold

**I am writing this line in bold using markdown syntax 1.**
__I am writing this line in bold using markdown syntax 2.__
<b>I am writing this line in bold  using HTML syntax.</b>

I am writing this line in bold using markdown syntax 1.
I am writing this line in bold using markdown syntax 2.
I am writing this line in bold using HTML syntax.


1.3) Writing Code

To read a csv file, use `pd.read_csv`.
To wrte a csv file, use <code>pd.to_csv</code>.

To read a csv file, use pd.read_csv.
To wrte a csv file, use pd.to_csv.


1.4) Writing in Blockquotes

> I am learning markdown basics.
>> Markdown is a good way to present.

I am learning markdown basics.

Markdown is a good way to present.


1.5) Underlining Text in Markdown

<u>I am underlining this line</u>

I am underlining this line


1.6) Strike Through Texts

~~I am striking through this line.~~

I am striking through this line.


1.7) Citing in Markdown

<cite>I am citing this line</cite>

I am citing this line


1.8) Breaking a line in Markdown

This is a very long line,<br> i should break it into two.

This is a very long line,
i should break it into two.


1.9) Breaking a line in Markdown

This is a very long line,<hr> i should break it into two by drawing a line in between.

This is a very long line,<hr> i should break it into two by drawing a line in between.


2.1) Ordered Lists in Markdown

__I like following things__
1. Movies
    1. More Movies
    2. TV Series
2. Coffee
# instead of *, + , - can also be used.

I like following things

  1. Movies
    1. More Movies
    2. TV Series
  2. Coffee

2.2) Ordered Lists in Markdown using HTML syntax


__I like following things__
<ol>
<li> Movies</li>
<ol>
<li> More Movies</li>
<li>  TV Series</li>
</ol>
<li> Coffee</li>
</ol>

I like following things

  1. Movies
    1. More Movies
    2. TV Series
  2. Coffee

2.3) Unordered Lists in Markdown

__I like following things__
* Movies
    * More Movies
    * TV Series
* Coffee
# instead of *, + , - can also be used.

I like following things

  • Movies
    • More Movies
    • TV Series
  • Coffee

2.4) Unordered Lists in Markdown using HTML syntax

__I like following things__
<ul>
<li>Movies
<ul>
<li>More Movies</li>
<li>TV Series</li>
</ul>
<li>Coffee</li>
</ul>

Not printing unordered list using HTML as it is giving error in kramdown.


2.5) Lists with check box in Markdown

- [ ] Do's
    - [ ] Eat
    - [ ] Sleep
- [x] Dont's
    - [x] Kill
  • Do’s
    • Eat
    • Sleep
  • Dont’s
    • Kill

3.1) Headings in Markdown

# This is Heading 1.
<h1>This is Heading 1.</h1>

This is Heading 1.


3.2) Headings in Markdown

## This is Heading 2.
<h2>This is Heading 2.</h2>

This is Heading 2.


3.3) Headings in Markdown

### This is Heading 3.
<h3>This is Heading 3.</3>

This is Heading 3.


3.4) Headings in Markdown

#### This is Heading 4.
<h4>This is Heading 4.</4>

This is Heading 4.


3.5) Headings in Markdown

##### This is Heading 5.
<h5>This is Heading 5.</5>
This is Heading 5.

3.6) Headings in Markdown

###### This is Heading 6.
<h6>This is Heading 6.</6>
This is Heading 6.

4.1) Aligning Texts in Markdown

<center>This Text is put in center.</center>
This Text is put in center.

4.2) Aligning Headings in Markdown

<h3><center>This Heading is put in center.</center></h3>

This Heading is put in center.


5.1) Code Highlighting in Markdown

```python
print("Hello World!!!")
```
print("Hello World!!!")

5.2) Code Highlighting in Markdown

```java
print("Hello World!!!")
```
print("Hello World!!!")

6.1) Inserting Table in Markdown

|  Col1| Col2 |
|------|------|
|This  | is   |
|   a  | table|
Col1 Col2
This is
a table

6.2) Inserting Formulae

$e^{i\pi} + 1 = 0$

$e^{i\pi} + 1 = 0$


[github](https://github.com/, 'github.com')
# Hover over 'github' to see 'github.com'

github


6.4) Inserting Local Images

![Alt sin_cos_curve](/images/my_figure.png "Sine Vs Cos Curve")
# Drag and drop the image in a markdown cell to add an image in python notebook.
# In order to view image in pynb/HTML, image must be present at the location.
# Hover over the image for the title text

Alt sin_cos_curve


6.5) Inserting Local Images using code cell

In this case, no need to keep image at specific location.

from IPython.display import Image;
Image('my_figure.png',width=400,height = 200)


6.6) Inserting Online Images

![Python Logo](https://jelastic.com/blog/wp-content/uploads/2019/02/python-logo.png "Logo of Python")

Python Logo


6.7) Inserting horizontal line

---
***
---
<hr size = 2 height = 3 width = 300>


6.8) Inserting shapes

I will display &#9658;
I will display &#9632;
#for more shapes, refer - https://www.w3schools.com/charsets/ref_utf_geometric.asp

I will display ►
I will display ■


7.1) Changing Color of text

<font color='green'>The color of this text is green.</font>
The color of this text is green.

7.2) Changing Size of text

<font size= 5>The size of this text is 5.</font>
The size of this text is 5.

7.3) Changing font of text

<font face="arial">The font of this text is Arial.</font>
# For more fonts - https://websitesetup.org/web-safe-fonts-html-css/
The font of this text is Arial.

7.4) Changing color, size, font of text

<font size="4" face="Verdana" color="blue">
This text is in Verdana, size 4, and in blue color.
</font>
This text is in Verdana, size 4, and in blue color.

7.5) Increasing Size of text

<font size="+2">I am increasing the size of the text by 2.</font>
I am increasing the size of the text by 2.

7.6) Decreasing Size of text

<font size="-1">I am decreasing the size of the text by 1.</font>
I am decreasing the size of the text by 1.

8.1) Escaping Special Characters

\* I want to wrap this line in star symbol. \*
\` I want to wrap this line in backticks. \`

# Use backslash(\) before the special character to tell Jupyter notebook to ignore Markdown Syntax.
# Backslash can escape these special characters  `, *, _,{}, [], (), #, +, -, ., !, \

* I want to wrap this line in star symbol. *
` I want to wrap this line in backticks. `


8.2) Other way of escaping Backticks

```` `I want to wrap this line in backticks.` ```` ```
```python
# Use ```` to the left and right of the text to escape backticks in markdown 
` I want to wrap this line in backticks.`

***THE END***