Comenius-Institut/FOERBICO

Fork 0

Blog mit Static Site Generator (SSG) Hugo erstellen #114

New issue

Open

opened 2024-10-29 08:09:46 +00:00 by sicking · 6 comments

sicking commented

2024-10-29 08:09:46 +00:00

Owner

Die hier im Repository liegenden Markdown Dateien im Ordner "Blog" sollen mit der SSG Software Hugo in einen Blog überführt werden.

Die hier im Repository liegenden Markdown Dateien [im Ordner "Blog"](https://git.rpi-virtuell.de/Comenius-Institut/FOERBICO/src/branch/main/Blog) sollen mit der SSG Software [Hugo](https://gohugo.io/) in einen Blog überführt werden.

👍 1

sicking added this to the Projekt-Technik project 2024-10-29 08:09:46 +00:00

sicking commented

2024-10-29 08:14:49 +00:00

Author

Owner

To-Do Testversion

bisherige Beiträge übertragen
- Frontmatter in YAML
- Beitragsbild
- Description
- gleicher Permalink
Beitragsübersicht und Einzelbeiträge
Tags (erstmal "nur" das, was das Theme unterstützt)

zu übertragende Seiten

hello world
SDG logos
OER erklärt
pirner youtube
AKRK
Git Treffen Medienhaus

Probleme

nicht einheitliche Links auf Bilder etc.

zu klären

welche Metadaten sind MUSS für Beiträge
Workflow
welches Theme? 2 - 3 als Beispiele
Theme Eigenheiten
Design
Indizieren OERSI... / über gitlab?

### To-Do Testversion - bisherige Beiträge übertragen - Frontmatter in YAML - Beitragsbild - Description - **gleicher Permalink** - Beitragsübersicht und Einzelbeiträge - Tags (erstmal "nur" das, was das Theme unterstützt) #### zu übertragende Seiten - [ ] hello world - [ ] SDG logos - [ ] OER erklärt - [ ] pirner youtube - [ ] AKRK - [ ] Git Treffen Medienhaus #### Probleme - [nicht einheitliche Links auf Bilder etc.](https://git.rpi-virtuell.de/Comenius-Institut/FOERBICO/pulls/79/files#issuecomment-1754) ### zu klären - welche Metadaten sind MUSS für Beiträge - Workflow - welches Theme? 2 - 3 als Beispiele - Theme Eigenheiten - Design - Indizieren OERSI... / über gitlab?

sicking self-assigned this 2024-10-29 08:19:04 +00:00

joerglohrer added this to the AP 9 Weiterentwicklung techn. Infrastruktur (CI) milestone 2024-10-29 08:20:20 +00:00

joerglohrer commented

2024-10-29 17:00:24 +00:00

Owner

Ich hab's heute vergeblich versucht mit https://oer.community/sb/blog - außer einer index.html ohne Design ist da nicht viel zugänglich. Evtl. schaust du mal auf dem Server ob da überhaupt andere html-dateien liegen oder zugänglich sind?
Falls es gelingt, dass tatsächlich seiten aus dem content Ordner generiert werden, könnte ich mit den Metadaten weiterdenken.
Es gibt ja viele Optionen, was die Bilder angeht über figcaption, yaml, exif-Editoren etc.
Im Moment würde ich einschätzen, dass wir evtl. am einfachsten fahren, wenn wir zu Bildnamen gleichlautende JSON anzulegen, die hugo dann suchen soll für eine caption und um die metadaten schema-konform auszugeben. Was meinst du?

Ich hab's heute vergeblich versucht mit https://oer.community/sb/blog - außer einer index.html ohne Design ist da nicht viel zugänglich. Evtl. schaust du mal auf dem Server ob da überhaupt andere html-dateien liegen oder zugänglich sind? Falls es gelingt, dass tatsächlich seiten aus dem content Ordner generiert werden, könnte ich mit den Metadaten weiterdenken. Es gibt ja viele Optionen, was die Bilder angeht über figcaption, yaml, exif-Editoren etc. Im Moment würde ich einschätzen, dass wir evtl. am einfachsten fahren, wenn wir zu Bildnamen gleichlautende JSON anzulegen, die hugo dann suchen soll für eine caption und um die metadaten schema-konform auszugeben. Was meinst du?

joerglohrer commented

2024-10-30 05:46:09 +00:00

Owner

ok - got it. Scheint so, dass der "secret" path einfach /blog ist. Im yaml entsprechend angegeben klappt es nun mit ein paar Blogbeiträgen:
https://oer.community/sb/blog (erstellt mit dem Branch hugobugo

ok - got it. Scheint so, dass der "secret" path einfach /blog ist. Im yaml entsprechend angegeben klappt es nun mit ein paar Blogbeiträgen: https://oer.community/sb/blog (erstellt mit dem Branch [hugobugo](https://git.rpi-virtuell.de/Comenius-Institut/FOERBICO/src/branch/hugobugo)

sicking commented

2024-11-04 10:26:06 +00:00

Author

Owner

Hinweise von Jörg

Gehversuche bei codeberg als Beispiel für Verarbeitung von "tags" im Frontmatter:
- https://comenius-institut.codeberg.page/foerbico-blog/2024-10-07-diskurslab/
- https://codeberg.org/Comenius-Institut/foerbico-blog/src/branch/main/content/2024-10-07-DisKursLab.md
in "hugobugo": Beispiel von Artikeln unterhalb von "posts": 39b9fd378b
Vorschaubilder über Frontmatter; Tag "image"
- Abschnitt "Post Cover Image" auf https://github.com/adityatelange/hugo-PaperMod/wiki/Features#theme-switch-toggle-enabled-by-default

Vorläufiger Stand: https://oer.community/sb/blog/posts/

#### Hinweise von Jörg - Gehversuche bei codeberg als Beispiel für Verarbeitung von "tags" im Frontmatter: - https://comenius-institut.codeberg.page/foerbico-blog/2024-10-07-diskurslab/ - https://codeberg.org/Comenius-Institut/foerbico-blog/src/branch/main/content/2024-10-07-DisKursLab.md - in "hugobugo": Beispiel von Artikeln _unterhalb von "posts"_: https://git.rpi-virtuell.de/Comenius-Institut/FOERBICO/commit/39b9fd378b6f0002afe6e3ae02e0792ac3ae833d - Vorschaubilder über Frontmatter; Tag "image" - Abschnitt "Post Cover Image" auf https://github.com/adityatelange/hugo-PaperMod/wiki/Features#theme-switch-toggle-enabled-by-default Vorläufiger Stand: https://oer.community/sb/blog/posts/

joerglohrer commented

2024-11-05 16:18:00 +00:00

Owner

In Firefox (oben) und Chrome (unten) werden die Fonts unterschiedlich dargestellt.
grafik

In Firefox (oben) und Chrome (unten) werden die Fonts unterschiedlich dargestellt. <img width="1169" alt="grafik" src="/attachments/592cb5a7-b676-4268-a6a1-0aae101b2e1c">

grafik.png

432 KiB

👍 1

sicking commented

2024-11-13 10:42:28 +00:00

Author

Owner

Ich werde nun folgenden Prototypen erstellen:

Alle für Hugo releavanten Dateien liegen im Unterordner "sb" (hugo new site sb)
Theme "PaperMod" (bringt etwas Unterstützung für schema.org / JSON-LD mit)
Die Markdown-Dateien der Blog-Beiträge werden umgewandelt in eine "index.md"
Diese liegt in einem Unterordner, der so heißt wie die ursprüngliche Markdown-Datei. (ohne Endung ".md")
Dieser Unterordner liegt in dem "Standard" posts Verzeichnis von Hugo: sb/content/posts
- Beispiel:
  "2024-09-06-OERcamp-Hamburg.md aus dem Ordner Blog wird zu index.md im Ordner 2024-09-06-OERcamp-Hamburg, der in sb/content/posts/ liegt, also:
  Blog/2024-09-06-OERcamp-Hamburg.md => sb/content/posts/2024-09-06-OERcamp-Hamburg/index.md
Der Permalink des Blogbeitrags wird durch den Paramater url im Front Matter` erhalten
Die zum Blog-Beitrag gehörenden Assets werden in diesen Ordner verschoben (im Beispiel: 2024-09-06-OERcamp-Hamburg)
- alle Asset-Verweise in der Markdwon-Datei werden angepasst.
  Beispiel: https://oer.community/wp-content/uploads/2024/09/OERcamp_Hamburg_2024.jpg => OERcamp_Hamburg_2024.jpg
weitere Anpassungen
- Benamungen (Dateien, Ordner)
- Orte (wo liegt was bzw. liegen sollte)
- Styles (möglichst ähnliche "Corporate Identity)
- ...

Ich werde nun folgenden Prototypen erstellen: - Alle für Hugo releavanten Dateien liegen im Unterordner "sb" (`hugo new site sb`) - Theme "[PaperMod](https://themes.gohugo.io/themes/hugo-papermod/)" (bringt etwas Unterstützung für schema.org / JSON-LD mit) - Die Markdown-Dateien der Blog-Beiträge werden umgewandelt in eine "index.md" Diese liegt in einem Unterordner, der so heißt wie die ursprüngliche Markdown-Datei. (ohne Endung ".md") Dieser Unterordner liegt in dem "Standard" `posts` Verzeichnis von Hugo: `sb/content/posts` - Beispiel: "`2024-09-06-OERcamp-Hamburg.md` aus dem Ordner `Blog` wird zu `index.md` im Ordner `2024-09-06-OERcamp-Hamburg`, der in `sb/content/posts/` liegt, also: `Blog/2024-09-06-OERcamp-Hamburg.md` => `sb/content/posts/2024-09-06-OERcamp-Hamburg/index.md` - Der Permalink des Blogbeitrags wird durch den Paramater `url` im Front Matter` erhalten - Die zum Blog-Beitrag gehörenden Assets werden in diesen Ordner verschoben (im Beispiel: `2024-09-06-OERcamp-Hamburg`) - alle Asset-Verweise in der Markdwon-Datei werden angepasst. Beispiel: `https://oer.community/wp-content/uploads/2024/09/OERcamp_Hamburg_2024.jpg` => `OERcamp_Hamburg_2024.jpg` - weitere Anpassungen - Benamungen (Dateien, Ordner) - Orte (wo liegt was bzw. liegen sollte) - Styles (möglichst ähnliche "Corporate Identity) - ...

👍 1