Skip to content

Add images for default and kelp themes #32

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
lovelydinosaur merged 1 commit into from
Feb 13, 2026
Merged

Add images for default and kelp themes #32

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
18 changes: 12 additions & 6 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,8 @@

MkDocs is a smart, simple, website design tool.

![MkDocs](docs/img/mkdocs.png)

## Installation

Install the `mkdocs` command line tool...
Expand All @@ -18,13 +20,13 @@ $ pip install git+https://github.com/encode/mkdocs.git
2. Run `mkdocs serve` to view your documentation in a browser.
3. Run `mkdocs build` to build a static website ready to host.

*MkDocs supports [GitHub Flavored Markdown](writing.md) for page authoring.*
*MkDocs supports [GitHub Flavored Markdown](docs/writing.md) for page authoring.*

## Writing your docs

1. Create additional markdown pages.
2. Use [markdown interlinking](navigation.md#interlinking) between pages.
3. Create a `mkdocs.toml` file to define [the site navigation](navigation.md#navigation) and other configuration.
2. Use [markdown interlinking](docs/navigation.md#interlinking) between pages.
3. Create a `mkdocs.toml` file to define [the site navigation](docs/navigation.md#navigation) and other configuration.
4. Move your markdown pages into a `docs` directory, and update the config.

An example `mkdocs.toml`...
Expand All @@ -45,14 +47,18 @@ title = "Documentation"
favicon = "📘"
```

*Use either [`README.md` or `index.md`](navigation.md#url-structure) for the homepage.*
*Use either [`README.md` or `index.md`](docs/navigation.md#url-structure) for the homepage.*

## Custom styling

Styling adaptations can be kept simple, such as customising the colour scheme, or more comprehensive, such as creating an entirely new theme.

1. Configure the base theme for your project.
2. Modify [the HTML templating](styling.md#templates) to customise the layout.
3. Override or add [CSS and JavaScript](styling.md#statics) static assets.
2. Modify [the HTML templating](docs/styling.md#templates) to customise the layout.
3. Override or add [CSS and JavaScript](docs/styling.md#statics) static assets.

Take a look at the [default theme](https://github.com/lovelydinosaur/mkdocs-theme) and the [kelp theme](https://github.com/lovelydinosaur/kelp-theme) for examples of getting started with theming.

![Kelp](docs/img/kelp.png)

*The MkDocs documentation, served with the Kelp theme.*
Binary file added docs/img/kelp.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/img/mkdocs.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
6 changes: 6 additions & 0 deletions docs/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,8 @@

MkDocs is a smart, simple, website design tool.

![MkDocs](img/mkdocs.png)

## Installation

Install the `mkdocs` command line tool...
Expand Down Expand Up @@ -56,3 +58,7 @@ Styling adaptations can be kept simple, such as customising the colour scheme, o
3. Override or add [CSS and JavaScript](styling.md#statics) static assets.

Take a look at the [default theme](https://github.com/lovelydinosaur/mkdocs-theme) and the [kelp theme](https://github.com/lovelydinosaur/kelp-theme) for examples of getting started with theming.

![Kelp](img/kelp.png)

*The MkDocs documentation, served with the Kelp theme.*