Skip to content

How to set up a Blog

Screenshot 2023-07-22 at 01.01.35

Screenshot 2023-07-22 at 01.02.03

Screenshot 2023-07-22 at 01.04.52

Screenshot 2023-07-22 at 01.08.01

Screenshot 2023-07-22 at 01.11.48

pip3 install mkdocs-material

Screenshot 2023-07-22 at 01.24.48

Open vscode

source venv/bin/activate

Screenshot 2023-07-22 at 01.50.04

Screenshot 2023-07-22 at 02.14.49

Screenshot 2023-07-22 at 01.51.07

Screenshot 2023-07-22 at 02.16.08

Screenshot 2023-07-22 at 02.21.42

Screenshot 2023-07-22 at 02.21.28

Screenshot 2023-07-22 at 02.55.29

site_name: Eve
theme:
  name: material
  features:
    - navigation.tabs
    - navigation.tabs.sticky
    - navigation.sections
    - navigation.expand
    - navigation.path
    - toc.integrate
    - search.suggest
    - search.highligh
    - content.tabs.link
    - content.code.annotation
    - content.code.copy
  language: en
  palette:
    # Palette toggle for light mode
    - scheme: default
      toggle: 
        icon: material/toggle-switch-off-outline 
        name: Switch to dark mode
    #  primary: teal
    #  accent: purple

    # Palette toggle for dark mode
    - scheme: slate
      toggle:
        icon: material/toggle-switch
        name: Switch to light mode
    #  primary: teal
    #   accent: lime

Screenshot 2023-07-22 at 02.55.55

Screenshot 2023-07-22 at 10.12.12

Screenshot 2023-07-22 at 10.12.20

Screenshot 2023-07-22 at 11.06.45

### Code Annotation Examples

#### Codeblocks

Some `code` goes here.

#### Plain codeblck

A plain codeblock:
```
Some code here
def myfunction()
// some comment
```


#### Code for a specific language
Some more code with the `py` 
``` py
import tensorflow as tf
def whatever()
```

#### With a title

``` py title="bubble_sort.py"
def bubble_sort(items):
    for i in range(len(itmes)):
        for j in range(len(items) - 1 - i):
            if items[j] > items[j + 1]:
                items[j], items[j + 1] = items[j + 1], items[j]
```

#### With line numbers
``` py linenums="1"
def bubble_sort(items):
    for i in range(len(itmes)):
        for j in range(len(items) - 1 - i):
            if items[j] > items[j + 1]:
                items[j], items[j + 1] = items[j + 1], items[j]
```

#### With Highting lines
``` py hl_lines="2 3" linenums="1"
def bubble_sort(items):
    for i in range(len(itmes)):
        for j in range(len(items) - 1 - i):
            if items[j] > items[j + 1]:
                items[j], items[j + 1] = items[j + 1], items[j]
```

#### Icons and Emojs

:smile:
:fontawesome-regular-face-laugh-wink:
:fontawesome-brands-twitter:{ .twitter }
:octions-heart-fill-24: { .heart }

:smile:

:fontawesome-regular-face-laugh-wink:

:fontawesome-brands-twitter:{ .twitter }

:octions-heart-fill-24: { .heart }

Screenshot 2023-07-22 at 11.07.30

site_name: Eve
theme:
  name: material
  features:
    - navigation.tabs
    - navigation.tabs.sticky
    - navigation.sections
    - navigation.expand
    - navigation.path
    - toc.integrate
    - search.suggest
    - search.highligh
    - content.tabs.link
    - content.code.annotation
    - content.code.copy
  language: en
  palette:
    # Palette toggle for light mode
    - scheme: default
      toggle: 
        icon: material/toggle-switch-off-outline 
        name: Switch to dark mode
    #  primary: teal
    #  accent: purple

    # Palette toggle for dark mode
    - scheme: slate
      toggle:
        icon: material/toggle-switch
        name: Switch to light mode
    #  primary: teal
    #   accent: lime

extra: 
  social: 
    - icon: fontawesome/brands/github
      link: https://github.com/Everoot

markdown_extensions: 
  - pymdownx.highlight:
      anchor_linenums: true
  - pymdownx.inlinehilite
  - pymdownx.superfences
  - admonition
  - pymdownx.arithmatex:
      generic: true
  - footnotes
  - pymdownx.mark
  - attr_list
  - pymdownx.emoji:
      emoji_index: !!python/name:materialx.emoji.twemoji
      emoji_generator: !!python/name:materialx.emoji.to_svg
  - pymdownx.snippets
  - pymdownx.details


# Copyright
copyright: Copyright © 2023 Eve Liang
# The footer displays a Made with Material for MkDocs notice to denote how the site was generated. 
extra:
  generator: false

github

Screenshot 2023-07-22 at 12.17.35

Screenshot 2023-07-22 at 12.19.53

Screenshot 2023-07-22 at 12.20.30

Screenshot 2023-07-22 at 12.20.53

Screenshot 2023-07-22 at 12.22.55

<!-- ---
comments: true
---

# Document title
# Welcome to MkDocs

For full documentation visit [mkdocs.org](https://www.mkdocs.org).

## Commands

* `mkdocs new [dir-name]` - Create a new project.
* `mkdocs serve` - Start the live-reloading docs server.
* `mkdocs build` - Build the documentation site.
* `mkdocs -h` - Print help message and exit.

## Project layout

    mkdocs.yml    # The configuration file.
    docs/
        index.md  # The documentation homepage.
        ...       # Other markdown pages, images and other files.

### Code Annotation Examples

#### Codeblocks

Some `code` goes here.

#### Plain codeblck

A plain codeblock:
```
Some code here
def myfunction()
// some comment
```


#### Code for a specific language
Some more code with the `py` 
``` py
import tensorflow as tf
def whatever()
```

#### With a title

``` py title="bubble_sort.py"
def bubble_sort(items):
    for i in range(len(itmes)):
        for j in range(len(items) - 1 - i):
            if items[j] > items[j + 1]:
                items[j], items[j + 1] = items[j + 1], items[j]
```

#### With line numbers
``` py linenums="1"
def bubble_sort(items):
    for i in range(len(itmes)):
        for j in range(len(items) - 1 - i):
            if items[j] > items[j + 1]:
                items[j], items[j + 1] = items[j + 1], items[j]
```

#### With Highting lines
``` py hl_lines="2 3" linenums="1"
def bubble_sort(items):
    for i in range(len(itmes)):
        for j in range(len(items) - 1 - i):
            if items[j] > items[j + 1]:
                items[j], items[j + 1] = items[j + 1], items[j]
```

#### Icons and Emojs

:smile:
:fontawesome-regular-face-laugh-wink:
:fontawesome-brands-twitter:{ .twitter }


:smile:

:fontawesome-regular-face-laugh-wink:

:fontawesome-brands-twitter:{ .twitter }
 -->