|
|
|
@ -35,7 +35,7 @@ Now, we need to tell Silicate the title of the comic and give it a description.
|
|
|
|
|
|
|
|
|
|
It will be used in the archive.
|
|
|
|
|
|
|
|
|
|
Let's create a `_index.md` (notice the leading `_`) file inside `my_website/content/` with the following content:
|
|
|
|
|
Let's create an `_index.md` (notice the leading `_`) file inside `my_website/content/` with the following content:
|
|
|
|
|
|
|
|
|
|
```
|
|
|
|
|
+++
|
|
|
|
@ -54,7 +54,7 @@ so you can have some simple styling, like *\*italic text\**, **\*\*bold text\*\*
|
|
|
|
|
Full description of Markdown possibilities will be added later.
|
|
|
|
|
{{< /warning >}}
|
|
|
|
|
|
|
|
|
|
This `_index.md` file tells Hugo that this folder is a *section*, that is a group of pages.
|
|
|
|
|
This `_index.md` file tells Hugo that this folder is a *section*, that is, a group of pages.
|
|
|
|
|
|
|
|
|
|
Now, you should have this:
|
|
|
|
|
|
|
|
|
@ -73,8 +73,8 @@ it is used to add attributes to a page or a section, such as its title.
|
|
|
|
|
|
|
|
|
|
> The terminal just told me `ERROR Section '/comic' contains no pages!`!
|
|
|
|
|
|
|
|
|
|
That's normal: Silicate tries to check there is no problem when building your website
|
|
|
|
|
and refuse to do so when there is an obious problem.
|
|
|
|
|
That's normal: Silicate tries to check if there are problems when building your website
|
|
|
|
|
and refuses to do so when there is an obious problem.
|
|
|
|
|
|
|
|
|
|
To fix it, let's add the first page from Pepper & Carrot!
|
|
|
|
|
|
|
|
|
@ -87,7 +87,7 @@ because this folder name will be used as a URL for this page).
|
|
|
|
|
Then create a text file named `index.md`, without a leading `_` this time.
|
|
|
|
|
|
|
|
|
|
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.
|
|
|
|
|
`index.md.txt`; Windows likes to hide file extensions from you, and you may need to force windows to display them.
|
|
|
|
|
|
|
|
|
|
This `index.md` file tells Hugo that the `E01P01` folder is a page -- not a section -- and that all other
|
|
|
|
|
files inside this folder belong to this page. This is what Hugo calls a "Page Bundle".
|
|
|
|
@ -144,19 +144,19 @@ And now, if we look at the website, we see this!:
|
|
|
|
|
|
|
|
|
|

|
|
|
|
|
|
|
|
|
|
That's a start, but that's... not great, because there is no pictures yet.
|
|
|
|
|
That's a start, but that's... not great, because there are no pictures yet.
|
|
|
|
|
|
|
|
|
|
The terminal also warned us about that:
|
|
|
|
|
|
|
|
|
|
`WARN The comic page '/comic/e01p01' has no image matching the strips/**.{png,jpg,webp,PNG,JPG,WEBP} pattern!`
|
|
|
|
|
|
|
|
|
|
That warning is a bit of a mouthful, what it means is: "Silicate want pictures inside
|
|
|
|
|
a 'strips/' folder"
|
|
|
|
|
|
|
|
|
|
### Comic pictures
|
|
|
|
|
|
|
|
|
|
To fix this, all we need are pictures for the comic page.
|
|
|
|
|
|
|
|
|
|
That warning is a bit of a mouthful, what it means is: "Silicate want pictures inside
|
|
|
|
|
a 'strips/' folder"
|
|
|
|
|
|
|
|
|
|
So let's create a `strips/` folder inside `E01P01/`
|
|
|
|
|
|
|
|
|
|
Get the `pages/E01P01.jpg` file from the resources you downloaded -- or your
|
|
|
|
@ -261,8 +261,8 @@ Now, the page should be displayed with a creation date under its title!:
|
|
|
|
|
|
|
|
|
|
### Transcript
|
|
|
|
|
|
|
|
|
|
Some webcomics provides transcripts of their pages. Adding one to yours is
|
|
|
|
|
very simple: add a `transcript.md` text file next to your `index.md` and
|
|
|
|
|
Some webcomics provides transcripts of their pages. Adding a transcript to a comic page
|
|
|
|
|
in Silicate is very simple: add a `transcript.md` text file next to your `index.md` and
|
|
|
|
|
Silicate will automatically add a "Transcript" button to display or
|
|
|
|
|
hide the content of `transcript.md` under your page.
|
|
|
|
|
|
|
|
|
@ -273,7 +273,7 @@ For the first page, let's write a small transcript:
|
|
|
|
|
|
|
|
|
|
```
|
|
|
|
|
Pepper the witch prepares a potion in a cauldron
|
|
|
|
|
while her cat Carrot lasily looks at her.
|
|
|
|
|
while her cat Carrot lazily looks at her.
|
|
|
|
|
|
|
|
|
|
She sprinkles some powder in the cauldron.
|
|
|
|
|
|
|
|
|
@ -318,10 +318,10 @@ It will show the comic title and its description.
|
|
|
|
|
|
|
|
|
|
## Recap
|
|
|
|
|
|
|
|
|
|
Now you have most of what you need to have a simple webcomic!
|
|
|
|
|
Now you have most of what you need for a simple webcomic!
|
|
|
|
|
|
|
|
|
|
You can just keep adding new pages! The resource archive you downloaded
|
|
|
|
|
have what you need to add the first three pages of Pepper & Carrot.
|
|
|
|
|
has what you need to add the first three pages of Pepper & Carrot.
|
|
|
|
|
|
|
|
|
|
Here's what to remember:
|
|
|
|
|
|
|
|
|
@ -329,6 +329,6 @@ Here's what to remember:
|
|
|
|
|
* Comic pages go inside `content/comic/`.
|
|
|
|
|
* Comic pages are folders with an `index.md` file.
|
|
|
|
|
* Comic page pictures go into a `strips/` sub-folder.
|
|
|
|
|
* Comic page transcript go into a `transcript.md` file next to `index.md`.
|
|
|
|
|
* Comic page transcripts go into a `transcript.md` file next to `index.md`.
|
|
|
|
|
* `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.
|
|
|
|
|