0cffd47aca
Block math in body can now be wrapped in "<div>$$...$$</div>" tags Inline math in body can now be wrapping in "`$...$`" backticks Diagrams can now be created without shortcodes: "```mermaid ... ```"
3.6 KiB
| title | date | math | diagram |
|---|---|---|---|
| Writing technical content in Academic | 2019-07-12 | true | true |
Academic is designed to give technical content creators a seamless experience. You can focus on the content and Academic handles the rest.
Highlight your code snippets, take notes on math classes, and draw diagrams from textual representation.
On this page, you'll find some examples of the types of technical content that can be rendered with Academic.
Examples
Code
Academic supports a Markdown extension for highlighting code syntax. You can enable this feature by toggling the highlight option in your config/_default/params.toml file.
```python
import pandas as pd
data = pd.read_csv("data.csv")
data.head()
```
renders as
import pandas as pd
data = pd.read_csv("data.csv")
data.head()
Math
Academic supports a Markdown extension for \LaTeX math. You can enable this feature by toggling the math option in your config/_default/params.toml file or by adding math: true to your page front matter.
Note that math blocks should be wrapped with <div>...</div> and inline math wrapped with <span>...</span> as otherwise your math will be parsed as Markdown.
<div>$$
\gamma_{n} = \frac{
\left | \left (\mathbf x_{n} - \mathbf x_{n-1} \right )^T
\left [\nabla F (\mathbf x_{n}) - \nabla F (\mathbf x_{n-1}) \right ] \right |}
{\left \|\nabla F(\mathbf{x}_{n}) - \nabla F(\mathbf{x}_{n-1}) \right \|^2}
$$</div>
renders as $\gamma_{n} = \frac{\mathbf x_{n}}{y}$ \gamma_{n} = \frac{\mathbf x_{n}}{y}
Diagrams
Academic supports a Markdown extension for diagrams. You can enable this feature by toggling the diagram option in your config/_default/params.toml file or by adding diagram: true to your page front matter.
An example flowchart:
```mermaid
graph TD;
A-->B;
A-->C;
B-->D;
C-->D;
```
renders as
graph TD;
A-->B;
A-->C;
B-->D;
C-->D;
An example sequence diagram:
```mermaid
sequenceDiagram
participant Alice
participant Bob
Alice->John: Hello John, how are you?
loop Healthcheck
John->John: Fight against hypochondria
end
Note right of John: Rational thoughts <br/>prevail...
John-->Alice: Great!
John->Bob: How about you?
Bob-->John: Jolly good!
```
renders as
sequenceDiagram
participant Alice
participant Bob
Alice->John: Hello John, how are you?
loop Healthcheck
John->John: Fight against hypochondria
end
Note right of John: Rational thoughts <br/>prevail...
John-->Alice: Great!
John->Bob: How about you?
Bob-->John: Jolly good!
An example Gantt diagram:
```mermaid
gantt
dateFormat YYYY-MM-DD
section Section
A task :a1, 2014-01-01, 30d
Another task :after a1 , 20d
section Another
Task in sec :2014-01-12 , 12d
another task : 24d
```
renders as
gantt
dateFormat YYYY-MM-DD
section Section
A task :a1, 2014-01-01, 30d
Another task :after a1 , 20d
section Another
Task in sec :2014-01-12 , 12d
another task : 24d
Task lists
You can even write your todo lists in Academic too:
- Write math example
- Write diagram example
- Do something else