Add documentation

This commit is contained in:
Ruben 2025-10-03 12:30:04 +02:00
parent c3f821caef
commit 7ad0062dee
34 changed files with 1921 additions and 0 deletions

View file

@ -0,0 +1,2 @@
title = "Forklaring"
summary = "Forstå konseptene og designvalgene bak PnP"

View file

@ -0,0 +1,2 @@
title = "Rutingssystemet"
summary = "Forstå hvordan PnPs mappebaserte ruting fungerer"

View file

@ -0,0 +1,98 @@
# Forstå ruting i PnP
PnP bruker et enkelt, intuitivt mappebasert rutingssystem som kobler mapper direkte til URL-er.
## Filosofien
Tradisjonelle webrammeverk krever at du definerer ruter i konfigurasjonsfiler. PnP tar en annen tilnærming: **mappestrukturen ER rutekonfigurasjonen din**.
Dette designvalget prioriterer:
- **Enkelhet**: Ingen rutdefinisjoner å vedlikeholde
- **Forutsigbarhet**: URL-er matcher mappestrukturen nøyaktig
- **Vedlikeholdbarhet**: Lett å forstå selv år senere
## Hvordan det fungerer
### URL til fil-mapping
Når en forespørsel kommer inn, følger ruteren denne logikken:
1. **Nøyaktig filmatch**: Hvis `/content/om.html` eksisterer, server den
2. **Mappe med sidefil**: Hvis `/content/om/` inneholder `page.md`, server den
3. **Mappe med enkeltfil**: Hvis `/content/blogg/innlegg/` inneholder `article.md`, server den
4. **Mappelisting**: Hvis `/content/blogg/` inneholder undermapper, list dem
### Skråstrek-atferd
PnP omdirigerer automatisk mappebaserte sider til å inkludere skråstrek på slutten:
- `/blogg/mitt-innlegg``/blogg/mitt-innlegg/` (301 redirect)
Dette sikrer at relative stier i markdown fungerer korrekt (bilder, lenker, etc).
## Filprioritet
Når PnP ser etter innhold i en mappe, søker den etter filer i denne rekkefølgen:
### For enkle sider (artikler, innlegg):
1. `single.php`
2. `single.html`
3. `single.md`
4. `post.php`
5. `post.html`
6. `post.md`
7. `article.php`
8. `article.html`
9. `article.md`
### For overordnede sider:
1. `page.php`
2. `page.html`
3. `page.md`
## Språkvariasjoner
PnP støtter flerspråklige sider. For språk som ikke er standardspråket, søker ruteren etter språkspesifikke filer først:
```
page.en.md → Engelsk versjon
page.md → Norsk versjon (standard)
```
URL-strukturen blir:
```
/om/ → Norsk (standard)
/en/about/ → Engelsk
```
## Egendefinerte indekssider
Du kan overstyre standard mappelisting ved å lage en `index.php`-fil i en hvilken som helst mappe.
## Mappenavn med datoer
PnP trekker automatisk ut datoer fra mappenavn:
```
/content/blogg/2025-01-15-mitt-innlegg/
```
Datoen formateres automatisk til norsk format: "15. januar 2025"
## Hvorfor denne tilnærmingen?
Dette rutingssystemet vil fungere i flere tiår fordi:
- Ingen komplekse avhengigheter
- Ingen rutdefinisjoner som blir utdaterte
- Filsystemoperasjoner er standardiserte og stabile
- Enkelt å migrere eller ta backup (bare kopier mapper)
- Ingen abstraksjoner som skjuler underliggende struktur
- Ingen kompilering eller cache-generering nødvendig
## Sikkerhet
Ruteren validerer alle stier for å forhindre directory traversal-angrep:
- Filer må være innenfor document root
- Realpaths sjekkes mot contentDir
- Kun godkjente filtyper serveres

View file

