¶ Skriva blogginlägg med Gitlab Pages och Hugo
I guiden om att Starta blogg med Gitlab Pages så beskrev vi hur man startar en blogg med hjälp av Gitlab Pages och "Static Site Generatorn" (SSG) Hugo.
Den här guiden visar hur man gör för att skapa ett blogginlägg.
¶ Skriva blogginlägg med Markdown
Hugo är som sagt en "Static Site Generator" (SSG) vilket fungerar lite annorlunda än t.ex. Wordpress. Enkelt uttryckt kan man säga att man skriver blogginlägg genom att skriva textfiler på ett speciellt format som heter Markdown. Så fungerar nästan alla "Static Site Generators" (SSG) och det är ett enkelt format att lära sig.
Man kan läsa om Markdown på Wikipedia eller på Markdownguide.
¶ Exempel på ett blogginlägg
Jag har skapat ett blogginlägg här som jag har skrivit i Markdown. Det har jag gjort genom att skapa filen content/posts/markdown-exempel.md med följande innehåll:
+++
title = 'Litet blogginlägg med Markdown'
date = 2023-10-30T21:25:21+01:00
draft = false
+++
Så här ser Markdown ut! För det allra mesta som vanligt text. Men om man vill formatera på något sätt (som kursiv stil eller fet text) eller lägga till listor eller bilder så får man skriva enkla koder.
# Huvudrubrik
En rad som startar med `#` blir rubriknivå 1.
## Rubriknivå 2
En rad som startar med `##` blir rubriknivå 2.
## Formattering
Här kommer lite formatering med **fet text**, *kursiv text* och [här är en länk till Konstellationens hemsida](https://konstellationen.org). Här är en lista:
* En punkt
* Ännu en punkt
* Och så en till
Man kan också numrera:
1. Första punkten
2. Andra punkten
3. Tredje punkten
## Bilder
Antingen så kan man länka till en bild någon annanstans. Här är ett exempel på länk till Konstellationens logga:
.
Eller så länkar man till en bild som finns på själva sidan men då måste man se till att den redan finns. Jag råkar veta att det finns en fil under `/static/traffic.jpg` så då länkar jag den här med bara `/traffic.jpg` (eftersom katalogen `/static` är den katalog Hugo tittar i efter bilder):
.
Och med det så kan göra väldigt mycket.
Som du kan se i blogginlägget som skapats så är de första 5 raderna lite speciella:
+++
title = 'Litet blogginlägg med Markdown'
date = 2023-10-30T21:25:21+01:00
draft = false
+++
De är specifika just för Hugo och är inte riktigt en del av Markdown-koden utan lite metadata om blogginlägget. Men resten är Markdown-kod.
¶ Skapa blogginlägg genom Web IDE
Så länge markdown-filerna kommer upp på Gitlab och kan genereras till Gitlab Pages så kvittar det om man skriver lokalt på sin dator och flyttar över filerna med kommandot git eller om man skriver filerna direkt i Web IDE:n på Gitlab.
Fördelen med att skriva lokalt på sin dator först är att man kan testa att allt ser bra ut innan man publicerar. Men om man bara skriver text med lite länkar så är det nog enklare att bara skriva direkt i Web IDE.
Jag beskriver nu hur jag ska göra för att skriva ett enkelt blogginlägg.
¶ Logga in på Gitlab
Det första jag gör är att jag loggar in på https://gitlab.com. Då kommer jag till förstasidan där jag kan se projekt jag har:
Jag klickar på repot Annabloggar.gitlab.io och kommer till sidan för den:
Här ser man en överblick över alla filer i repot. Men nu vill vi öppna Web IDE så vi klickar på knappen "Edit" och får upp:
Vi klickar på "Web IDE" och då laddas en slags textredigerare upp som ser ut så här:
Vi ska nu skapa en textfil som heter min-nya-post.md i katalogen content som man ser i vänsterspalten.
Vi börjar med att "klicka ut" katalogerna i content:
Här kan vi att under katalogen content så finns det en katalog som heter posts och i den finns det några markdown-filer. (Vi ser också filen om.md som motsvarar sidan Om mig).
Det vi ska göra nu är att högerklicka på katalogen posts och välja alternativet New file... från menyn och skriva in min-nya-post.md. Då öppnas en ny flik inuti Wed IDE där vi kan skriva in text. Jag brukar göra så att jag kopierar de där 5 första raderna från en annan Markdown-fil för jag kommer aldrig riktigt ihåg formatet 
Så vi skriver in följande kod där:
+++
title = 'Min nya post'
date = 2023-10-30T22:05:21+01:00
draft = false
+++
Här är min nya post! Det första jag vill göra är att tipsa om att [Bli medlem i Kamratdataföreningen Konstellationen](https://konstellationen.org/bli-medlem/).
Det andra jag vill göra är att göra en punktlista:
* Punkt ett
* Punkt två
Ja, nu är jag färdig!
Nu är vi färdiga! Då ska vi "commita" ändringen. Ja, det heter så när man använder git. Då klickar vi på ikonen för "Source Control":
Då dyker det upp en ruta:
Då ska man skriva in ett meddelande för vad man ska kalla den här ändringen i git-repot. Vi kallar den bara Blogginlägget min nya post och klickar på Commit to 'master'. Då kommer den att fråga om man verkligen vill göra det:
Vi trycker på Continue.
Och efter ett tag får vi ett sånt här trevligt meddelande:
¶ Nu byggs alla blogginlägg...
Och nu så sker det lite grejer bakom kulisserna: hela hemsidan med alla sidor och blogginlägg byggs om och läggs upp på nytt under Gitlab Pages på https://annabloggar.gitlab.io. Om man är nyfiken kan man se allt som händer. Då får man gå tillbaka till repot för Annabloggar.gitlab.io och sen klicka på menyn "Build" och sen "Pipelines". Då ser det ut ungefär så här:
Då kan man se att det står "Passed". Det här är dock inte något man behöver göra. Det gör man bara för att felsöka om något blir knasigt.
Men då kan vi surfa över till https://annabloggar.gitlab.io och se att vi har ett nytt blogginlägg:
Och om vi klickar på blogginlägget så ser vi det så klart:
Sådär! Nu vet du hur man skapar ett nytt blogginlägg.