Update themes

This commit is contained in:
Vincent Prouillet 2020-04-15 18:53:46 +02:00
parent 167b2b9974
commit 07e0853183
8 changed files with 364 additions and 0 deletions

View file

@ -0,0 +1,78 @@
+++
title = "Clean Blog"
description = "A port of Start Bootstrap Clean Blog for Zola"
template = "theme.html"
date = 2020-01-01T23:06:35+00:00
[extra]
created = 2020-01-01T23:06:35+00:00
updated = 2020-01-01T23:06:35+00:00
repository = "https://github.com/dave-tucker/zola-clean-blog"
homepage = "https://github.com/dave-tucker/zola-clean-blog"
minimum_version = "0.4.0"
license = "MIT"
demo = "https://zola-clean-blog.netlify.com/"
[extra.author]
name = "Dave Tucker"
homepage = "https://dtucker.co.uk"
+++
zola-clean-blog
===============
![screenshot](screenshot.png)
A port of the StartBootstrap Clean Blog theme, for Zola.
## Demo
[Live Demo](https://zola-clean-blog.netlify.com)
## Usage
To use the theme, clone this repository to your `themes` directory.
It requires that you use the categories and tags taxonomies.
This can be done with the following additions to `config.toml`:
```toml
theme = "zola-clean-blog"
taxonomies = [
{name = "categories", rss = true, paginate_by=5},
{name = "tags", rss = true, paginate_by=5},
]
```
## Features
- Paginated Home/Categories/Tag Pages
- Customizable Menu
- Customizable Social Links
## How To Customize
- To replace header images, add a new image to `static/img/$page-bg.jpg` where `$page` is one of `about`, `home`, `post` or `contact`.
- To replace the copyright field, create your own `templates/index.html` to extend the template and add a `copyright` block:
```
{%/* extends "themes/zola-clean-blog/templates/index.html" */%}
{%/* block copyright */%}
Copyright %copy; Example, Inc. 2016-2019
{%/* endblock copyright */%}
```
- To add a new menu item, override `clean_blog_menu` in your `config.toml`. You can use `$BASE_URL` to reference your own site.
- To add a new social link, override `clean_blog_social` in your `config.toml`. You can use `$BASE_URL` to reference your own site.
- To add Google Analytics, you may add your script to the `extrascripts` block using your own `index.html`
```
{%/* extends "themes/zola-clean-blog/templates/index.html" */%}
{%/* block analytics */%}
<script>
...
</script>
{%/* endblock analytics */%}
```

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.8 MiB

View file

@ -0,0 +1,122 @@
+++
title = "Docsascode_theme"
description = "A modern simple Zola's theme related to docs as code methodology"
template = "theme.html"
date = 2020-03-05T23:16:20+03:00
[extra]
created = 2020-03-05T23:16:20+03:00
updated = 2020-03-05T23:16:20+03:00
repository = "https://github.com/codeandmedia/zola_docsascode_theme.git"
homepage = "https://github.com/codeandmedia/zola_docsascode_theme"
minimum_version = "0.10.0"
license = "MIT"
demo = "docsascode.codeandmedia.com"
[extra.author]
name = "Roman Soldatenkov"
homepage = "https://codeandmedia.com"
+++
**Demo: [docsascode.codeandmedia.com](http://docsascode.codeandmedia.com)**
I was inspired by [Linode's approach](https://www.linode.com/2020/01/17/docs-as-code-at-linode/) to creating and managing docs. They call it _docs as code methodology._ Thereby my aim was making simple and productive way to work with any sort of documents and articles through Markdown, Git and Docker/k8s optionally.
The repo contains a theme for [Zola](https://www.getzola.org/) (the best static site generator I've ever seen) and dockerfile for building Docker images with Nginx-alpine. You can push to your Docker an [image with demo-content](https://hub.docker.com/r/codeandmedia/zola_docsascode_theme)
```
codeandmedia/zola_docsascode_theme:latest
```
## Perks
* light / dark switcher
* tags and authors taxonomies by default
* search
* useful UI both on mobiles and desktops
## 6 steps build your knowledge base/docs repo
1. Fork the repo
2. delete demo content and add your own (I explain how to structure it below)
3. change website name and domain in config.toml, also, change the title in _index.md in a root
4. connect your repo to dockerhub
5. build your docker image or setup [autobuilds](https://docs.docker.com/docker-hub/builds/)
6. host a builded docker image on your own way
But, zola is amazing static site generator, so you feel free to
1. download all repo files
2. again delete demo content and add your own
3. change name and domain in config.toml/index.md
4. setup zola (win, linux, mac)
5. execute zola build
6. host builded html-output anywhere you want
Zola supports Netlify and other similar services, or you can decide to create your own CI/CD process.
## How to structure your content
All your articles should be inside _content_ folder. Any images, videos, other static files should be inside _static._
### Folders
Every folder should contains _index.md like
```toml
+++
title = "Docsascode title"
description = "Description is optional"
sort_by = "date" # sort by weight or date
insert_anchor_links = "right" # if you want § next to headers
+++
```
Each folder is the section of the website, it means if you create folder foo it will be seen as _yoursitedomain.com/foo_
The theme supports folders in folders and articles + folders in one folder (see an example inside _content_). So you can store inside folder another folders and describe in index some specific details.
### Pages
A page should be started by
```toml
+++
title = "File and folders in folder"
date = 2020-01-18 # or weight
description = "Description"
insert_anchor_links = "right"
[taxonomies] #all taxonomies is optional
tags = ["newtag"]
authors = ["John Doe"]
+++
```
Zola allows to create drafts:
```toml
draft = true
```
Also, by default you have two taxonomies: _tags_ and _authors_. It's optional, not necessary to use it on all pages. And you can add your own taxonomy:
1. Copy tags or authors folder and rename it to your taxonomy
2. Add your taxonomy to config.toml
3. Add to page.html template code like
```rust
{%/* if page.taxonomies.yourtaxonomynameplural */%}
<ul>
{%/* for tag in page.taxonomies.yourtaxonomynameplural */%}
<li><a href="{{/* get_taxonomy_url(kind="yourtaxonomynameplural", name=yourtaxonomyname) | safe */}}" >{{/* yourtaxonomyname */}}</a></li>
{%/* endfor */%}
</ul>
{%/* endif */%}
```
Done. I told you Zola is amazing :)
Anyway you can rewrite theme for your own wishes with Zola ([link to documentation](https://www.getzola.org/documentation/getting-started/installation/))

Binary file not shown.

After

Width:  |  Height:  |  Size: 158 KiB

View file

@ -0,0 +1,71 @@
+++
title = "Slim"
description = "Slim is a minimal, clean and beautiful theme for Zola."
template = "theme.html"
date = 2019-10-01T01:16:57+01:00
[extra]
created = 2019-10-01T01:16:57+01:00
updated = 2019-10-01T01:16:57+01:00
repository = "https://github.com/jameshclrk/zola-slim"
homepage = "https://github.com/jameshclrk/zola-slim"
minimum_version = "0.8.0"
license = "MIT"
demo = "https://zola-slim.netlify.com"
[extra.author]
name = "James Clark"
homepage = "https://jamesclark.dev"
+++
# Slim
Slim is a minimal, clean and beautiful theme for [Zola](http://getzola.org/).
This theme was ported to Zola, the original is available at [zhe/hugo-theme-slim](https://github.com/zhe/hugo-theme-slim). It is excellent, thank you [zhe](https://github.com/zhe)!
![Slim screenshot](https://github.com/jameshclrk/zola-slim/blob/master/screenshot.png)
[Demo](http://zola-slim.netlify.com).
## Installation
```
cd themes
git clone https://github.com/jameshclrk/zola-slim slim
```
See the [official docs](https://www.getzola.org/documentation/themes/installing-and-using-themes/) for more information.
## Configuration
Slim supports a `tags` taxonomy by default. This can be enabled by setting it in your `config.toml`:
```
taxonomies = [
{name = "tags", paginate_by = 5, rss = true}
]
```
There are a couple of extra options supported:
```
[extra]
# Show a summary of a post in a list
slim_summary = false
# Show the content of a post in a list
slim_content = false
# Links to show at the top of the menu
slim_menu = [
{url = "$BASE_URL/tags", name = "Tags"}
]
# Links to show at the bottom of the menu
slim_social = [
{url = "https://github.com/jameshclrk", name = "Github"}
]
```
## License
Open sourced under [MIT license](https://github.com/zhe/hugo-theme-slim/blob/master/LICENSE.md).

Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

View file

@ -0,0 +1,93 @@
+++
title = "pickles"
description = "A modern, simple, clean blog theme for Zola."
template = "theme.html"
date = 2020-02-06T18:26:26-08:00
[extra]
created = 2020-02-06T18:26:26-08:00
updated = 2020-02-06T18:26:26-08:00
repository = "https://github.com/lukehsiao/zola-pickles.git"
homepage = "https://github.com/lukehsiao/zola-pickles"
minimum_version = "0.4.0"
license = "MIT OR Apache-2.0"
demo = ""
[extra.author]
name = "Luke Hsiao"
homepage = "https://www.lukehsiao.com"
+++
# Pickles
Pickles is a clean, responsive blog theme based on the Hugo theme with the same name featuring pagination.
![pickles screenshot](https://github.com/lukehsiao/zola-pickles/blob/master/screenshot.png?raw=true)
## Installation
First download this theme to your `themes` directory:
```bash
$ cd themes
$ git clone https://github.com/lukehsiao/zola-pickles.git
```
and then enable it in your `config.toml`:
```toml
theme = "zola-pickles"
```
The theme requires putting the posts in the root of the `content` folder and to
enable pagination, for example in `content/_index.md`:
```
+++
paginate_by = 5
sort_by = "date"
insert_anchor_links = "right"
+++
```
## Options
```toml
[extra]
# A line to display underneath the main title
subtitle = "Example subtitle"
# Text to display in the footer of the page
copyright = "Copyright authors year"
# Your Google Analytics ID
analytics = ""
# See below
katex_enable = false
```
### KaTeX math formula support
This theme contains math formula support using [KaTeX](https://katex.org/),
which can be enabled by setting `katex_enable = true` in the `extra` section
of `config.toml`.
After enabling this extension, the `katex` short code can be used in documents:
* `{%/* katex(block=true) */%}\KaTeX{%/* end */%}` to typeset a block of math formulas,
similar to `$$...$$` in LaTeX
### Figure Shortcode
This them also includes a figure shortcode for convenience in captioning figures.
```
{%/* figure(link="https://www.example.com/", src="https://www.example.com/img.jpeg", alt="sample alt text") */%}
Your caption here.
{%/* end */%}
```
### Fontawesome
This theme includes fontawesome, so that fontawesome icons can be directly used.

Binary file not shown.

After

Width:  |  Height:  |  Size: 55 KiB