@ -0,0 +1,2 @@
title = "Malsystemet"
summary = "Forstå hvordan PnPs malsystem fungerer"

View file

@ -0,0 +1,225 @@
# Forstå malsystemet
PnP bruker et enkelt, men kraftig malsystem basert på PHP-inkluderinger.
## Filosofien
Tradisjonelle templating-systemer introduserer nye språk og syntaks som må læres. PnP tar en annen tilnærming: **bruk PHP som det er**.
Dette designvalget gir:
- **Ingen læringskurve**: Hvis du kan PHP, kan du lage maler
- **Full kraft**: Tilgang til alle PHP-funksjoner
- **Null overhead**: Ingen kompilering eller parsing
- **Lett feilsøking**: Standard PHP-feilmeldinger
## Malhierarki
PnP har tre hovednivåer av maler:
### 1. Basismal (base.php)
Inneholder den overordnede HTML-strukturen:
```php
<!DOCTYPE html>
<html lang="<?= $currentLang ?>">
<head>
<meta charset="UTF-8">
<title><?= $pageTitle ?? 'Min side' ?></title>
</head>
<body>
<nav><!-- Navigasjon --></nav>
<?= $content ?>
<footer><!-- Footer --></footer>
</body>
</html>
```
### 2. Sidemal (page.php)
Pakker inn enkeltinnhold:
```php
<article>
<?= $content ?>
</article>
```
### 3. Listemal (list.php)
Viser samlinger av innhold:
```php
<article>
<?php foreach ($items as $item): ?>
<div>
<h2><a href="<?= $item['url'] ?>"><?= $item['title'] ?></a></h2>
</div>
<?php endforeach; ?>
</article>
```
## Dataflyt
Når en forespørsel kommer inn, flyter data gjennom systemet slik:
```
Request → Router → Content → Page Template → Base Template → Response
```
1. **Router**: Finner riktig innhold
2. **Content**: Konverterer markdown/HTML til HTML
3. **Page Template**: Pakker innholdet i `$content`
4. **Base Template**: Pakker alt i full HTML-struktur
## Fallback-kjede
PnP følger en fallback-kjede for maler:
```
custom/templates/base.php
↓ (hvis ikke funnet)
default/templates/base.php
```
Dette betyr:
- Egendefinerte maler overstyrer standardmaler
- Du trenger bare å lage egendefinerte maler for det du vil endre
- Standardmaler fungerer som fallback
## Tilgjengelige variabler
### I base.php
| Variabel | Type | Beskrivelse |
|----------|------|-------------|
| `$content` | string | Det rendrede innholdet |
| `$navigation` | array | Navigasjonselementer |
| `$currentLang` | string | Nåværende språk |
| `$defaultLang` | string | Standardspråk |
| `$homeLabel` | string | Label for hjem-lenken |
| `$translations` | array | Oversettelser fra språkfiler |
| `$pageTitle` | string | Sidens tittel |
### I page.php
| Variabel | Type | Beskrivelse |
|----------|------|-------------|
| `$content` | string | Innholdet som skal vises |
| `$pageMetadata` | array | Metadata for siden |
| `$pageTitle` | string | Sidens tittel |
### I list.php
| Variabel | Type | Beskrivelse |
|----------|------|-------------|
| `$items` | array | Listeelementer |
| `$metadata` | array | Metadata for mappen |
| `$pageContent` | string | Valgfritt innhold fra page.md |
## Items-struktur
I list.php er hvert element i `$items` et array med:
```php
[
'title' => 'Innleggstittel',
'date' => '15. januar 2025',
'url' => '/blogg/2025-01-15-innlegg',
'cover' => '/blogg/2025-01-15-innlegg/cover.jpg', // eller null
'summary' => 'Kort beskrivelse' // eller null
]
```
## Sikkerhet i maler
### Escape output
Bruk alltid `htmlspecialchars()` for brukerdata:
```php
<h1><?= htmlspecialchars($item['title']) ?></h1>
```
### Ikke escape HTML-innhold
`$content` inneholder allerede HTML og skal ikke escapes:
```php
<?= $content ?> <!-- RIKTIG -->
<?= htmlspecialchars($content) ?> <!-- FEIL -->
```
## Beste praksis
### Bruk korte echo-tags
```php
<?= $variable ?> <!-- Bra -->
<?php echo $variable; ?> <!-- Fungerer, men mer verbose -->
```
### Sjekk for eksistens
```php
<?php if (isset($metadata['summary'])): ?>
<p><?= htmlspecialchars($metadata['summary']) ?></p>
<?php endif; ?>
```
### Bruk ternary for fallbacks
```php
<title><?= $pageTitle ?? 'Standard tittel' ?></title>
```
### Hold logikk utenfor maler
Forbered data i ruteren eller i egne funksjoner, ikke i malene:
```php
<!-- DÅRLIG -->
<?php
$processedItems = array_filter($items, function($item) {
return strlen($item['title']) > 10;
});
?>
<!-- BRA -->
<!-- Gjør dette i ruteren eller i en egen funksjon -->
```
## Egendefinerte maler
For å lage egendefinerte maler:
1. Kopier standardmalen fra `/app/default/templates/`
2. Lim den inn i `/app/custom/templates/`
3. Endre etter behov
Eksempel:
```bash
cp app/default/templates/base.php app/custom/templates/base.php
# Rediger app/custom/templates/base.php
```
## Spesialiserte maler
Du kan lage spesialiserte maler for spesifikke formål:
### list-grid.php
En alternativ listevisning med grid-layout:
```php
<article class="grid">
<?php foreach ($items as $item): ?>
<div class="card">
<!-- Grid-basert layout -->
</div>
<?php endforeach; ?>
</article>
```
PnP vil automatisk foretrekke `list-grid.php` over `list.php` hvis den eksisterer.
## Hvorfor dette systemet?
Dette malsystemet vil fungere i flere tiår fordi:
- Ingen proprietære templating-språk som kan bli utdaterte
- Basert på standard PHP-funksjoner
- Ingen kompilering eller cache-generering
- Lett å debugge med standard PHP-verktøy
- Ingen dependencies som kan bryte
- Fullt SEO-vennlig (server-side rendering)

