Skip to content

Allt om WordPress, webbutveckling — och mer därtill

⚙️ Grav: ofta använda inställningar och kodsnuttar (Markdown, Twig, Atom editor)

⚙️ Grav: ofta använda inställningar och kodsnuttar (Markdown, Twig, Atom editor)

När du har jobbat med Grav CMS i flera år samlar du på dig en uppsättning kodsnuttar som följer med från projekt till projekt. YAML frontmatter, Twig-mallar, syntaxmarkeringskonfigurationer, Atom regex-mönster: att gräva i dokumentationen eller ett gammalt repository varje gång slösar tid. Särskilt när Grav körs på en VPS och du måste komma ihåg hur du installerar sqlite-drivrutinen för PHP 8.3 korrekt eller kommenterar ut SetHandler efter en Apache-uppdatering.

Detta cheat sheet är en destillation från verklig praktik: standardhuvud, Markdown-inställningar för sidor, Twig-snuttar i inläggstext, Atom regex för efterbearbetning av.md-exporter och Ubuntu-serverkommandon. Allt på ett ställe, med förklaringar av vad och varför.

💡 Snabb översikt:

  • Konfigurera Grav YAML frontmatter med alla fält: taxonomi, page-toc, highlight, process, anpassad page-addon
  • Ställ in Markdown-logik i sidhuvuden: titel, beskrivning, datum, taxonomier, mall
  • Lägg till Twig-kod i brödtexten: automatisk innehållsförteckning via toc(), Unitegallery-galleri
  • Bearbeta Writage.md-exporter i Atom: ersätt media/ i sökvägar, skicka klasser för lazy load
  • Ställ in servermiljö: SQLite, Memcached, PHP 8.3 på Ubuntu 24.04, redigera php*.conf för Virtualmin

Grav standardhuvud för alla webbplatssidor

Den grundläggande Grav-sidans YAML frontmatter innehåller fält som CMS:et läser under renderingen. Nedan finns en fungerande mall som täcker de flesta typiska uppgifter: från taxonomier till anpassade page-addon-flaggor.

1title: ''
2date: '2026-06-14 10:00'
3published: true
4media_order: poster.jpg
5metadata:
6 description: ''
7taxonomy:
8 category:
9 - WordPress
10 tag:
11 - WordPress - Plugins
12 - WordPress - Admin
13page-toc:
14 active: true
15template: blog_item
16highlight:
17 enabled: true
18 lines: true
19page-addon:
20 ifarmelazy: true

page-toc.active: true aktiverar pluginmodulen Page Toc (GitHub), som bygger en innehållsförteckning från H1-H6 direkt på sidan. template: blog_item anger uttryckligen bloggunder sidans mall så att Grav inte bestämmer den heuristiskt vid varje rendering.

Blocket page-addon är en anpassad sektion för användardefinierade flaggor. Här aktiverar ifarmelazy: true lazy loading för iframes: i filen user/themes/g5_helium/custom/templates/partials/blog_item.html.twig utlöses ett villkor som laddar skriptet iframe.ly.

1{% if attribute(page.header, 'page-addon').ifarmelazy %}
2 <script async charset="utf-8" src="//cdn.iframe.ly/embed.js"></script>
3{% endif %}
4

För att infoga själva iframen (till exempel en YouTube-video), använd denna struktur:

1<iframe allowfullscreen
2 data-iframely-url="https://www.youtube.com/embed/54WI1XSilb4"
3 scrolling="no"
4 style="border: 0; top: 0; left: 0; width: 100%; height: 100%; position: absolute;">
5</iframe>

Markdown-inställningar för inläggssidors sidhuvuden

Detta avsnitt täcker fält som anges i sidhuvudet för varje enskilt inlägg.

Titel och beskrivning

1title: 'Grav + Gantry 5 — an overview of useful extensions and resources'
2metadata:
3 description: 'A collection of Grav extensions for Gantry 5 that speed up work with content and templates.'

Beskrivning hamnar i <meta name="description"> och är viktig för sökresultatsutdrag.

Skapandedatum och Auto Date

1date: '2026-06-14 10:00'

För att få datumet automatiskt satt när en sida skapas, installera pluginmodulen Auto Date, github.com/getgrav/grav-plugin-auto-date. Den infogar aktuellt datum och tid om fältet date inte fylls i manuellt.

Taxonomier

För en enskild kategori och enskild tagg, platt syntax:

1taxonomy:
2 category: WEB
3 tag: Markdown

För flera värden, använd listformat:

1taxonomy:
2 category:
3 - Grav
4 tag:
5 - Grav - Gantry 5
6 - Grav - Plugins

Sidtoc och mall

