commit
762fe671d0
19 changed files with 231 additions and 0 deletions
@ -0,0 +1,3 @@ |
|||
[submodule "themes/learn"] |
|||
path = themes/learn |
|||
url = https://github.com/matcornic/hugo-theme-learn.git |
|||
@ -0,0 +1,6 @@ |
|||
--- |
|||
title: "{{ replace .Name "-" " " | title }}" |
|||
date: {{ .Date }} |
|||
draft: true |
|||
--- |
|||
|
|||
@ -0,0 +1,12 @@ |
|||
baseURL = "/" |
|||
languageCode = "en-us" |
|||
theme = "learn" |
|||
|
|||
[outputs] |
|||
home = [ "HTML", "RSS", "JSON"] |
|||
|
|||
[params] |
|||
showVisitedLinks = true |
|||
disableBreadcrumb = false |
|||
disableNextPrev = false |
|||
themeVariant = "red" |
|||
@ -0,0 +1,10 @@ |
|||
--- |
|||
title: "Hugo Workshop" |
|||
--- |
|||
|
|||
# Welcome to my Hugo workshop |
|||
|
|||
Welcome! Please have a seat and relax. |
|||
|
|||
In the rest of this training, we will craft a mini-training |
|||
about Hugo! |
|||
@ -0,0 +1,12 @@ |
|||
+++ |
|||
title = "Create Content" |
|||
weight = 2 |
|||
chapter = true |
|||
pre = "<b>2. </b>" |
|||
+++ |
|||
|
|||
### Chapter 2 |
|||
|
|||
# Create Content |
|||
|
|||
In this section, we will create some content for our mini-training. |
|||
@ -0,0 +1,13 @@ |
|||
--- |
|||
title: "Chapter" |
|||
weight: 1 |
|||
--- |
|||
|
|||
Use the [built-in learn archetypes](https://learn.netlify.com/en/cont/archetypes/) |
|||
to generate your chapters: |
|||
|
|||
```sh |
|||
hugo new pre-requisites/_index.md --kind chapter |
|||
hugo new create-content/_index.md --kind chapter |
|||
hugo new packaging/_index.md --kind chapter |
|||
``` |
|||
@ -0,0 +1,26 @@ |
|||
--- |
|||
title: "Section" |
|||
weight: 2 |
|||
--- |
|||
|
|||
Use the [built-in Hugo archetypes](https://gohugo.io/content-management/archetypes/) |
|||
to generate your sections: |
|||
|
|||
```sh |
|||
# Welcome page |
|||
hugo new _index.md |
|||
|
|||
# Sections in our "pre-requisites" chapter |
|||
hugo new pre-requisites/install.md |
|||
hugo new pre-requisites/bootstrap.md |
|||
hugo new pre-requisites/theme.md |
|||
|
|||
# Sections in our "create-content" chapter |
|||
hugo new create-content/chapter.md |
|||
hugo new create-content/section.md |
|||
|
|||
# Sections in our "packaging" chapter |
|||
hugo new packaging/look-and-feel.md |
|||
hugo new packaging/test-locally.md |
|||
hugo new packaging/git-commit.md |
|||
``` |
|||
@ -0,0 +1,12 @@ |
|||
+++ |
|||
title = "Packaging" |
|||
weight = 3 |
|||
chapter = true |
|||
pre = "<b>3. </b>" |
|||
+++ |
|||
|
|||
### Chapter 3 |
|||
|
|||
# Packaging |
|||
|
|||
In this chapter we will package our mini-training for publication. |
|||
@ -0,0 +1,21 @@ |
|||
--- |
|||
title: "Git Commit" |
|||
weight: 3 |
|||
--- |
|||
|
|||
By committing your work in a GIT repository, you will be able to collaborate |
|||
with your peers for reviews and contributions. |
|||
|
|||
Commit your work: |
|||
|
|||
```sh |
|||
git add . |
|||
git commit -m 'initial version' |
|||
``` |
|||
|
|||
And push it on your GitHub account: |
|||
|
|||
```sh |
|||
git remote add origin git@github.com:nmasse-itix/hugo-workshop.git |
|||
git push -u origin master |
|||
``` |
|||
@ -0,0 +1,36 @@ |
|||
--- |
|||
title: "Look and Feel" |
|||
weight: 1 |
|||
--- |
|||
|
|||
Edit the `config.toml` to match the following content: |
|||
|
|||
```toml |
|||
baseURL = "/" |
|||
languageCode = "en-us" |
|||
theme = "learn" |
|||
|
|||
[outputs] |
|||
home = [ "HTML", "RSS", "JSON"] |
|||
|
|||
[params] |
|||
showVisitedLinks = true |
|||
disableBreadcrumb = false |
|||
disableNextPrev = false |
|||
themeVariant = "red" |
|||
``` |
|||
|
|||
This will enable cool features such as the search engine, the navigation, the |
|||
breadcrumb and the checkmarks next in the table of content for visited links. |
|||
|
|||
And, the left sidebar is now red! |
|||
|
|||
Customize the logo and favicon with cool branding: |
|||
|
|||
```sh |
|||
mkdir -p static/images/ |
|||
curl https://upload.wikimedia.org/wikipedia/fr/c/cb/Red_hat_logo.png -o static/images/logo.png |
|||
mkdir -p layouts/partials |
|||
echo '<img src="/images/logo.png" />' > layouts/partials/logo.html |
|||
curl "http://www.myiconfinder.com/icon/download/16895e53b6d340dffee1c9b84d90ca94-Redhat.png~10057" -o static/images/favicon.png |
|||
``` |
|||
@ -0,0 +1,13 @@ |
|||
--- |
|||
title: "Test Locally" |
|||
weight: 2 |
|||
--- |
|||
|
|||
You can test locally your new website by running: |
|||
|
|||
```sh |
|||
hugo server -D |
|||
``` |
|||
|
|||
In your web browser you can now open [localhost:1313](http://localhost:1313) |
|||
and admire your work! |
|||
@ -0,0 +1,12 @@ |
|||
+++ |
|||
title = "Pre-requisites" |
|||
weight = 1 |
|||
chapter = true |
|||
pre = "<b>1. </b>" |
|||
+++ |
|||
|
|||
### Chapter 1 |
|||
|
|||
# Pre-requisites |
|||
|
|||
Complete the pre-requisites before creating any content. |
|||
@ -0,0 +1,22 @@ |
|||
--- |
|||
title: "Bootstrap" |
|||
weight: 2 |
|||
--- |
|||
|
|||
Bootstrap a Hugo site to hold the documentation of our mini-training. |
|||
|
|||
```raw |
|||
$ hugo new site hugo-workshop |
|||
Congratulations! Your new Hugo site is created in /Users/nicolas/git/hugo-workshop. |
|||
|
|||
Just a few more steps and you're ready to go: |
|||
|
|||
1. Download a theme into the same-named folder. |
|||
Choose a theme from https://themes.gohugo.io/, or |
|||
create your own with the "hugo new theme <THEMENAME>" command. |
|||
2. Perhaps you want to add some content. You can add single files |
|||
with "hugo new <SECTIONNAME>/<FILENAME>.<FORMAT>". |
|||
3. Start the built-in live server via "hugo server". |
|||
|
|||
Visit https://gohugo.io/ for quickstart guide and full documentation. |
|||
``` |
|||
@ -0,0 +1,13 @@ |
|||
--- |
|||
title: "Install" |
|||
weight: 1 |
|||
--- |
|||
|
|||
As a prerequisite, we need to install Hugo. On MacOS, you can use brew: |
|||
|
|||
```sh |
|||
brew install hugo |
|||
``` |
|||
|
|||
If you are on another Operating System, check the |
|||
[Hugo Documentation](https://gohugo.io/getting-started/quick-start/). |
|||
@ -0,0 +1,18 @@ |
|||
--- |
|||
title: "Theme" |
|||
weight: 3 |
|||
--- |
|||
|
|||
The [learn theme](https://learn.netlify.com/en/) for Hugo is one of the most |
|||
suited design for training instructions. It features breadcrumb, navigation |
|||
buttons, table of content in the sidebar, checkmark to know which sections |
|||
the participant visited and much more! |
|||
|
|||
Install the learn theme: |
|||
|
|||
```sh |
|||
cd hugo-workshop |
|||
git init |
|||
git submodule add https://github.com/matcornic/hugo-theme-learn.git themes/learn |
|||
echo 'theme = "learn"' >> config.toml |
|||
``` |
|||
@ -0,0 +1 @@ |
|||
<img src="/logo.png" /> |
|||
|
After Width: | Height: | Size: 30 KiB |
|
After Width: | Height: | Size: 76 KiB |
Loading…
Reference in new issue