View file

@ -0,0 +1,2 @@
title = "Legge til bilder"
summary = "Lær hvordan du legger til og optimaliserer bilder"

View file

@ -0,0 +1,140 @@
# Hvordan legge til bilder
Lær hvordan du legger til og administrerer bilder i PnP.
## Grunnleggende bildebruk
### Legg til bilder i samme mappe som innholdet
Den enkleste måten å legge til bilder på er å plassere dem i samme mappe som innholdsfilen:
```
/content/blogg/mitt-innlegg/
├── article.md
├── bilde1.jpg
└── bilde2.webp
```
Deretter refererer du til dem i markdown:
```markdown
![Beskrivelse av bildet](bilde1.jpg)
```
### Relative stier
PnP sikrer at relative stier fungerer korrekt ved å automatisk legge til skråstrek på slutten av URL-er. Dette betyr at bilder i samme mappe alltid fungerer.
## Forsidebilder (Cover images)
For blogginnlegg og artikler kan du legge til et forsidebilde som vises i listevisninger:
1. Navngi bildet `cover.jpg`, `cover.webp`, `cover.png`, eller `cover.gif`
2. Plasser det i samme mappe som innholdet
3. PnP viser det automatisk i listevisninger
```
/content/blogg/mitt-innlegg/
├── article.md
├── cover.webp
└── andre-bilder.jpg
```
## Anbefalte bildeformater
### WebP
Bruk WebP for beste kompresjon og kvalitet:
```markdown
![Beskrivelse](bilde.webp)
```
### JPEG
Bruk JPEG for fotografier:
```markdown
![Foto](foto.jpg)
```
### PNG
Bruk PNG for grafikk med gjennomsiktighet:
```markdown
![Logo](logo.png)
```
### SVG
Bruk SVG for vektorgr grafikk (logoer, ikoner):
```markdown
![Ikon](ikon.svg)
```
## Optimalisere bilder
### Komprimering
Komprimer bilder før du laster dem opp:
- JPEG: Bruk 80-85% kvalitet
- WebP: Bruk 80-85% kvalitet
- PNG: Bruk verktøy som `pngcrush` eller `optipng`
### Responsiv størrelse
Skalér bilder til passende størrelse:
- Full bredde: Maks 1920px bredde
- Forsidebilder: 800-1200px bredde
- Ikoner: 200-400px bredde
## Bruke bilder i egendefinerte maler
I listemaler er forsidebilder tilgjengelige via `$item['cover']`:
```php
<?php foreach ($items as $item): ?>
<article>
<?php if ($item['cover']): ?>
<img
src="<?= $item['cover'] ?>"
alt="<?= htmlspecialchars($item['title']) ?>"
loading="lazy"
>
<?php endif; ?>
<h2><?= htmlspecialchars($item['title']) ?></h2>
</article>
<?php endforeach; ?>
```
## Lazy loading
Bruk `loading="lazy"` for bilder som ikke er synlige umiddelbart:
```markdown
<img src="bilde.jpg" alt="Beskrivelse" loading="lazy">
```
Dette forbedrer sidelastingstiden betydelig.
## Tilgjengelige bildestier
Bilder plassert i innholdsmapper er automatisk tilgjengelige via URL-en:
```
/content/blogg/mitt-innlegg/bilde.jpg
→ dinside.no/blogg/mitt-innlegg/bilde.jpg
```
## Delte bilder
For bilder som brukes på flere sider, plasser dem i `/app/custom/assets/images/`:
```
/app/custom/assets/images/logo.svg
→ dinside.no/images/logo.svg
```
Deretter refererer du til dem med absolutte stier:
```markdown
![Logo](/images/logo.svg)
```