Sidtoc genererar en innehållsförteckning från rubrikerna i sidans brödtext. Utöver flaggan page-toc.active: true i sidhuvudet kan du lägga till Twig-kod direkt i temamallen (se Twig-avsnittet nedan).

template: blog_item anges manuellt så att Grav tillförlitligt använder blogginläggets undersidemall, eftersom CMS:et ibland misslyckas med autodetektering för nya sidor.

Markdown- och Twig-förprocessorer

1process:
2 markdown: true
3 twig: true
4twig_first: true

twig_first: true innebär att Grav först bearbetar Twig-mallmotorn och sedan Markdown. Ordningen är avgörande om sidans brödtext innehåller Twig-logik som genererar Markdown-uppmärkning.

Syntaxmarkering (Highlight)

Beror på plugin-programmet Highlight, github.com/getgrav/grav-plugin-highlight.

1highlight:
2 enabled: true
3 lines: true

lines: true lägger till radnumrering i markerade kodblock.

Twig-inställningar för sidans brödtext

Automatisk innehållsförteckning via toc()

Sidtoc kan fungera inte bara från sidhuvudet utan också genom direkt inlägg i temamallen. I filen user/themes/g5_helium/custom/templates/partials/blog_item.html.twig, lägg till:

1{# PAGE TOC START #}
2{#
3page-toc:
4 active: true
5 #}
6{% if attribute(page.header, 'page-toc').active %}
7 {% set table_of_contents = toc(page.content) %}
8 {% if table_of_contents is not empty %}
9 Table of contents:
10 {{ table_of_contents|raw }}
11 {% endif %}
12
13{% endif %}
14{# PAGE TOC END #}
15

Twig-funktionen toc(page.content) tolkar rubriker i page.content och returnerar ett strukturerat träd. Villkoret kontrollerar flaggan page-toc.active från sidhuvudet, vilket gör att du kan aktivera och inaktivera innehållsförteckningen för enskilda sidor utan att röra mallen.

Bildgalleri via Unitegallery

Plugin-programmet Unitegallery, github.com/variar/grav-plugin-unitegallery, lägger till ett galleri i Grav baserat på JS-biblioteket Unitegallery med flera visningsteman.

Efter installation via adminpanelen eller GPM (Grav Package Manager) läggs en enda rad till i sidans brödtext:

1{{ unite_gallery(page.media.images) | raw }}
2

Den renderar alla bilder som laddats upp till sidans mediesamling som ett galleri.

Atom-sök och ersätt för Writage.md-exporter

När WordPress-inlägg exporteras till Markdown via Writage innehåller bildsökvägar prefixet media/, och för att aktivera lazy loading krävs klasserna figure-img och img-fluid. Att manuellt redigera varje URL är meningslöst; Atom med reguljära uttryck gör det på en sekund.

Plugin-programmet Lazy Image hanterar lazy loading, github.com/unsaturated/grav-plugin-lazy-image.

Hitta (reguljärt uttryck):

1(![.*]()(media/)(.*)())

Ersätt med lightbox-variant (FeatherLight-plugin):

1$1$3)

Ersätt med enbart lazy loading:

1$1$3?classes=figure-img,img-fluid)

Efter ersättningen får bilden en classes-frågeparameter som Lazy Image fångar upp.

Arbeta med miniatyrbilder

Grav kan dynamiskt manipulera bilder: ändra storlek, beskära, cachelagra. En sidminiatyr sätts via Markdown-syntax med frågeparametrar:

1![ALT Image](https://learn.getgrav.org/20/content/media)

Mer om mediehantering finns i den officiella dokumentationen: learn.getgrav.org/content/media.

Ubuntu 24.04 serverinstallation för Grav

Grav på en VPS kräver PHP, SQLite (för intern plugin-databas) och helst Memcached (sidcachning). Nedan finns aktuella kommandon för Ubuntu 24.04 LTS och PHP 8.3.

Installera PDO SQLite på PHP 8.3

1sudo apt-get update
2sudo apt-get install php8.3-sqlite
3sudo systemctl restart apache2

SQLite används av Grav för att lagra loggar, plugin-cache och intern bokföring. Utan drivrutinen kraschar adminpanelen med ett databasanslutningsfel.

Installera Memcached

Aktuella instruktioner: tecadmin.net/install-memcached-with-php-on-ubuntu/.

1sudo apt-get update
2sudo apt-get install memcached
3
4sudo add-apt-repository ppa:ondrej/php
5sudo apt-get update
6sudo apt-get install -y php php-dev php-pear libapache2-mod-php
7
8sudo apt-get install -y php-memcached
9
10sudo systemctl restart apache2

PHP-filer körs inte efter versionsbyte (Virtualmin/Webmin)

Efter byte från PHP 7.x till 8.3 kan Apache leverera .php-filer som text istället för att exekvera dem, ett känt beteende vid modulbyten. Problemet ligger i SetHandler-direktiv i PHP-modulens konfiguration.

1sudo nano /etc/apache2/mods-enabled/php8.3.conf

Kommentera bort dessa rader:

1 # SetHandler application/x-httpd-php
2 # SetHandler application/x-httpd-php-source

Slutlig php8.3.conf efter redigering:

1&lt;filesmatch &quot;.+\.ph(ar|p|tml)$&quot;&gt;
2 # SetHandler application/x-httpd-php
3</filesmatch>
4<filesmatch ".+\.phps$">
5 # SetHandler application/x-httpd-php-source
6 # Deny access to raw php sources by default
7 # To re-enable it's recommended to enable access to the files
8 # only in specific virtual host or directory
9 Require all denied
10</filesmatch>
11
12 # Deny access to files without filename (e.g. '.php')
13&lt;filesmatch &quot;^\.ph(ar|p|ps|tml)$&quot;&gt;
14 Require all denied
15</filesmatch>
16
17 # Running PHP scripts in user directories is disabled by default
18 #
19 # To re-enable PHP in user directories comment the following lines
20 # (from <IfModule ...> to </IfModule>.) Do NOT set it to On as it
21 # prevents .htaccess files from disabling it.
22<ifmodule mod_userdir.c="">
23 <directory /home/*/public_html>
24 php_admin_flag engine Off
25 </directory>
26</ifmodule>

Efter redigering, starta om Apache:

1sudo systemctl restart apache2

Video: vad är Grav CMS och var ska man börja

En kort introduktion till Grav för dig som hör talas om flat file-CMS för första gången: vad som finns under huven, hur innehåll är strukturerat och varför det kan gå snabbare att köra utan databas.

⁉️🤔 Vanliga frågor

Kräver Grav en databas?

Nej, Grav är ett flat file-CMS. Allt innehåll, inställningar, taxonomier och metadata lagras i textfiler (Markdown och YAML). SQLite används valfritt för interna behov: plugin-cache, loggar, köer. PostgreSQL och MySQL krävs inte officiellt. I praktiken innebär detta att en backup av sajten är att helt enkelt kopiera mappen /user.

Är pluginmodulen Page Toc obligatorisk för innehållsförteckning?

Den kan ersättas med direkt Twig-kod som använder toc(page.content) i temamallen. Men pluginmodulen är smidigare för att snabbt slå på/av via en flagga i YAML-frontmatter på en specifik sida. Om din sajt har 50+ sidor är det mer praktiskt att hantera via sidhuvudet än att förgrena sig i mallen.

Hur skiljer sig Highlight från Prism.js eller Highlight.js?

Highlight är den officiella Grav-pluginmodulen som integrerar highlight.js direkt i renderingspipelinen. Den förstår flaggorna enabled och lines från YAML-sidhuvudet och kräver inte manuell inkludering av JS/CSS; GPM hanterar allt. Prism.js skulle behöva inkluderas manuellt i temat.

Är Grav fortfarande relevant 2026 jämfört med WordPress?

För vissa scenarier, ja. Grav vinner för statiska visitkortssajter, portföljer, dokumentation och landningssidor där komplex användarlogik och e-handel inte behövs. Flat file-arkitekturen ger omedelbar respons utan databas, och versionshantering av innehåll fungerar via Git. Men för en blogg med tusentals inlägg, ett mediebibliotek och dynamiska arkiv är WordPress mer praktiskt tack vare sitt ekosystem av tillägg.

Vad ska jag göra om Gravs adminpanel slutar fungera efter en PHP-uppdatering?

Tre typiska orsaker: (1) php8.x-sqlite är inte installerat, och Grav kraschar tyst utan databasdrivrutinen; (2) SetHandler är inte bortkommenterat i php8.x.conf när Virtualmin används, och Apache serverar .php som text; (3) rättigheterna på mapparna cache/, logs/ och backup/ inuti /user har återställts, så kör chown -R www-data:www-data user/.

Färdig lathund: vad du ska kopiera in i ditt projekt

Sex filer och pluginmoduler som startar ett typiskt Grav-projekt på VPS: sidhuvud med taxonomier och page-toc, Twig-innehållsförteckning i mallen, Markdown-förprocessor, Highlight, Unitegallery och Atom-regex för efterbearbetning av exporter. Lägg till serverkonfigurationen från Ubuntu 24.04-avsnittet, så har du en fullt redo miljö på en halvtimme. Bokmärk denna sida; vi uppdaterar kodsnuttar för aktuella Grav- och PHP-versioner.