starters: update Academic

content/post/getting-started/index.md

@@ -41,6 +41,11 @@ categories:
   - 教程
 ---
 
+```python
+import libr
+print('hello')
+```
+
 ## Overview
 
 1. The Wowchemy website builder for Hugo, along with its starter templates, is designed for professional creators, educators, and teams/organizations - although it can be used to create any kind of site

content/post/jupyter/index.md

@@ -0,0 +1,77 @@
+---
+title: Display Jupyter Notebooks with Academic
+subtitle: Learn how to blog in Academic using Jupyter notebooks
+summary: Learn how to blog in Academic using Jupyter notebooks
+authors:
+  - admin
+tags: []
+categories: []
+projects: []
+date: '2019-02-05T00:00:00Z'
+lastMod: '2019-09-05T00:00:00Z'
+image:
+  caption: ''
+  focal_point: ''
+---
+
+```python
+from IPython.core.display import Image
+Image('https://www.python.org/static/community_logos/python-logo-master-v3-TM-flattened.png')
+```
+
+![png](./index_1_0.png)
+
+```python
+print("Welcome to Academic!")
+```
+
+    Welcome to Academic!
+
+## Install Python and JupyterLab
+
+[Install Anaconda](https://www.anaconda.com/distribution/#download-section) which includes Python 3 and JupyterLab.
+
+Alternatively, install JupyterLab with `pip3 install jupyterlab`.
+
+## Create or upload a Jupyter notebook
+
+Run the following commands in your Terminal, substituting `<MY-WEBSITE-FOLDER>` and `<SHORT-POST-TITLE>` with the file path to your Academic website folder and a short title for your blog post (use hyphens instead of spaces), respectively:
+
+```bash
+mkdir -p <MY-WEBSITE-FOLDER>/content/post/<SHORT-POST-TITLE>/
+cd <MY-WEBSITE-FOLDER>/content/post/<SHORT-POST-TITLE>/
+jupyter lab index.ipynb
+```
+
+The `jupyter` command above will launch the JupyterLab editor, allowing us to add Academic metadata and write the content.
+
+## Edit your post metadata
+
+The first cell of your Jupter notebook will contain your post metadata ([front matter](https://sourcethemes.com/academic/docs/front-matter/)).
+
+In Jupter, choose _Markdown_ as the type of the first cell and wrap your Academic metadata in three dashes, indicating that it is YAML front matter:
+
+```
+---
+title: My post's title
+date: 2019-09-01
+
+# Put any other Academic metadata here...
+---
+```
+
+Edit the metadata of your post, using the [documentation](https://sourcethemes.com/academic/docs/managing-content) as a guide to the available options.
+
+To set a [featured image](https://sourcethemes.com/academic/docs/managing-content/#featured-image), place an image named `featured` into your post's folder.
+
+For other tips, such as using math, see the guide on [writing content with Academic](https://wowchemy.com/docs/content/writing-markdown-latex/).
+
+## Convert notebook to Markdown
+
+```bash
+jupyter nbconvert index.ipynb --to markdown --NbConvertApp.output_files_dir=.
+```
+
+## Example
+
+This post was created with Jupyter. The orginal files can be found at https://github.com/gcushen/hugo-academic/tree/master/exampleSite/content/post/jupyter

content/post/writing-technical-content/index.md

@@ -0,0 +1,390 @@
+---
+title: Writing technical content in Markdown
+date: 2019-07-12
+math: true
+image:
+  placement: 2
+  caption: 'Image credit: [**John Moeses Bauan**](https://unsplash.com/photos/OGZtQF8iC0g)'
+---
+
+Wowchemy is designed to give technical content creators a seamless experience. You can focus on the content and Wowchemy 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 Wowchemy.
+
+## Examples
+
+### Code
+
+Wowchemy supports a Markdown extension for highlighting code syntax. You can customize the styles under the `syntax_highlighter` option in your `config/_default/params.yaml` file.
+
+    ```python
+    import pandas as pd
+    data = pd.read_csv("data.csv")
+    data.head()
+    ```
+
+renders as
+
+```python
+import pandas as pd
+data = pd.read_csv("data.csv")
+data.head()
+```
+
+### Mindmaps
+
+Wowchemy supports a Markdown extension for mindmaps.
+
+Simply insert a Markdown `markmap` code block and optionally set the height of the mindmap as shown in the example below.
+
+A simple mindmap defined as a Markdown list:
+
+<div class="highlight">
+<pre class="chroma">
+<code>
+```markmap {height="200px"}
+- Hugo Modules
+  - wowchemy
+  - wowchemy-plugins-netlify
+  - wowchemy-plugins-netlify-cms
+  - wowchemy-plugins-reveal
+```
+</code>
+</pre>
+</div>
+
+renders as
+
+```markmap {height="200px"}
+- Hugo Modules
+  - wowchemy
+  - wowchemy-plugins-netlify
+  - wowchemy-plugins-netlify-cms
+  - wowchemy-plugins-reveal
+```
+
+A more advanced mindmap with formatting, code blocks, and math:
+
+<div class="highlight">
+<pre class="chroma">
+<code>
+```markmap
+- Mindmaps
+  - Links
+    - [Wowchemy Docs](https://wowchemy.com/docs/)
+    - [Discord Community](https://discord.gg/z8wNYzb)
+    - [GitHub](https://github.com/wowchemy/wowchemy-hugo-themes)
+  - Features
+    - Markdown formatting
+    - **inline** ~~text~~ *styles*
+    - multiline
+      text
+    - `inline code`
+    -
+      ```js
+      console.log('hello');
+      console.log('code block');
+      ```
+    - Math: $x = {-b \pm \sqrt{b^2-4ac} \over 2a}$
+```
+</code>
+</pre>
+</div>
+
+renders as
+
+```markmap
+- Mindmaps
+  - Links
+    - [Wowchemy Docs](https://wowchemy.com/docs/)
+    - [Discord Community](https://discord.gg/z8wNYzb)
+    - [GitHub](https://github.com/wowchemy/wowchemy-hugo-themes)
+  - Features
+    - Markdown formatting
+    - **inline** ~~text~~ *styles*
+    - multiline
+      text
+    - `inline code`
+    -
+      ```js
+      console.log('hello');
+      console.log('code block');
+      ```
+    - Math: $x = {-b \pm \sqrt{b^2-4ac} \over 2a}$
+```
+
+### Charts
+
+Wowchemy supports the popular [Plotly](https://plot.ly/) format for interactive charts.
+
+Save your Plotly JSON in your page folder, for example `line-chart.json`, and then add the `{{</* chart data="line-chart" */>}}` shortcode where you would like the chart to appear.
+
+Demo:
+
+{{< chart data="line-chart" >}}
+
+You might also find the [Plotly JSON Editor](http://plotly-json-editor.getforge.io/) useful.
+
+### Math
+
+Wowchemy supports a Markdown extension for $\LaTeX$ math. You can enable this feature by toggling the `math` option in your `config/_default/params.yaml` file.
+
+To render _inline_ or _block_ math, wrap your LaTeX math with `{{</* math */>}}$...${{</* /math */>}}` or `{{</* math */>}}$$...$${{</* /math */>}}`, respectively. (We wrap the LaTeX math in the Wowchemy _math_ shortcode to prevent Hugo rendering our math as Markdown. The _math_ shortcode is new in v5.5-dev.)
+
+Example **math block**:
+
+```latex
+{{</* math */>}}
+$$
+\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}
+$$
+{{</* /math */>}}
+```
+
+renders as
+
+{{< math >}}
+$$\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}$$
+{{< /math >}}
+
+Example **inline math** `{{</* math */>}}$\nabla F(\mathbf{x}_{n})${{</* /math */>}}` renders as {{< math >}}$\nabla F(\mathbf{x}_{n})${{< /math >}}.
+
+Example **multi-line math** using the math linebreak (`\\`):
+
+```latex
+{{</* math */>}}
+$$f(k;p_{0}^{*}) = \begin{cases}p_{0}^{*} & \text{if }k=1, \\
+1-p_{0}^{*} & \text{if }k=0.\end{cases}$$
+{{</* /math */>}}
+```
+
+renders as
+
+{{< math >}}
+
+$$
+f(k;p_{0}^{*}) = \begin{cases}p_{0}^{*} & \text{if }k=1, \\
+1-p_{0}^{*} & \text{if }k=0.\end{cases}
+$$
+
+{{< /math >}}
+
+### Diagrams
+
+Wowchemy 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[Hard] -->|Text| B(Round)
+    B --> C{Decision}
+    C -->|One| D[Result 1]
+    C -->|Two| E[Result 2]
+    ```
+
+renders as
+
+```mermaid
+graph TD
+A[Hard] -->|Text| B(Round)
+B --> C{Decision}
+C -->|One| D[Result 1]
+C -->|Two| E[Result 2]
+```
+
+An example **sequence diagram**:
+
+    ```mermaid
+    sequenceDiagram
+    Alice->>John: Hello John, how are you?
+    loop Healthcheck
+        John->>John: Fight against hypochondria
+    end
+    Note right of John: Rational thoughts!
+    John-->>Alice: Great!
+    John->>Bob: How about you?
+    Bob-->>John: Jolly good!
+    ```
+
+renders as
+
+```mermaid
+sequenceDiagram
+Alice->>John: Hello John, how are you?
+loop Healthcheck
+    John->>John: Fight against hypochondria
+end
+Note right of John: Rational thoughts!
+John-->>Alice: Great!
+John->>Bob: How about you?
+Bob-->>John: Jolly good!
+```
+
+An example **Gantt diagram**:
+
+    ```mermaid
+    gantt
+    section Section
+    Completed :done,    des1, 2014-01-06,2014-01-08
+    Active        :active,  des2, 2014-01-07, 3d
+    Parallel 1   :         des3, after des1, 1d
+    Parallel 2   :         des4, after des1, 1d
+    Parallel 3   :         des5, after des3, 1d
+    Parallel 4   :         des6, after des4, 1d
+    ```
+
+renders as
+
+```mermaid
+gantt
+section Section
+Completed :done,    des1, 2014-01-06,2014-01-08
+Active        :active,  des2, 2014-01-07, 3d
+Parallel 1   :         des3, after des1, 1d
+Parallel 2   :         des4, after des1, 1d
+Parallel 3   :         des5, after des3, 1d
+Parallel 4   :         des6, after des4, 1d
+```
+
+An example **class diagram**:
+
+    ```mermaid
+    classDiagram
+    Class01 <|-- AveryLongClass : Cool
+    Class03 *-- Class04
+    Class05 o-- Class06
+    Class07 .. Class08
+    Class09 --> C2 : Where am i?
+    Class09 --* C3
+    Class09 --|> Class07
+    Class07 : equals()
+    Class07 : Object[] elementData
+    Class01 : size()
+    Class01 : int chimp
+    Class01 : int gorilla
+    Class08 <--> C2: Cool label
+    ```
+
+renders as
+
+```mermaid
+classDiagram
+Class01 <|-- AveryLongClass : Cool
+Class03 *-- Class04
+Class05 o-- Class06
+Class07 .. Class08
+Class09 --> C2 : Where am i?
+Class09 --* C3
+Class09 --|> Class07
+Class07 : equals()
+Class07 : Object[] elementData
+Class01 : size()
+Class01 : int chimp
+Class01 : int gorilla
+Class08 <--> C2: Cool label
+```
+
+An example **state diagram**:
+
+    ```mermaid
+    stateDiagram
+    [*] --> Still
+    Still --> [*]
+    Still --> Moving
+    Moving --> Still
+    Moving --> Crash
+    Crash --> [*]
+    ```
+
+renders as
+
+```mermaid
+stateDiagram
+[*] --> Still
+Still --> [*]
+Still --> Moving
+Moving --> Still
+Moving --> Crash
+Crash --> [*]
+```
+
+### Todo lists
+
+You can even write your todo lists in Markdown too:
+
+```markdown
+- [x] Write math example
+  - [x] Write diagram example
+- [ ] Do something else
+```
+
+renders as
+
+- [x] Write math example
+  - [x] Write diagram example
+- [ ] Do something else
+
+### Tables
+
+Save your spreadsheet as a CSV file in your page's folder and then render it by adding the _Table_ shortcode to your page:
+
+```go
+{{</* table path="results.csv" header="true" caption="Table 1: My results" */>}}
+```
+
+renders as
+
+{{< table path="results.csv" header="true" caption="Table 1: My results" >}}
+
+### Callouts
+
+Academic supports a [shortcode for callouts](https://wowchemy.com/docs/content/writing-markdown-latex/#callouts), also referred to as _asides_, _hints_, or _alerts_. By wrapping a paragraph in `{{%/* callout note */%}} ... {{%/* /callout */%}}`, it will render as an aside.
+
+```markdown
+{{%/* callout note */%}}
+A Markdown aside is useful for displaying notices, hints, or definitions to your readers.
+{{%/* /callout */%}}
+```
+
+renders as
+
+{{% callout note %}}
+A Markdown aside is useful for displaying notices, hints, or definitions to your readers.
+{{% /callout %}}
+
+### Spoilers
+
+Add a spoiler to a page to reveal text, such as an answer to a question, after a button is clicked.
+
+```markdown
+{{</* spoiler text="Click to view the spoiler" */>}}
+You found me!
+{{</* /spoiler */>}}
+```
+
+renders as
+
+{{< spoiler text="Click to view the spoiler" >}} You found me! {{< /spoiler >}}
+
+### Icons
+
+Academic enables you to use a wide range of [icons from _Font Awesome_ and _Academicons_](https://wowchemy.com/docs/getting-started/page-builder/#icons) in addition to [emojis](https://wowchemy.com/docs/content/writing-markdown-latex/#emojis).
+
+Here are some examples using the `icon` shortcode to render icons:
+
+```markdown
+{{</* icon name="terminal" pack="fas" */>}} Terminal  
+{{</* icon name="python" pack="fab" */>}} Python  
+{{</* icon name="r-project" pack="fab" */>}} R
+```
+
+renders as
+
+{{< icon name="terminal" pack="fas" >}} Terminal  
+{{< icon name="python" pack="fab" >}} Python  
+{{< icon name="r-project" pack="fab" >}} R
+
+### Did you find this page helpful? Consider sharing it 🙌

content/post/writing-technical-content/line-chart.json

@@ -0,0 +1,71 @@
+{
+  "data": [
+    {
+      "uid": "babced",
+      "fill": "tonexty",
+      "mode": "none",
+      "name": "Col2",
+      "type": "scatter",
+      "x": [
+        "2000-01-01",
+        "2001-01-01",
+        "2002-01-01",
+        "2003-01-01",
+        "2004-01-01",
+        "2005-01-01",
+        "2006-01-01",
+        "2007-01-01",
+        "2008-01-01",
+        "2009-01-01",
+        "2010-01-01",
+        "2011-01-01",
+        "2012-01-01",
+        "2013-01-01",
+        "2014-01-01",
+        "2015-01-01",
+        "2016-01-01"
+      ],
+      "y": [
+        "17087182",
+        "29354370",
+        "38760373",
+        "40912332",
+        "51611646",
+        "64780617",
+        "85507314",
+        "121892559",
+        "172338726",
+        "238027855",
+        "206956723",
+        "346004403",
+        "697089489",
+        "672985183",
+        "968882453",
+        "863105652",
+        "1068513050"
+      ],
+      "fillcolor": "rgb(224, 102, 102)"
+    }
+  ],
+  "layout": {
+    "title": "Total Number of Websites",
+    "width": 800,
+    "xaxis": {
+      "type": "date",
+      "range": [946702800000, 1451624400000],
+      "title": "Source: <a href=\"http://www.scribblrs.com/\">Scribblrs</a><br>Source: <a href=\"http://www.internetlivestats.com/total-number-of-websites/\">Internet Live Stats</a>",
+      "showgrid": false,
+      "autorange": true,
+      "tickformat": "%Y"
+    },
+    "yaxis": {
+      "type": "linear",
+      "range": [0, 1124750578.9473684],
+      "title": "",
+      "autorange": true
+    },
+    "height": 500,
+    "autosize": false
+  },
+  "frames": []
+}

content/post/writing-technical-content/results.csv

@@ -0,0 +1,4 @@
+customer_id, score
+1,0
+2,0.5
+3,1