View file

@ -0,0 +1,2 @@
title = "Tilpasse maler"
summary = "Lær hvordan du tilpasser utseendet til PnP-siden din"

View file

@ -0,0 +1,126 @@
# Hvordan tilpasse maler
Lær hvordan du tilpasser utseendet og følelsen av PnP-siden din.
## Tilpasse basismalen
Basismalen kontrollerer det overordnede oppsettet for siden din.
1. Naviger til `/app/custom/templates/`
2. Rediger `base.php`
3. Endre HTML-strukturen etter behov
Eksempel: Legg til en egendefinert header:
```php
<header>
<div class="logo">
<a href="/">Min egendefinerte side</a>
</div>
<nav>
<?php foreach ($navigation as $item): ?>
<a href="<?= $item['url'] ?>"><?= $item['title'] ?></a>
<?php endforeach; ?>
</nav>
</header>
```
## Tilpasse listemalen
Listemalen kontrollerer hvordan mapper med innhold vises.
1. Rediger `/app/custom/templates/list.php`
2. Endre HTML-strukturen for listeelementer
Eksempel: Legg til en egendefinert wrapper:
```php
<article>
<?php foreach ($items as $item): ?>
<div class="card">
<?php if ($item['cover']): ?>
<img src="<?= $item['cover'] ?>" alt="<?= htmlspecialchars($item['title']) ?>">
<?php endif; ?>
<h2><a href="<?= $item['url'] ?>"><?= htmlspecialchars($item['title']) ?></a></h2>
<time><?= $item['date'] ?></time>
<?php if ($item['summary']): ?>
<p><?= htmlspecialchars($item['summary']) ?></p>
<?php endif; ?>
</div>
<?php endforeach; ?>
</article>
```
## Tilpasse sidemalen
Sidemalen brukes for å pakke inn enkeltinnhold.
1. Rediger `/app/custom/templates/page.php`
2. Legg til egendefinerte elementer rundt innholdet
Eksempel:
```php
<article class="page-content">
<?php if ($pageMetadata && isset($pageMetadata['title'])): ?>
<header>
<h1><?= htmlspecialchars($pageMetadata['title']) ?></h1>
</header>
<?php endif; ?>
<?= $content ?>
<footer>
<p>Sist oppdatert: <?= date('d.m.Y') ?></p>
</footer>
</article>
```
## Tilpasse stiler
1. Rediger `/app/custom/styles/base.css`
2. Endre CSS-variabler for farger, fonter, etc.
Eksempel:
```css
:root {
--color-primary: oklch(0.65 0.25 30);
--color-background: oklch(0.98 0 0);
--font-body: 'Georgia', serif;
--font-heading: 'Helvetica Neue', sans-serif;
--spacing-base: 1rem;
}
body {
font-family: var(--font-body);
background: var(--color-background);
line-height: 1.6;
}
h1, h2, h3 {
font-family: var(--font-heading);
}
```
## Bruke standardmaler
Hvis `/app/custom/` ikke eksisterer, bruker PnP standardmaler fra `/app/default/`. Dette er nyttig for raske oppsett.
## Tilgjengelige variabler i maler
### I `base.php`:
- `$content` - Det rendrede innholdet
- `$navigation` - Array med navigasjonselementer
- `$currentLang` - Nåværende språk
- `$homeLabel` - Label for hjem-knappen
### I `page.php`:
- `$content` - Sideinnholdet
- `$pageMetadata` - Metadata for siden
- `$pageTitle` - Sidens tittel
### I `list.php`:
- `$items` - Array med listeelementer
- `$metadata` - Metadata for mappen
- `$pageContent` - Valgfritt innhold fra page.md i mappen

