silicate/silicate-guide
1
0
Fork 0
Code Issues 2 Pull requests Projects Releases Packages Wiki Activity

Initial commit

Browse source
This commit is contained in:
Christian Aribaud 2025-05-09 10:37:43 +02:00
commit 4e10967600
40 changed files with 1650 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

5
.gitignore vendored Normal file
View file

@ -0,0 +1,5 @@
public
static/Shrines.png
hugo
_gen
*.lock

5
archetypes/default.md Normal file
View file

@ -0,0 +1,5 @@
+++
date = '{{ .Date }}'
draft = true
title = '{{ replace .File.ContentBaseName "-" " " | title }}'
+++

220
assets/css/main.scss Normal file
View file

@ -0,0 +1,220 @@
:root {
color-scheme: light dark;
}
* {
box-sizing: border-box;
}
html {
background-blend-mode: hard-light;
background:
fixed linear-gradient(
135deg,
rgba(255, 198, 99, .1) 0%,
rgba(130, 130, 130, 0) 25%,
rgba(130, 130, 130, 0) 75%,
rgba(77, 67, 102, .05) 100%
),
center top fixed url('/silicate_bg.png');
}
body {
color: black;
border: 2px solid grey;
font-family: sans-serif;
line-height: 1.5;
margin: 1rem auto;
max-width: 900px;
padding: 1rem 3rem;
border-radius: 5px;
backdrop-filter: blur(6px) saturate(180%);
background-color: rgba(255, 255, 255, 0.75);
}
header {
border-bottom: 1px solid #222;
margin-bottom: 1rem;
text-align: center;
#banner {
display: block;
background-blend-mode: hard-light;
margin: 0.5rem;
padding: .5rem;
color: white;
font-family: sans-serif;
clip-path: polygon(
1rem 0,
calc(100% - 1rem) 0,
100% calc(100% - 1rem),
calc(100% - 1rem) 100%,
1rem 100%,
0 1rem
);
background:
conic-gradient(from -85deg at 100% 20%, #c6f3f420 90deg, #f9eadb00 90deg),
conic-gradient(from 0deg at 0% 40%, #c6f3f420 70deg, #f9eadb00 70deg),
conic-gradient(from 0deg at 0% 100%, #c6f3f408 40deg, #f9eadb00 40deg),
conic-gradient(from -90deg at 10% 100%, #dbe5f908 70deg, #f9eadb00 70deg),
conic-gradient(from -90deg at 30% 100%, #f9eadb08 15deg, #f9eadb00 15deg),
conic-gradient(from -90deg at 25% 100%, #f9eadb08 10deg, #f9eadb00 10deg),
radial-gradient(circle at 40% 40%, #a9fcfc3b, #FFFFFF00),
#2a2a48;
}
p {
margin: 0;
}
h1 {
margin: 0rem 1rem;
margin-bottom: .5rem;
font-size: 3rem;
text-transform: uppercase;
letter-spacing: 0.8rem;
border-image: linear-gradient(to left,rgba(212, 212, 212, 0) 0%, rgba(212, 212, 212, 0) 20%, rgba(75, 227, 206, 1) 35%, rgba(248, 235, 63, 1) 40%, rgba(242, 152, 69, 1) 45%, rgba(165, 92, 212, 1) 50%, rgba(242, 152, 69, 1) 55%, rgba(248, 235, 63, 1) 60%, rgba(75, 227, 206, 1) 65%, rgba(212, 212, 212, 0) 80%, rgba(212, 212, 212, 0) 100%) 1 / 0 0 3px;
}
nav ul {
list-style: none;
padding: 0;
li {
display: inline-block;
margin: 0 1rem;
}
}
}
footer {
border-top: 1px solid #222;
margin-top: 1rem;
}
a {
color: #00e;
text-decoration: none;
}
ol {
list-style: none;
ol {
border-left: #00000033 solid 2px;
margin-left: 1rem;
}
}
.page-nav {
display: grid;
grid-template-columns: 1fr 1fr;
text-align: center;
* {
border: solid .2rem;
border-radius: 5px;
margin: .5rem;
padding: .5rem 0;
font-weight: bold;
background-color: #00000060;
backdrop-filter: blur(30px) saturate(250%);
color: white;
}
.next {
grid-column-start: 2;
}
a:hover {
color: white;
}
}
blockquote {
margin: 2rem 1rem;
padding: .1rem 0 .1rem 2rem;
border-left: #AAA 3px solid;
position: relative;
font-style: italic;
font-size: 110%;
&::before {
content: '”';
position: absolute;
font-size: 60px;
top: -25px;
left: 0.8rem;
color: #AAA
}
}
hr {
color: white;
}
h1 {
text-align: center;
}
pre {
overflow-x: scroll;
code {
box-shadow: unset;
border: unset;
background-color: unset;
font-size: 100%;
}
}
code, pre {
background-color: #FFFFFF55;
box-shadow: 0 0 3px -2px black;
border: 1px grey solid;
padding: 0 .1rem;
font-size: 110%;
backdrop-filter: blur(12px) saturate(180%);
}
.subtitle {
text-align: center;
margin-top: -1rem;
font-size: 75%;
}
a {
color: #4928e6;
transition: color .7s ease-out;
&:hover{
color: #c238ca;
transition: color .5s cubic-bezier(.19,1,.22,1);
}
&:not([href]), &[href=""]{
color: grey;
text-decoration: line-through;
}
}
main img {
max-width: 100%;
border: solid black 1px;
}
.warning {
color: orangered;
border: solid 2px orangered;
background-color: lightyellow;
padding: 0.5rem;
text-align: center;
p {
margin: 0.5rem 0;
}
}

1
assets/js/main.js Normal file
View file

@ -0,0 +1 @@
console.log('This site was generated by Hugo.');

24
content/_index.md Normal file
View file

@ -0,0 +1,24 @@
+++
title = 'Home page'
+++
{{< warning >}}
This website is under construction and is unfinished!
Some parts and tutorials may be missing or incomplete.
The website will be progressively updated to completion.
Downloads will be available once version 1 of Silicate is ready,
so will the Q&A page.
{{< /warning >}}
# Easily create comics websites!
Silicate is a system that lets you create static webcomic websites that
you fully own with minimal configuration.
Easily add pages with any chapter structure and any number of
translations!
Silicate also lets you customise your website, from just adding
your own CSS to fully customising any templates.

46
content/about.md Normal file
View file

@ -0,0 +1,46 @@
+++
title = 'About Silicate'
slug = 'about'
weight = 4
+++
## Author & History
Hi! I'm Christian Aribaud! Some may also now me as "Bohren".
I've loved webcomic for as long as I can remember! Just imagine -- artists creating
amazing comics, and they put it online for all to see! And *for free*! How cool is that?
And since they put their work online for free, I wanted to help them.
There are two things I know well: software development and speaking French. Yes, I know, I'm sorry.
I helped a few times the webcomic [Pepper & Carrot](https://www.peppercarrot.com/fr/) but nowadays
I'm one of the French translators for [Rising Sand](https://risingsand.glass/)!
And while I love webcomics, I also saw these past years how things can get dire for the
authors -- platforms degrading, exploiting artists, shutting down, embracing that *freaking
GenAI trend*...
And then two things happened : I got interested in [Hugo](https://gohugo.io/) and the RS website
ran into trouble with multilingual support.
I wondered if I could give artists a way to create simple webcomic websites using Hugo without
having to relly on third-party platforms or WordPress.
Silicate is the result.
## Why the name Silicate?
I chose Silicate as an homage to Rising Sand, because it's what got me started!
Also, "Silicate" is pronounced like "Silly Cat" in french, which I find very funny.
## Contacts
If you want to send me questions, feature requests or suggestions, you can do so here:
* [@bhoren](https://bsky.app/profile/bhoren.bsky.social) on Bluesky
* [@bhoren@mastodon.art](https://mastodon.art/@Bhoren) on Mastodon

21
content/tutorials/_index.md Normal file
View file

@ -0,0 +1,21 @@
+++
title = 'Tutorials'
weight = 2
+++
{{< warning >}}
The tutorials are under construction and are incomplete.
{{< /warning >}}
These tutorials will help you learn how to create your websites with this theme, especially
if you've never used Hugo before!
They don't assume you know anything about Hugo and are made to teach you everything you'll need
to know from scratch.
Hugo has its [own tutorials](https://gohugo.io/getting-started/), but they are more general
than Silicate's ones and asume you are a software developer -- they can be overwhelming.
Unlike what the Hugo tutorials tells you, no, you don't need Git -- no, you don't to be comfortable with the command line (although you will use it a little)!
Silicate's tutorials try to remain as simple as possible.

11
content/tutorials/getting-started/_index.md Normal file
View file

@ -0,0 +1,11 @@
+++
title = 'Getting started'
weight = 10
+++
Alright! The goal is to have a very simple website that shows a simple webcomic.
This section is there to understand how Silicate and Hugo work!
This tutorial will use comic pages from [Pepper & Carrot](https://www.peppercarrot.com/fr/) by David Revoy
but if you already have your own comic pages, you can use them too!

125
content/tutorials/getting-started/adding-about.md Normal file
View file

@ -0,0 +1,125 @@
+++
title = 'Adding an About page'
show_toc = true
weight = 40
+++
{{< warning >}}
Page under redaction.
{{< /warning >}}
For the finishing touch, let's add an "About" page to talk a bit about your webcomic.
Once again, this will be a page under the `content/` folder.
<!--more-->
## What is and is not a *comic* page
Hugo knows the type of a page by looking at the *first* folder after `content/`.
For example, `content/comic/E01P01/` is a `comic` page.
The type can be anything, so `content/animal/insect/ant/` would be of type `animal`.
But Silicate doesn't not know what to do with that type, so it will a "normal" or "default" page.
So, simply put: anything under `content/comic/` will be a comic page, and everything
*outside* will be a "normal" page.
## Creating the About page
Here's the twist: since we don't care about type for the "about" page, we don't
need a folder.
Just like `index.md`, create a `content/about.md` text file.
Then, you just need to add a front matter and some content! In the case of the Pepper & Carrot demo:
```
+++
title = 'About'
+++
### Silicate Pepper & Carrot demo
This website is a demo for Silicate using [Pepper & Carrot webcomic](https://www.peppercarrot.com/)
comic pages as an example.
### Browse the source
You can see the source used to create this website here :
<https://silicate.aribaud.net/demos-sources/pepper-carrot>
### Check out Silicate
You can learn more about Silicate on its main website:
<https://silicate.aribaud.net/>
```
Now, you can navigate to `https://localhost:1313/about/` and you should see the about page:
{{< warning >}}
Screenshot will be added soon.
{{< /warning >}}
Unlike the comic pages, we have no folder with a `index.md` file, directly a `.md` file because we
need no other resources. This is what Hugo calls a "regular page", as opposed to a "page bundle" like before.
## Adding the About page to the header navigation bar
Right now the header navigation bar only shows "Home" and "Archive"; we want to add our new "About" page to it.
The header is configured through `hugo.toml`.
Since nothing is set yet for the main menu, it uses defaults values from `themes/silicate/hugo.toml`.
First, let's open `themes/silicate/hugo.toml` and copy-paste the whole `[menus]` table into
our own `hugo.toml`.
We should have something like this now:
```
title = 'Silicate Pepper & Carrot Demo'
baseURL = 'https://silicate.aribaud.net/demos/pepper-carrot/'
theme = 'silicate'
copyright = 'Demo based on Pepper & Carrot - CC-By www.peppercarrot.com'
[menus]
[[menus.main]]
name = 'Home'
pageRef = '/'
weight = 10
[[menus.main]]
name = 'Archive'
pageRef = '/comic'
weight = 20
[params]
[params.author]
email = 'jdoe@example.org'
name = 'John Doe'
```
Now, we can add our own About page entry inside the `[menus]` table:
```
[[menus.main]]
name = 'About'
pageRef = '/about'
weight = 30
```
* `name` is what is displayed in the nav
* `pageRef` is what page should be displayed, relative to the
`content/` folder
* `weight` is the sorting order just like we saw for pages
Be careful, we need `[[menus.main]]` and **not** `[menus.main]`.
Now, if we look at the home page, we should have a working `About` link
leading to the corresponding page!:
{{< warning >}}
Screenshot will be added soon.
{{< /warning >}}

114
content/tutorials/getting-started/basic-configuration.md Normal file
View file

@ -0,0 +1,114 @@
+++
title = 'Basic configuration'
show_toc = true
weight = 20
+++
{{< warning >}}
Page under construction.
{{< /warning >}}
Still a bit boring, but let's add some more information about your webcomic into `hugo.toml`!
Except for the title, all of them are optional.
Be sure that you are currently [running the hugo server]({{% relref "tutorials/getting-started/site-creation" %}}#starting-your-site)!
<!--more-->
## Title
First, let's fix your site's title by changing `title = 'My New Hugo Site'` with
`title = 'Silicate Pepper & Carrot Demo'` -- or your own title -- then save.
Now, two things should happen if Hugo is still running :
- Some new lines should appear in your terminal, they should look like this :
```
Change of config file detected, rebuilding site (#2).
2025-05-14 13:43:16.453 +0200
Web Server is available at http://localhost:1313/ (bind address 127.0.0.1)
Total in 11 ms
```
- If your broswer is still open, then the page should have automatically reloaded and the title should be fixed!
{{< warning >}}
Screenshot will be added soon.
{{< /warning >}}
That is because when Hugo is running, it automatically checks for changes in your files, and when it finds some, it
updates the website in your browser.
That is what the `Watching for changes in [...]` and
`Watching for config changes in [...]` lines meant when you ran `hugo server`.
Sometimes, the auto-reloading will fail and you will get `[ERROR]: ...` messages and Hugo
won't be able to work again on its own. If that happens, try to stop the server by typing
`ctrl`-`c` in the terminal then running again the `./hugo server` command.
If that doesn't work, then you may have to check your configuration files.
Hugo should display a message telling you what it thinks it wrong.
## Copyright
As you may have seen, Silicate puts a default copyright on your website:
`Copyright 2025. All rights reserved.`
You may want to change that. Here, since we're doing a demo from Pepper & Carrot's, let's put a proper attribution.
Once again, it's a new line inside `hugo.toml` : `copyright = 'Demo based on Pepper & Carrot - CC-By www.peppercarrot.com'`.
It will be both shown on the website and in RSS feeds.
{{< warning >}}
Screenshot will be added soon.
{{< /warning >}}
## Author info
This setting is only used in the RSS feeds.
This time, we need to add [*tables*](https://toml.io/en/v1.0.0#table) inside `hugo.toml`.
Add the following lines, using your own info:
```
[params]
[params.author]
email = 'jdoe@example.org'
name = 'John Doe'
```
`[params]` is the table where most configurations for hugo will be placed.
`[params.author]` is a sub-table table inside `[params]`.
## Base URL
The base URL is the URL where your website will be available online -- where people will be able to access it.
For example, if you rent `www.my-webcomic.com`, then your base URL will most likely be `https://www.my-webcomic.com/`.
In the case of Silicate, one of the demo uses `https://silicate.aribaud.net/demos/pepper-carrot/`, so we
can change the value of `baseURL` in `hugo.toml` like this: `baseURL = 'https://silicate.aribaud.net/demos/pepper-carrot/'`.
## Recap
Your `hugo.toml` file should now look like this :
```
title = 'Silicate Pepper & Carrot Demo'
baseURL = 'https://silicate.aribaud.net/demos/pepper-carrot/'
theme = 'silicate'
copyright = 'Demo based on Pepper & Carrot - CC-By www.peppercarrot.com'
[params]
[params.author]
email = 'jdoe@example.org'
name = 'John Doe'
```

230
content/tutorials/getting-started/new-comic-and-pages/index.md Normal file
View file

@ -0,0 +1,230 @@
+++
title = 'Adding a comic and comic pages'
show_toc = true
weight = 30
+++
{{< warning >}}
Page under redaction.
{{< /warning >}}
Ok! We have a blank site with Silicate installed!
Now, we can start the insteresting part: adding actual comic pages!
For this tutorial, we'll use [Pepper & Carrot](https://www.peppercarrot.com/) pages.
This guide has a premade archive with everything you'll need.
You can download it as a [tar.gz]() archive for Linux/Mac or a [zip]() for Windows.
{{< warning >}}
Archives will be created soon.
{{< /warning >}}
But if you have your own comic already, you can use your it too!
<!--more-->
## Setting up the comic
First off, let's create a `comic/` folder in `my_website/content/`.
It will be where all comic pages will go.
{{< warning >}}
Information on how to set the comic title and description will be added soon.
{{< /warning >}}
## Adding a new comic page
Now we'll add page 01 from episode 01 from Pepper & Carrot!
Create a `E01P01/` folder inside `comic/`. If you use your own webcomic,
you can use your own page title as a folder name (just avoid spaces and specials characters
because this folder name will be used as a URL for this page).
Then create a text file named `index.md` (If you are on Windows, make sure the file created isn't
`index.md.txt`; Windows likes to hide file extensions from you may need to force windows to display them).
This `index.md` file tells Hugo that the `E01P01` folder is a page and that all other
files inside this folder belong to this page. This is what Hugo calls a "Page Bundle".
### Post content
Most webcomics will have a small "blog" post associated with a page -- a description,
some lore, etc.
You can do this by adding the post content to `index.md`.
Here, for example, we can add the credit of the first Pepper & Carrot page :
```
+++
title = 'Episode 1 - Page 1'
weight = 10
+++
Creative Commons Attribution 4.0 International license
------
Attribution to:
Art: David Revoy.
Scenario: David Revoy.
English (original version)
Proofreading: Amireeti, Alex Gryson.
------
Credit for the universe of Pepper&Carrot, Hereva:
Creation: David Revoy.
Lead Maintainer: Craig Maloney.
Writers: Craig Maloney, Nicolas Artance, Scribblemaniac, Valvin.
Correctors: Alex Gryson, CGand, Hali, Marno van der Maas, Moini, Willem Sonke.
```
This content uses the [Markdown](https://daringfireball.net/projects/markdown/) syntax,
so you can have some simple styling, like *\*italic text\**, **\*\*bold text\*\***, etc.
{{< warning >}}
Full description of Markdown possibilities will be added later.
{{< /warning >}}
> What is the weird text block with the "+++"?
This block is called a [*front matter*](https://gohugo.io/content-management/front-matter/#article),
it is used to add attributes to the page, such as its title.
The `weight` attribute will be explained in [Page ordering](#page-ordering).
### Comic pictures
Now, all we need are pictures for the comic page.
Create a `strips/` folder inside `E01P01/`
Get the `pages/E01P01.jpg` file from the resources you downloaded -- or your
own comic page -- and add it inside the `strips/` folder.
You should now have this (and some other files and/or folders) :
```
my_webcomic/
hugo.toml
content/
comic/
E01P01/
index.md
strips/
E01P01.jpg
```
If your [website is running]({{% relref "tutorials/getting-started/site-creation" %}}#starting-your-site),
then the home page should display the page you just added like so!:
{{< warning >}}
Screenshot will be added soon.
{{< /warning >}}
Also, you can add multiple pictures inside `strips/`, Silicate will look for everything that is
a PNG, JPG or WEBP. On the website, they'll be ordered top to bottom by name, so you can make
a Webtoon-style long comic strip from many smaller strips.
### Page ordering
Page ordering is important, and can get tricky.
Imagine you have a naming convention for your pages like so: `P1`, `P2`, ..., `P10`, `P11`, ...
If you order them by name, then you have a trouble, because they'll get ordered like so:
1. P1
2. P10
3. P11
3. P2
4. ...
It gets even worse if your pages have an actual name and no naming convention.
> Wait! Why not use a creation or publication date?
We could use a publication date, but imagine you want to add a new page between two others.
We now have *another* problem because you either can't or have to lie about the date to make it work.
That's why Silicate relies only on ...
#### Weight
The way Silicate handles ordering is by using the [*weight*](https://gohugo.io/methods/page/weight/#article) of the page.
You can see it like this: pages with a small weight floats up to the top and are first, pages with a big
weight sink to the bottom and are last.
![Weight schema](weight_schema.png)
You can set the weight with the line `weight = ...` in the front matter. It **has** to be a positive whole
number, things like `4.7` and `-1` won't work.
#### Best practice
What you should probably do is this:
- Page 1 gets a weight of 10
- Page 2 gets a weight of 20
- ...
- Page 50 gets a weight of 500
Why? Because starting at 10 then incrementing the weight by 10 each time lets you insert up to nine
pages before or after any page, should the need arise.
> Won't I run out of values? My webcomic is very long.
Even if you have a *lot* of pages -- say 4000 -- you would use
a weight of 40 000, which is _**way**_ below the maximum (which is at least *2 147 483 647*).
### Page creation date
If you want, you can set a [creation date](https://gohugo.io/content-management/front-matter/#date) for the page.
It will be displayed on the website under the page title.
You can add a `date='...'` field in the front matter.
The date format can be [multiple things](https://gohugo.io/content-management/front-matter/#dates).
Let's say the date of the page we just created was 9H35 the 2025 / May / 31, then the value to add is :
`date = '2025-05-31T09:35:00'`
(If we care only about the day, then we can add: `date = '2025-05-31'`)
Now, the page should be displayed with a creation date under its title!:
{{< warning >}}
Screenshot will be added soon.
{{< /warning >}}
## Recap
Now you have most of what you need to have a simple webcomic!
You can just keep adding new pages!
Here's what to remember:
* Website configuraiton is in `hugo.toml`.
* Comic pages go inside `content/comic/`.
* Comic pages are folders with an `index.md` file.
* Comic page pictures go into a `strips/` sub-folder.
* `index.md` has a *front matter* to set its title, ordering and creation date.
* Ordering is done through weights. Light/Small = first, heavy/big = last.

BIN
content/tutorials/getting-started/new-comic-and-pages/weight_schema.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 1.4 MiB

213
content/tutorials/getting-started/site-creation/index.md Normal file
View file

@ -0,0 +1,213 @@
+++
title = 'Creating a new site'
show_toc = true
weight = 10
+++
The first step to get started is to install Hugo and Silicate then create
a blank website!
Let's be honest: this will be the most **boring** part of the guides: it's
the most technical one and is mostly settings things up.
You will have to use the terminal a bit, but it's easy, you'll see!
<!--more-->
## Creating a workspace and getting Hugo
On your computer, create a folder where you'll work on your Hugo websites.
For the rest of the guide, it will be named `hugo_workspace/`.
Then you need to get Hugo itself. Hugo is a single executable file, it
requires no installation, only that you download it.
Hugo has its [own guide](https://gohugo.io/installation/) on how to install it, but
this tutorial will give you a simpler version.
Go to the [Hugo release page](https://github.com/gohugoio/hugo/releases/latest).
Unfold the "Assets" section. From it, you can download Hugo based on your
OS :
* Linux: download the `hugo_extended_X.XXX.X_linux-64bit.tar.gz` file
* Mac: download the `hugo_extended_X.XXX.X_darwin-universal.tar.gz` file
* Windows: download the `hugo_extended_X.XXX.X_windows-amd64.zip` file
Once downloaded, extract the `hugo` executable (`hugo.exe` for Windows) from the archive into `hugo_workspace/`
Now you'll need a terminal, also known as "shell", "command line" or "CLI" -- basically a text window to
send instructions to your computer:
* Linux: It varies from OS to OS, but you should be able to open one by searching "Terminal" in your applications
* MacOS: [Click on the Launchpad icon then search and click on "Terminal"](https://support.apple.com/en-ca/guide/terminal/apd5265185d-f365-44cb-8b09-71a064a42125/mac)
* You can also navigate to `/Applications/Utilities` and double click on `Terminal`
* Windows: Click on the Windows icon then search and click on "Command Prompt"
Regardless of you OS, you should have a window open that you can type commands into then
press enter to run them.
First, we need to tell the terminal we want to run commands from the `hugo_workspace/` directory.
Get the complete (also known as absolute) path of your `hugo_workspace/` folder.
You can do that by navigating inside this folder with your file explorer then clicking
on the path shown on the top then copying it.
Then, in the terminal, type the following, replacing `<path to hugo workspace>` with the one you just copied:
* Linux & Mac & Windows: Type `cd <path to hugo workspace>` then press enter
* `cd` stands for "Change Directory"!
Now, to see if everything is working, you can type `./hugo version` (`hugo.exe version` for Windows) then press enter.
If everything is OK, you should see a line like this :
```
hugo v0.147.2-[...] VendorInfo=gohugoio
```
----------
## Creating a site
With the terminal open in the `hugo_workspace/` folder, run the command :
* Linux & Mac: `./hugo new site my_webcomic`
* Windows: `hugo.exe new site my_webcomic`
If everything went right, hugo should show you something similar to this:
```
Congratulations! Your new Hugo site was created in /.../hugo_workspace/my_webcomic.
Just a few more steps...
1. Change the current directory to /.../hugo_workspace/my_webcomic.
2. Create or install a theme:
- Create a new theme with the command "hugo new theme <THEMENAME>"
- Or, install a theme from https://themes.gohugo.io/
3. Edit hugo.toml, setting the "theme" property to the theme name.
4. Create new content with the command "hugo new content <SECTIONNAME>/<FILENAME>.<FORMAT>".
5. Start the embedded web server with the command "hugo server --buildDrafts".
See documentation at https://gohugo.io/.
```
Hugo just created a new `my_webcomic/` folder inside `hugo_workspace/`. That's where Hugo will
look for everything it needs to create your website!
Inside `hugo_workspace/my_webcomic/`, you should now have the following folders and files:
* `archetypes/`
* `assets/`
* `content/`
* `data/`
* `i18n/`
* `layouts/`
* `resources/`
* `static/`
* `themes/`
* `hugo.toml`
You don't need to worry about each and every one of them, they will be explained when -- and only if -- nedeed.
Like Hugo said in its output, you can change the directory to this new one in the Terminal :
* Linux & Mac & Windows: Type `cd my_webcomic` then press the enter key.
Move the `hugo` / `hugo.exe` executable directly into the `my_webcomic/` folder using
your file explorer.
It will make things simpler.
----------
## Installing the Silicate theme
The first thing we need is a theme -- Hugo doesn't know how to create your website
without one.
All themes go into the `themes/` folder of a Hugo website.
First, [download the Silicate theme](), then extract it into `my_webcomic/themes/`.
{{< warning >}}
Downloads will be available when version 1 of Silicate is ready.
{{< /warning >}}
Now, you should have a `my_webcomic/themes/silicate` folder, but Hugo doesn't
know that it should use that theme. You can let it know by changing your
website configuration.
Most of a Hugo website configuration is in the `hugo.toml` file.
It's a simple text file using the [TOML format](https://toml.io/en/). Right now, it should look like this:
```
baseURL = 'https://example.org/'
languageCode = 'en-us'
title = 'My New Hugo Site'
```
We'll look at `hugo.toml` and how to fully use it later. For now, just add `theme = 'silicate'`
at the end of the file.
Be careful about the `'` around "silicate", they are necessary!
And with that done, your website is set up to use Silicate! Now, you only need to do one final check.
----------
## Starting your site
With the terminal opened in `my_website/`, type `./hugo server` (`hugo.exe server` on Windows) then press the enter key.
Hugo should say something close to this :
```
Watching for changes in /<...>/hugo_workspace/my_webcomic/{archetypes,assets,content,data,i18n,layouts,static,themes}
Watching for config changes in /<...>/hugo_workspace/my_webcomic/hugo.toml, /<...>/hugo_workspace/my_webcomic/themes/silicate/hugo.toml
Start building sites …
hugo v0.147.2-c7feb15d10b29a94d7fb57c31e8bcb2e92718fb7+extended linux/amd64 BuildDate=2025-05-06T11:18:55Z VendorInfo=gohugoio
| EN
-------------------+-----
Pages | 7
Paginator pages | 0
Non-page files | 0
Static files | 1
Processed images | 0
Aliases | 0
Cleaned | 0
Built in 48 ms
Environment: "development"
Serving pages from disk
Running in Fast Render Mode. For full rebuilds on change: hugo server --disableFastRender
Web Server is available at http://localhost:1313/ (bind address 127.0.0.1)
Press Ctrl+C to stop
```
Hugo actually did two separate things :
* It created your entire website and put it into the `my_webcomic/public/` folder
* It is now running a small web server so you can browse this website
Keep the terminal open! If you close it, then the web server will close too.
Open your web browser and go to the URL Hugo gave you in the
`Web Server is available at XXX` line (for this example, `http://localhost:1313`).
You should see the following page :
![Newly created site screenshot](new_silicate_site.jpg)
If you do, then you are done, the new site is created!
Just so you know, only you can acess your website for now!:
* `localhost` / `127.0.0.1` is a special internet address, it's your own computer
* By saying `(bind address 127.0.0.1)`, Hugo means "Only let 127.0.0.1 -- that is this computer -- access the website".
* `:1313` (or the other number Hugo gave you) is a [port number](https://en.wikipedia.org/wiki/Port_(computer_networking)). If multiple servers runs at once, they would each have a different port.
* To put it simply: if your computer was a street, then this port would be an street number.
You can stop this server at any time by pressing `Ctrl`+`C` in the terminal or by closing the terminal window.

BIN
content/tutorials/getting-started/site-creation/new_silicate_site.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 95 KiB

18
content/tutorials/more-features/_index.md Normal file
View file

@ -0,0 +1,18 @@
+++
title = 'More features'
weight = 20
+++
{{< warning >}}
Most tutorials in this section are still empty but are there regardless
to show you what kind of content to expect once they are done.
{{< /warning >}}
Let's look at some of the functionalities Silicate provides.
You should read [Getting started]({{% relref "tutorials/getting-started/" %}}) first!
And if you are fine with how your website looks already, you can skip to
[publishing your website]({{% relRef "tutorials/publishing-online" %}}).
We'll continue using [Pepper & Carrot](https://www.peppercarrot.com/fr/) by David Revoy as an example.

28
content/tutorials/more-features/adding-translations.md Normal file
View file

@ -0,0 +1,28 @@
+++
title = 'Adding translations'
show_toc = true
weight = 30
+++
{{< warning >}}
Currently under construction.
{{< /warning >}}
<!--more-->
## Configuration for multiple languages
{{< warning >}}
Currently under construction.
{{< /warning >}}
## Translating the website
{{< warning >}}
Currently under construction.
{{< /warning >}}
## Translating pages
{{< warning >}}
Currently under construction.
{{< /warning >}}

71
content/tutorials/more-features/built-in-features.md Normal file
View file

@ -0,0 +1,71 @@
+++
title = 'Silicate configurations'
show_toc = true
weight = 20
+++
{{< warning >}}
Currently under construction.
Screenshot will be added to show the result of possible configurations.
{{< /warning >}}
Silicate has built-in feature that you can configure from
your `hugo.toml` file.
Most of them are described in the `themes/silicate/hugo.toml` file as
well. You should have a look here to see how they are organised.
All these configurations go into the `params.silicate` table, so
if you don't have one already, you can copy the one from
`themes/silicate/hugo.toml` or add the following to your config:
```
[params]
...
[params.silicate]
# All configuration will go here
```
<!--more-->
## Global features
### Disabling Silicate branding
If you want to remove the "Made with the Silicate Framework!" message
at the bottom of pages, you can simply do so by adding the following configuration:
`show_notice = false`
## Comic pages features
All comic pages configurations go into the `params.silicate.pages` table, like so:
```
[params]
...
[params.silicate]
...
[params.silicate.pages]
# All pages configuration will go here
```
### Navbar location
By default, Silicate will render a navigation bar below and above
the comic's strips.
If you want the nav bar to be only below the comic's strips, you can
add the following configuration:
`nav_above_page = false`
### Chapter navigation
By default, if you [group your pages into chapters]({{% relRef "tutorials/more-features/chapters-and-acts" %}}),
Silicate will add a button to navigate to the previous and next chapter of the current page.
If you want to disable that, you can add the following configuration:
`show_chapter_nav = false`

29
content/tutorials/more-features/chapters-and-acts.md Normal file
View file

@ -0,0 +1,29 @@
+++
title = 'Grouping pages into chapters, acts, etc.'
show_toc = true
weight = 10
+++
{{< warning >}}
Currently under construction.
{{< /warning >}}
<!--more-->
## How to group your pages
{{< warning >}}
Currently under construction.
{{< /warning >}}
## Ordering groups
{{< warning >}}
Currently under construction.
{{< /warning >}}
## Silicate limitations
{{< warning >}}
Currently under construction.
{{< /warning >}}

33
content/tutorials/more-features/custom-css.md Normal file
View file

@ -0,0 +1,33 @@
+++
title = 'Using custom CSS'
show_toc = true
weight = 50
+++
{{< warning >}}
Currently under construction.
{{< /warning >}}
This tutorial assumes you know how CSS and HTML work.
If you do not, you should probably look up a guide for that first.
<!--more-->
## Custom CSS location
{{< warning >}}
Currently under construction.
{{< /warning >}}
## CSS vs SCSS
{{< warning >}}
Currently under construction.
{{< /warning >}}
## How to customise the website
{{< warning >}}
Currently under construction.
{{< /warning >}}

22
content/tutorials/more-features/multiple-comics.md Normal file
View file

@ -0,0 +1,22 @@
+++
title = 'Multiples comics in a single website'
show_toc = true
weight = 40
+++
{{< warning >}}
Currently under redaction.
{{< /warning >}}
<!--more-->
## It's just like creating a normal comic
{{< warning >}}
Currently under redaction.
{{< /warning >}}
## Telling Hugo the type of the pages
{{< warning >}}
Currently under redaction.
{{< /warning >}}

37
content/tutorials/publishing-online.md Normal file
View file

@ -0,0 +1,37 @@
+++
title = 'Publishing your website online'
show_toc = true
weight = 30
+++
{{< warning >}}
Currently under construction.
{{< /warning >}}
<!--more-->
## Choosing a webhost
{{< warning >}}
Currently under construction.
{{< /warning >}}
## Building the website *cleanly*
{{< warning >}}
Currently under construction.
{{< /warning >}}
## Putting your website online
### The easy (and *wrong*) way
{{< warning >}}
Currently under construction.
{{< /warning >}}
### The efficient way
{{< warning >}}
Currently under construction.
{{< /warning >}}

103
content/why_silicate.md Normal file
View file

@ -0,0 +1,103 @@
+++
title = 'Why should I use Silicate?'
slug = 'why-silicate'
weight = 1
+++
Silicate is a [Hugo](https://gohugo.io/) theme dedicated to creating a comic website!
You can work on your website directly on your computer then publish it on any web host you want!
This website also provides a [handy guide]({{% relref "tutorials/" %}}) to get started!
----------
> Can't I already host my webcomic on websites like Webtoon, Tapas, DeviantArt, HiveWorks, etc.?
You could, but they are *for profit* companies, they will not have your best interest
at heart.
What if they bring you into [predatory contracts](https://www.comicsbeat.com/webtoon-originals-contract-draws-criticism-from-creators/)?
Or [fully buy into AI slop](https://news.artnet.com/art-world/deviantart-dreamup-ai-generator-creators-rights-ip-controversy-2210607)?
Or even [pull the plug](https://www.comicsbeat.com/hiveworks-comics-sunsets-publishing-program/) on some features?
Long story short: you will never truly be in control of your website on these platforms.
And you most likely will be seen as resource.
Putting your webcomic online *yourself* provides some security and agency, and for very little cost!
----------
> Is Silicate / Hugo like WordPress?
No, they are very different.
WordPress is a web server : it needs an actual server running non-stop. When a person asks for a page, WordPress creates the page
on the fly. WordPress provides *dynamic* websites.
Hugo, on the other hand, is a program that pre-creates all the pages that your
website will need, once, on your own computer.
You can then put them on your server and they will be given to the user directly. Hugo provides *static* websites.
----------
> Why not use WordPress? Lots of people use WordPress!
WordPress is everywhere, yes. Most web hosting platforms will even pre-install it for you.
But it has its drawbacks.
WordPress alone isn't enough to host a webcomic properly. You'll need a theme and maybe a plugin.
But sometime plugins gets abandoned, like [ComicPress](https://github.com/Frumph/comicpress) which hasn't
been updated in 3 years. Then you need to change themes or plugins, and it's a *mess*.
Also, WordPress is an actual web server - it can have [vulnerabilities](https://en.wikipedia.org/wiki/WordPress#Vulnerabilities) and be hacked.
So you need to keep it up to date.
But updates can break your plugins.
Losing hours fixing up your WordPress because it broke down aren't fun.
And WordPress is its very own [can of worms](https://en.wikipedia.org/wiki/WP_Engine#WordPress_dispute_and_lawsuit).
With Hugo and Silicate, you generate a static website. Since there is no web server, there are far fewer security risks!
And there is no problem keeping the same version of Hugo and this theme forever. Even if Hugo disapears -- but why would it?
It's been around for 10 years -- and this theme is no longer updated, you'll still be able to use them forever.
----------
> Come on, you're just trying to sell me Silicate. Since WordPress is still around it must have advantages!
You are correct! Twice!
Wordpress *does* have some advantages, especially using the Toocheke [theme](#) and [plugin](#), so here's a small comparison :
| | Silicate / Hugo | WordPress |
| ------------------------------ | ------------------------------ | ------------------------------ |
| ------------------------------ | ------------------------------ | ------------------------------ |
| Setup | Medium | **Often pre-installed by web hosts** |
| Can try without web host | **Easy** | Fairly technical |
| Complexity | **Low** | Medium |
| ------------------------------ | ------------------------------ | ------------------------------ |
| Managing content | **Very easy using text files** | Easy if using plugins only |
| GUI to manage content | Your own PC | **Dedicated GUI in web browser** |
| Multilingual support | **Built-in and easy** | Poor - need plugins |
| RSS Feed | **Built-it and automatic** | Automatic using plugins |
| Private pages for Patreons | No | **Using plugins** |
| ------------------------------ | ------------------------------ | ------------------------------ |
| Can customize styling with CSS | Easy | Easy |
| Can configure pages layout | Yes | **Yes, with visual editor** |
| Can fully customize any layout | **Yes, but technical** | No, some parts can't change |
| ------------------------------ | ------------------------------ | ------------------------------ |
| Publication method | Via file transfer (SFTP, etc.) | **Through web GUI** |
| Can publish page at set date | No (requires manual operation) | **Yes** |
| ------------------------------ | ------------------------------ | ------------------------------ |
| Security | **Secure by design** | Often vulnerable |
| Updates can break your site | **Low risk** | High risk |
| Updates are mandatory | **No** | Yes |
| Can preview update effects | **Yes** | No |
| Backups | **Locally and/or web host** | Through web host |
To sum it up:
- Hugo / Silicate is lighter -- but simpler -- than WordPress
- You can **try it on your own computer without a web host**
- It is way more secure and requires less maintenance than Wordpress
- You can customise **everything** if you don't mind getting you hands dirty
- But you **can't have dynamic pages** like patreon-only and password-protected pages

40
hugo.toml Normal file
View file

@ -0,0 +1,40 @@
baseURL = 'https://example.org/'
languageCode = 'en-us'
title = 'Silicate'
enableGitInfo = true
[menus]
[[menus.main]]
name = 'Home'
pageRef = '/'
weight = 10
[[menus.main]]
name = 'Tutorials'
pageRef = '/tutorials'
weight = 20
[[menus.main]]
name = 'Demos'
pageRef = '/demos'
weight = 30
[[menus.main]]
name = 'Downloads'
pageRef = '/downloads'
weight = 40
[[menus.main]]
name = 'Q&A'
pageRef = '/q_and_a'
weight = 45
[[menus.main]]
name = 'About'
pageRef = '/about'
weight = 50
[module]
[module.hugoVersion]
extended = false
min = '0.146.0'

2
layouts/_partials/footer.html Normal file
View file

@ -0,0 +1,2 @@
<p>Last modified: {{ .Lastmod | time.Format "January 2, 2006" }}</p>
<p>Copyright {{ now.Year }}. All rights reserved</p>

5
layouts/_partials/head.html Normal file
View file

@ -0,0 +1,5 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>{{ if .IsHome }}{{ site.Title }}{{ else }}{{ printf "%s | %s" .Title site.Title }}{{ end }}</title>
{{ partialCached "head/css.html" . }}
{{ partialCached "head/js.html" . }}

16
layouts/_partials/head/css.html Normal file
View file

@ -0,0 +1,16 @@
{{- with resources.Get "css/main.scss" }}
{{ $opts := dict
"enableSourceMap" hugo.IsDevelopment
"outputStyle" (cond hugo.IsDevelopment "expanded" "compressed")
"vars" site.Params.styles
}}
{{ with . | toCSS $opts }}
{{- if hugo.IsDevelopment }}
<link rel="stylesheet" href="{{ .RelPermalink }}">
{{- else }}
{{- with . | fingerprint }}
<link rel="stylesheet" href="{{ .RelPermalink }}" integrity="{{ .Data.Integrity }}" crossorigin="anonymous">
{{- end }}
{{- end }}
{{- end }}
{{- end }}

16
layouts/_partials/head/js.html Normal file
View file

@ -0,0 +1,16 @@
{{- with resources.Get "js/main.js" }}
{{- $opts := dict
"minify" (not hugo.IsDevelopment)
"sourceMap" (cond hugo.IsDevelopment "external" "")
"targetPath" "js/main.js"
}}
{{- with . | js.Build $opts }}
{{- if hugo.IsDevelopment }}
<script src="{{ .RelPermalink }}"></script>
{{- else }}
{{- with . | fingerprint }}
<script src="{{ .RelPermalink }}" integrity="{{ .Data.Integrity }}" crossorigin="anonymous"></script>
{{- end }}
{{- end }}
{{- end }}
{{- end }}

6
layouts/_partials/header.html Normal file
View file

@ -0,0 +1,6 @@
{{ $home := .Site.Home -}}
<a href="{{$home.RelPermalink}}" id="banner">
<h1>{{ site.Title }}</h1>
<p id="header-subtitle">A simple webcomic framework</p>
</a>
{{ partial "menu.html" (dict "menuID" "main" "page" .) }}

51
layouts/_partials/menu.html Normal file
View file

@ -0,0 +1,51 @@
{{- /*
Renders a menu for the given menu ID.
@context {page} page The current page.
@context {string} menuID The menu ID.
@example: {{ partial "menu.html" (dict "menuID" "main" "page" .) }}
*/}}
{{- $page := .page }}
{{- $menuID := .menuID }}
{{- with index site.Menus $menuID }}
<nav>
<ul>
{{- partial "inline/menu/walk.html" (dict "page" $page "menuEntries" .) }}
</ul>
</nav>
{{- end }}
{{- define "_partials/inline/menu/walk.html" }}
{{- $page := .page }}
{{- range .menuEntries }}
{{- $attrs := dict "href" .URL }}
{{- if $page.IsMenuCurrent .Menu . }}
{{- $attrs = merge $attrs (dict "class" "active" "aria-current" "page") }}
{{- else if $page.HasMenuCurrent .Menu .}}
{{- $attrs = merge $attrs (dict "class" "ancestor" "aria-current" "true") }}
{{- end }}
{{- $name := .Name }}
{{- with .Identifier }}
{{- with T . }}
{{- $name = . }}
{{- end }}
{{- end }}
<li>
<a
{{- range $k, $v := $attrs }}
{{- with $v }}
{{- printf " %s=%q" $k $v | safeHTMLAttr }}
{{- end }}
{{- end -}}
>{{ $name }}</a>
{{- with .Children }}
<ul>
{{- partial "inline/menu/walk.html" (dict "page" $page "menuEntries" .) }}
</ul>
{{- end }}
</li>
{{- end }}
{{- end }}

13
layouts/_partials/pagesTOC.html Normal file
View file

@ -0,0 +1,13 @@
{{- $page := .page }}
{{- $header_level := .header_level }}
{{- if gt $page.Pages.Len 0 }}
<ol>
{{ range $page.Pages }}
<li>
<h{{ $header_level }}><a href='{{ .RelPermalink }}'>{{ .Title }}</a></h{{ $header_level }}>
{{- $header_level := add $header_level 1 }}
{{ partial "pagesTOC.html" (dict "page" . "header_level" $header_level) }}
</li>
{{ end }}
</ol>
{{ end -}}

23
layouts/_partials/terms.html Normal file
View file

@ -0,0 +1,23 @@
{{- /*
For a given taxonomy, renders a list of terms assigned to the page.
@context {page} page The current page.
@context {string} taxonomy The taxonomy.
@example: {{ partial "terms.html" (dict "taxonomy" "tags" "page" .) }}
*/}}
{{- $page := .page }}
{{- $taxonomy := .taxonomy }}
{{- with $page.GetTerms $taxonomy }}
{{- $label := (index . 0).Parent.LinkTitle }}
<div>
<div>{{ $label }}:</div>
<ul>
{{- range . }}
<li><a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a></li>
{{- end }}
</ul>
</div>
{{- end }}

3
layouts/_shortcodes/warning.html Normal file
View file

@ -0,0 +1,3 @@
<div class="warning">
{{ .InnerDeindent | .Page.RenderString }}
</div>

17
layouts/baseof.html Normal file
View file

@ -0,0 +1,17 @@
<!DOCTYPE html>
<html lang="{{ site.Language.LanguageCode }}" dir="{{ or site.Language.LanguageDirection `ltr` }}">
<head>
{{ partial "head.html" . }}
</head>
<body>
<header>
{{ partial "header.html" . }}
</header>
<main>
{{ block "main" . }}{{ end }}
</main>
<footer>
{{ partial "footer.html" . }}
</footer>
</body>
</html>

5
layouts/home.html Normal file
View file

@ -0,0 +1,5 @@
{{ define "main" }}
{{ .Content }}
<hr>
{{ partial "pagesTOC.html" (dict "page" . "header_level" 2) }}
{{ end }}

33
layouts/page.html Normal file
View file

@ -0,0 +1,33 @@
{{ define "main" }}
{{- $next_page := .CurrentSection.Pages.Prev . }}
{{- $current := . }}
{{- range .Ancestors }}
{{ with .Pages.Prev $current }}
{{ $next_page = . }}
{{ break }}
{{ end }}
{{ $current = . }}
{{- end }}
{{- $prev_page := .CurrentSection.Pages.Next . }}
{{- $prev_section := .Parent }}
<h1>{{ .Title }}</h1>
<p class="subtitle">Reading time: about {{ .ReadingTime }} min</p>
<hr>
<nav class="page-nav">
{{ with or $prev_page $prev_section }}<a class="prev" title="Previous page" href="{{.RelPermalink}}">&lt; {{ .Title }}</a>{{ end }}
{{ with $next_page }}<a class="next" title="Next page" href="{{.RelPermalink}}">{{ .Title }} &gt;</a>{{ end }}
</nav>
<hr>
{{ .Summary }}
{{- if .Params.show_toc -}}
<hr>
{{ .TableOfContents }}
<hr>
{{- end }}
{{ .ContentWithoutSummary }}
<hr>
<nav class="page-nav">
{{ with or $prev_page $prev_section }}<a class="prev" title="Previous page" href="{{.RelPermalink}}">&lt; {{ .Title }}</a>{{ end }}
{{ with $next_page }}<a class="next" title="Next page" href="{{.RelPermalink}}">{{ .Title }} &gt;</a>{{ end }}
</nav>
{{ end }}

50
layouts/section.html Normal file
View file

@ -0,0 +1,50 @@
{{ define "main" }}
{{- $prev_page := false }}
{{- /* Try to get the previous sibling */}}
{{- with .Parent.Pages.Next . }}
{{- /* Check if it's a section, if yes, get it's last page */}}
{{- if (and .IsSection (gt .Pages.Len 0 )) }}
{{- $prev_page = index .Pages.Reverse 0 }}
{{ else }}
{{- $prev_page = . }}
{{ end }}
{{ else }}
{{- /* No previous sibling, use the parent itself */}}
{{- $prev_page = .Parent }}
{{ end }}
{{- $next_page := false }}
{{- if gt .Pages.Len 0 }}
{{- $next_page = index .Pages 0 }}
{{- else }}
{{- with .Parent.Pages.Prev . }}
{{- $next_page = . }}
{{ end }}
{{- end }}
{{- $reading_time := 0}}
{{- range .RegularPagesRecursive }}
{{- $reading_time = add $reading_time .ReadingTime}}
{{- end}}
<h1>{{ .Title }}</h1>
<p class="subtitle">Total reading time: about {{ $reading_time }} min</p>
<hr>
<nav class="page-nav">
{{ with $prev_page }}<a class="prev" title="Previous page" href="{{.RelPermalink}}">&lt; {{ .Title }}</a>{{ end }}
{{ with $next_page }}<a class="next" title="Next page" href="{{.RelPermalink}}">{{ .Title }} &gt;</a>{{ end }}
</nav>
<hr>
{{ .Content }}
<hr>
{{ partial "pagesTOC.html" (dict "page" . "header_level" 2) }}
<hr>
<nav class="page-nav">
{{ with $prev_page }}<a class="prev" title="Previous page" href="{{.RelPermalink}}">&lt; {{ .Title }}</a>{{ end }}
{{ with $next_page }}<a class="next" title="Next page" href="{{.RelPermalink}}">{{ .Title }} &gt;</a>{{ end }}
</nav>
{{ end }}

7
layouts/taxonomy.html Normal file
View file

@ -0,0 +1,7 @@
{{ define "main" }}
<h1>{{ .Title }}</h1>
{{ .Content }}
{{ range .Pages }}
<h2><a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a></h2>
{{ end }}
{{ end }}

7
layouts/term.html Normal file
View file

@ -0,0 +1,7 @@
{{ define "main" }}
<h1>{{ .Title }}</h1>
{{ .Content }}
{{ range .Pages }}
<h2><a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a></h2>
{{ end }}
{{ end }}

BIN
static/favicon.ico Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 15 KiB

BIN
static/silicate_bg.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 52 KiB