hugo-codeberg-pages-template/content/ersteseite.md

62 lines
3.7 KiB
Markdown
Raw Normal View History

2024-04-26 12:07:55 +00:00
---
title: Deployment von Hugo auf Codeberg Pages via Woodpecker CI
2024-04-26 16:32:20 +00:00
author: Jörg Lohrer
2024-04-26 12:07:55 +00:00
description: Mit Codeberg-Pages eine eigene Webseite hosten
2024-04-26 16:32:20 +00:00
image: https://i.imgur.com/8CCHQZf.png
tags: Hugo, Codeberg, Woodpecker, CI
lang: de
dir: ltr
licence: CC-BY
2024-04-26 12:09:09 +00:00
2024-04-26 12:07:55 +00:00
---
# Deployment von Hugo auf Codeberg Pages via Woodpecker CI
2024-04-26 16:32:20 +00:00
## Anleitung zur Erstellung einer Hugo-Website auf Codeberg Pages
Diese Anleitung zeigt Dir Schritt für Schritt, wie Du eine Hugo-Website auf Codeberg Pages erstellen kannst.
2024-04-26 12:07:55 +00:00
2024-04-26 16:32:20 +00:00
### Voraussetzungen:
- Du brauchst ein [Codeberg](https://codeberg.org/)-Konto.
- Du solltest bereit sein zu teilen
- Du brauchst [Zugang zur WoodpeckerCI](https://codeberg.org/Codeberg-e.V./requests) bei Codeberg.
2024-04-26 12:07:55 +00:00
2024-04-26 16:32:20 +00:00
### Schritte
2024-04-26 12:07:55 +00:00
2024-04-26 16:32:20 +00:00
#### 1. ![](https://raw.githubusercontent.com/primer/octicons/main/icons/repo-forked-24.svg) ***Forke das Template Repository***
* Klicke auf den Fork-Button auf der Template-Seite:
https://joerglohrer.codeberg.page/hugo-codeberg-pages-template
Dadurch wird eine Kopie des Repositorys in deinem eigenen Codeberg-Konto erstellt.
2024-04-26 12:07:55 +00:00
2024-04-26 16:32:20 +00:00
#### 2. ***Ändere die `hugo.toml`-Datei***
Öffne die `hugo.toml`-Datei i![](https://raw.githubusercontent.com/primer/octicons/main/icons/git-branch-24.svg) ***main***-Branch deines Repositorys.
Ändere die erste Zeile in folgendem Format:
`baseURL = 'https://UserName.codeberg.page/RepoName`
Ersetze `UserName` durch Deinen Codeberg-Benutzernamen und `RepoName` durch den gewünschten Namen deiner Website gleichlautend mit dem Namen des Repository.
2024-04-26 12:07:55 +00:00
2024-04-26 16:32:20 +00:00
#### 3. Generiere einen Zugriffstoken:
Melden Dich bei Deinem Codeberg-Konto an und navigiere zu Einstellungen > Anwendungen: https://codeberg.org/user/settings/applications.
Klicke auf die Schaltfläche "Neue Anwendung erstellen".
Geb Deiner Anwendung einen Namen, z. B. "Hugo-Website". Aktiviere die Option "Lesen und Schreiben" unter "repository". Klicke auf die Schaltfläche "Token generieren". Kopiere den generierten Zugriffstoken.
2024-04-26 12:07:55 +00:00
2024-04-26 16:32:20 +00:00
#### 4. Füge das Repository zu einer neuen Pipeline hinzu
2024-04-26 12:07:55 +00:00
2024-04-26 16:32:20 +00:00
Melde Dich bei CI/CD: https://ci.codeberg.org/ an. Klicke auf die Schaltfläche "+ Repository hinzufügen". Wähle dein Repository aus der Liste aus und klicke auf "Aktivieren".
Wähle die Einstellungen zur gerade erstellten Pipeline aus. Klicke auf "Allgemein" und gib bei Pipeline-Pfad `.woodpecker.yml`ein. Speiche die Einstellung füge zwei Geheimnisse hinzu:
- Name: `codeberg_token` - Wert: der in Schritt 3. generierte erstellten Zugriffstoken
- Name: `mail` - Wert: Deine Mailadresse
#### 5. Erstelle Markdown-Dateien
Navigiere im Repository zu Verzeichnis `/content`. Erstelle hier beliebige Markdown-Dateien (`*.md`). Diese Dateien werden beim Pushen in das Repository automatisch durch zu einer statischen Webseite im ![](https://raw.githubusercontent.com/primer/octicons/main/icons/git-branch-24.svg) ***pages***-Branch verarbeitet
2024-04-26 12:07:55 +00:00
2024-04-26 16:32:20 +00:00
#### Fertig!
Deine aktualisierte Seite ist unter: `https://UserName.codeberg.page/RepoName` erreichbar. Sie wird automatisch aktualisiert, wenn Du Änderungen an den (Markdown-)Dateien im ![](https://raw.githubusercontent.com/primer/octicons/main/icons/git-branch-24.svg) ***main***-Branch vornimmst.
2024-04-26 12:07:55 +00:00
2024-04-26 16:32:20 +00:00
#### Noch ein paar Hinweise
- Hugo-Dokumentation https://gohugo.io/documentation/
- Codeberg Pages-Dokumentation https://docs.codeberg.org/codeberg-pages/
- Codeberg's CI Dokumentation https://docs.codeberg.org/ci/
- Woodpecker Beispiele (auch die verwendete `.woodpecker.yaml` für Hugo): https://codeberg.org/Codeberg-CI/examples)
2024-04-26 12:07:55 +00:00
2024-04-26 16:32:20 +00:00
#### Tipps:
- ***Design:*** Passe die Vorlagendateien im Verzeichnis themes an, um deiner Website einen individuellen Look zu geben.
- ***Features:*** Nutze Hugo-Module, um deine Website zu erweitern.
- ***Eigene Domain:*** Verknüpfe deine Website mit einem eigenen Domainnamen.