View file

@ -0,0 +1,2 @@
title = "Hvordan-guider"
summary = "Praktiske guider for utvikleroppgaver"

View file

@ -0,0 +1,2 @@
title = "Flerspråklige sider"
summary = "Lær hvordan du lager nettsider med støtte for flere språk"

View file

@ -0,0 +1,216 @@
# Hvordan lage flerspråklige sider
Lær hvordan du lager nettsider med støtte for flere språk i PnP.
## Konfigurere språk
### Steg 1: Rediger config.ini
Åpne `/app/custom/config.ini` (eller lag den hvis den ikke eksisterer):
```ini
[languages]
default = "no"
available = "no,en"
```
- `default`: Standardspråket (vises uten språkprefiks i URL)
- `available`: Kommaseparert liste over tilgjengelige språk
### Steg 2: Lag språkfiler
Opprett oversettelser i `/app/custom/languages/`:
**no.ini:**
```ini
home = "Hjem"
read_more = "Les mer"
```
**en.ini:**
```ini
home = "Home"
read_more = "Read more"
```
Disse er tilgjengelige i maler via `$translations`-variabelen.
## Lage flerspråklig innhold
### Metode 1: Språkspesifikke filer
Lag separate filer for hvert språk:
```
/content/om/
├── page.md (Norsk)
├── page.en.md (Engelsk)
└── metadata.ini
```
**page.md:**
```markdown
# Om oss
Vi er et selskap som...
```
**page.en.md:**
```markdown
# About us
We are a company that...
```
### Metode 2: Metadata-seksjoner
Bruk metadata.ini for å oversette titler og sammendrag:
```ini
title = "Om oss"
summary = "Lær mer om oss"
menu = true
menu_order = 1
[en]
title = "About us"
summary = "Learn more about us"
slug = "about"
```
## URL-struktur
Standardspråket bruker ingen språkprefiks:
```
/om/ → Norsk (standard)
/en/about/ → Engelsk
```
Merk at den engelske versjonen bruker `slug = "about"` fra metadata.
## Navigasjon
PnP bygger automatisk navigasjon basert på `menu = true` i metadata.ini:
```php
<!-- I base.php -->
<nav>
<a href="<?= $currentLang !== $defaultLang ? "/$currentLang/" : "/" ?>">
<?= $homeLabel ?>
</a>
<?php foreach ($navigation as $item): ?>
<a href="<?= $item['url'] ?>"><?= $item['title'] ?></a>
<?php endforeach; ?>
</nav>
```
## Språkvelger
Lag en språkvelger i basismalen:
```php
<div class="language-switcher">
<a href="/" <?= $currentLang === 'no' ? 'aria-current="page"' : '' ?>>NO</a>
<a href="/en<?= $requestPath ? '/' . $requestPath : '' ?>"
<?= $currentLang === 'en' ? 'aria-current="page"' : '' ?>>EN</a>
</div>
```
## Bruke oversettelser i maler
Oversettelser fra språkfilene er tilgjengelige i `$translations`:
```php
<a href="#"><?= $translations['read_more'] ?? 'Read more' ?></a>
```
Bruk alltid en fallback-verdi for tilfeller der oversettelsen mangler.
## Beste praksis
### Konsistent mappestruktur
Bruk samme mappestruktur for alle språk:
```
/content/
├── om/
│ ├── page.md
│ └── page.en.md
└── kontakt/
├── page.md
└── page.en.md
```
### Bruk slugs for oversatte URL-er
For rene URL-er, bruk `slug` i metadata:
```ini
[en]
slug = "about" # /en/about/ i stedet for /en/om/
```
### Hold metadata samlet
Bruk én metadata.ini per mappe med seksjoner for hvert språk:
```ini
title = "Tittel"
[en]
title = "Title"
[de]
title = "Titel"
```
### Synkroniser innhold
Sørg for at alle språkversjoner har samme struktur og at alle sider er oversatt.
## Eksempel: Fullstendig flerspråklig side
```
/content/blogg/
├── metadata.ini
├── page.md
├── page.en.md
└── 2025-01-15-mitt-innlegg/
├── metadata.ini
├── article.md
├── article.en.md
└── cover.jpg
```
**blogg/metadata.ini:**
```ini
title = "Blogg"
menu = true
menu_order = 2
[en]
title = "Blog"
slug = "blog"
```
**blogg/2025-01-15-mitt-innlegg/metadata.ini:**
```ini
title = "Mitt første innlegg"
date = "2025-01-15"
summary = "Dette er mitt første innlegg"
[en]
title = "My first post"
summary = "This is my first post"
```
## Feilsøking
### Innhold vises ikke for ikke-standardspråk
Kontroller at du har enten:
- En språkspesifikk fil (f.eks. `page.en.md`)
- ELLER metadata med språkseksjon som inneholder `title`
### Navigasjon viser feil språk
Sørg for at `menu = true` er satt i base-seksjonen av metadata.ini, ikke i språkseksjonen.
### URL-er fungerer ikke
Sjekk at `slug` matcher URL-segmentet du prøver å nå.

View file

@ -0,0 +1,2 @@
title = "Utviklerdokumentasjon"
summary = "Teknisk dokumentasjon for utviklere"

View file

@ -0,0 +1,39 @@
# Utviklerdokumentasjon
Teknisk dokumentasjon for utviklere som skal tilpasse, utvide eller vedlikeholde PnP-rammeverket.
## Dokumentasjonsseksjoner
### [Veiledninger](veiledninger/)
Trinn-for-trinn guider for å lære rammeverket ved å bygge noe.
### [Hvordan-guider](hvordan/)
Praktiske guider for å utføre spesifikke utvikleroppgaver.
### [Forklaring](forklaring/)
Forstå konseptene og designvalgene bak PnP.
### [Referanse](referanse/)
Teknisk referanse for alle funksjoner og komponenter.
## Hurtigstart for utviklere
1. Forstå [rutingssystemet](forklaring/routing/)
2. Lær hvordan [malsystemet](forklaring/template-system/) fungerer
3. Tilpass [maler og stiler](hvordan/customize-templates/)
4. Les [metadata-referansen](referanse/metadata/) for alle tilgjengelige felt
## Arkitektur
PnP er bygget på disse prinsippene:
- **Mappebasert ruting**: Mappestrukturen er rutekonfigurasjonen
- **PHP-inkludering**: Maler er rene PHP-filer
- **Ingen dependencies**: Kun standard PHP og Parsedown for Markdown
- **Fallback-kjeder**: Egendefinerte maler overstyrer standardmaler
## Teknisk stack
- PHP 8.3+
- Parsedown (for Markdown)
- INI-filer (for metadata)
- Standard filsystemoperasjoner

View file

@ -0,0 +1,2 @@
title = "Referanse"
summary = "Teknisk referanse for alle funksjoner og komponenter"

View file

@ -0,0 +1,2 @@
title = "Metadata-referanse"
summary = "Fullstendig referanse for alle metadata-felt"

View file

@ -0,0 +1,152 @@
# Metadata-referanse
PnP støtter valgfrie metadatafiler for forbedret innholdskontroll.
## Filformat
Metadatafiler bruker INI-formatet og må hete `metadata.ini`.
## Plassering
Plasser `metadata.ini` i samme mappe som innholdsfilen din:
```
/content/blogg/2025-01-15-innlegg/
├── article.md
├── metadata.ini
└── cover.jpg
```
## Støttede felt
### `title`
**Type**: String
**Påkrevd**: Nei
**Standard**: Hentet fra første H1 i innholdet eller mappenavn
Overstyr sidetittelen.
```ini
title = "Min egendefinerte tittel"
```
### `date`
**Type**: Dato (YYYY-MM-DD)
**Påkrevd**: Nei
**Standard**: Hentet fra mappenavn eller filmodifiseringstidspunkt
Sett publiseringsdatoen.
```ini
date = "2025-01-15"
```
### `lastModified`
**Type**: Dato (YYYY-MM-DD)
**Påkrevd**: Nei
**Standard**: Ingen
Spor når innholdet sist ble oppdatert.
```ini
lastModified = "2025-02-10"
```
### `summary`
**Type**: String
**Påkrevd**: Nei
**Standard**: Ingen
Gi et sammendrag for listevisninger.
```ini
summary = "En kort beskrivelse av dette innholdet."
```
### `menu`
**Type**: Boolean
**Påkrevd**: Nei
**Standard**: false
Vis denne siden i navigasjonsmenyen.
```ini
menu = true
```
### `menu_order`
**Type**: Integer
**Påkrevd**: Nei
**Standard**: 999
Rekkefølgen for menyvisning (lavere tall vises først).
```ini
menu_order = 1
```
### `slug`
**Type**: String
**Påkrevd**: Nei
**Standard**: Mappenavn
Egendefinert URL-slug for oversatte versjoner.
```ini
slug = "about"
```
## Flerspråklig metadata
For flerspråklige sider kan du legge til språkspesifikke seksjoner:
```ini
title = "Om oss"
summary = "Lær mer om oss"
menu = true
[en]
title = "About us"
summary = "Learn more about us"
slug = "about"
```
PnP vil automatisk bruke riktig seksjon basert på nåværende språk.
## Fullstendig eksempel
Fullstendig metadata.ini-eksempel:
```ini
title = "Forstå PnP-ruting"
date = "2025-01-15"
lastModified = "2025-01-20"
summary = "Lær hvordan PnPs mappebaserte rutingssystem fungerer og hvorfor det er designet for lang levetid."
menu = true
menu_order = 3
[en]
title = "Understanding PnP Routing"
summary = "Learn how PnP's folder-based routing system works and why it's designed for longevity."
slug = "routing"
```
## Fallback-atferd
Hvis metadata.ini ikke er til stede:
- Tittel: Hentet fra første H1 i markdown/HTML, eller mappenavn
- Dato: Hentet fra mappenavn (YYYY-MM-DD-*) eller filmodifiseringstidspunkt
- Sammendrag: Vises ikke
- Meny: Vises ikke i navigasjon
## Bruke metadata i egendefinerte maler
Metadata er tilgjengelig i maler via `$metadata`-variabelen:
```php
<?php if ($metadata && isset($metadata['custom_field'])): ?>
<p><?= htmlspecialchars($metadata['custom_field']) ?></p>
<?php endif; ?>
```
Du kan legge til egendefinerte felt i metadata.ini og bruke dem i malene dine.

View file

@ -0,0 +1,3 @@
title = "Kom i gang"
summary = "Lær grunnleggende i PnP ved å bygge din første side"
date = "2025-01-15"

View file

@ -0,0 +1,92 @@
# Kom i gang med PnP
I denne veiledningen lærer du det grunnleggende i PnP ved å lage dine første sider.
## Hva du skal bygge
Ved slutten av denne veiledningen har du:
- En forside
- En om-side
- En enkel blogg med flere artikler
## Forutsetninger
- PHP 8.3 eller høyere
- En webserver (innebygd PHP-server fungerer fint)
- Grunnleggende kjennskap til HTML/Markdown
## Steg 1: Forstå strukturen
PnP bruker et mappebasert rutingssystem. Mappestrukturen i `/content/` blir direkte til URL-er:
```
/content/om/page.md → dinside.no/om
/content/blogg/2025-01-15-hei/article.md → dinside.no/blogg/2025-01-15-hei
```
## Steg 2: Lag din første side
1. Opprett en mappe: `/content/om/`
2. Lag en fil: `/content/om/page.md`
3. Legg til innhold:
```markdown
# Om oss
Velkommen til vår side. Vi bygger enkle, vedlikeholdbare nettsider.
```
4. Besøk `dinside.no/om` - siden din er live!
## Steg 3: Legg til et blogginnlegg
1. Opprett en mappe: `/content/blogg/2025-01-15-mitt-forste-innlegg/`
2. Lag en fil: `/content/blogg/2025-01-15-mitt-forste-innlegg/article.md`
3. Legg til innhold:
```markdown
# Mitt første innlegg
Dette er mitt første blogginnlegg med PnP!
![Eksempelbilde](bilde.jpg)
```
4. Legg til et bilde: Dra `bilde.jpg` inn i samme mappe
5. Besøk `dinside.no/blogg/2025-01-15-mitt-forste-innlegg/`
## Steg 4: Tilpass med metadata
Legg til en `metadata.ini`-fil i blogginnleggsmappen:
```ini
title = "Mitt fantastiske første innlegg"
date = "2025-01-15"
summary = "Oppdag hvor enkelt det er å publisere med PnP."
```
## Steg 5: Lag en bloggindeks
Når du har flere blogginnlegg i `/content/blogg/`, vil PnP automatisk lage en liste når du besøker `/blogg`.
Legg til `metadata.ini` i `/content/blogg/`:
```ini
title = "Blogg"
menu = true
menu_order = 2
```
Dette legger til "Blogg" i navigasjonsmenyen.
## Steg 6: Legg til et forsidebilde (cover image)
For hvert blogginnlegg kan du legge til et forsidebilde som vises i listen:
1. Legg til `cover.jpg`, `cover.webp` eller `cover.png` i innleggsmappen
2. Bildet vises automatisk i bloggindeksen
## Neste steg
- Lær om [tilpasning av maler](../../how-to/customize-templates/)
- Forstå [mappebasert ruting](../../explanation/routing/)

View file

@ -0,0 +1,2 @@
title = "Veiledninger"
summary = "Trinn-for-trinn guider for utviklere"