En innehållshanterare loggar in i adminpanelen, hittar en sida bland 50 andra, öppnar redigeraren, fixar en rubrik, sparar, går tillbaka till sajten och uppdaterar fliken. Sex klick för en redigering. För Grav CMS finns en enkel lösning: pluginet Editable with ContentTools bäddar in en WYSIWYG-redigerare direkt på sajtsidan. Du öppnar sidan, klickar på "edit", fixar texten och sparar den tillbaka till en Markdown-fil utan att gå in i adminpanelen.

Pluginet har inte uppdaterats sedan 2022 (författaren har officiellt avslutat supporten), men det körs stabilt på Grav 1.7 och täcker grundscenariot att redigera enkla Markdown-sidor utan dynamisk logik. Installationen tar fem minuter, och därefter blir textredigering på frontend mycket enklare.

Nedan följer en komplett guide från installation till åtkomsträttigheter, med en genomgång av begränsningar och ett alternativ (Fred).

💡 Snabb översikt:

• Installera pluginet via GPM eller ett zip-arkiv och kopiera konfigurationen.
• Sätt upp git-sync för att committa ändringar till ett repository (valfritt).
• Markera redigerbara ytor med editable shortcode och unika namn.
• Ge site.editable-behörigheter till frontend-användare.
• Slå ihop admin- och frontend-sessioner via session.split: false.
• Ha begränsningen i åtanke: endast ren Markdown, ingen Twig eller dynamiskt innehåll.

Installation: via GPM eller manuellt

Pluginet installeras via Grav Package Manager, standardmetoden för alla tillägg i Grav:

1
bin/gpm install editable-contenttools

Kör kommandot från sajtens rotmapp (där bin/ finns). GPM laddar ner den senaste versionen och extraherar den till /user/plugins/editable-contenttools.

Alternativt kan du installera manuellt: ladda ner zip-arkivet från GitHub, extrahera det till /user/plugins/ och byt namn på mappen till editable-contenttools (utan suffixet -master). Strukturen ska se ut så här: /user/plugins/editable-contenttools/editable-contenttools.php.

Kopiera konfigurationen till en säker plats

Efter installationen, se till att kopiera konfigurationsfilen till användarkatalogen:

1
cp user/plugins/editable-contenttools/editable-contenttools.yaml user/config/plugins/editable-contenttools.yaml

Det här steget är viktigt: om inställningarna ligger kvar i pluginmappen återställs de när du uppdaterar via GPM. Ett alternativt tillvägagångssätt är att installera via Grav Admin-panelen (Plugins → Add), då skapar systemet automatiskt konfigurationen i user/config/plugins/ och ingen manuell kopiering behövs.

Konfiguration: tre konfigurationsalternativ

Filen editable-contenttools.yaml innehåller tre parametrar:

1
enabled: true
2
git-sync: false
3
git-sync-mode: foreground

enabled aktiverar pluginet. Utan enabled: true visas inte redigeraren på frontend, även om behörigheter har getts. Standardvärdet är true.

git-sync utlöser synkronisering med ett Git-repository efter varje sparning. Det fungerar bara när pluginet Git Sync är installerat. Om din sajt lever i Git och du vill registrera varje ändring i historiken, sätt detta till true. Låt det annars vara false.

git-sync-mode avgör om systemet ska vänta på att synkroniseringen slutförs innan kontrollen återlämnas till användaren. foreground innebär att "Save"-knappen låses upp först efter att commit och push är klara. background arbetar asynkront, men vissa Linux-servrar kan ha problem med bakgrundsprocesser. För de flesta scenarier är foreground tillräckligt.

Markera redigerbara ytor: shortcoden [editable]

Pluginet gör inte automatiskt hela sidan redigerbar. Du definierar vilka block som kan redigeras med shortcoden [editable]:

1
[editable]
2
## Section heading
3
 
4
Text that can be edited from the frontend.
5
[/editable]

En sida kan innehålla hur många sådana ytor som helst. Varje yta måste ha ett unikt namn, annars vet inte ContentTools var ändringarna ska sparas.

Namnparametern: obligatorisk unikhet

Som standard tilldelar pluginet namn automatiskt (region-0, region-1 och så vidare), men det är bättre att ange meningsfulla namn manuellt:

1
[editable name="hero-block"]
2
## Main heading
3
 
4
Text that can be edited.
5
[/editable]

Vid första sparning via frontend lägger pluginet automatiskt till en name-parameter till shortcoden om en sådan saknas. I praktiken är det enklare att ange namn direkt vid uppmärkningen, eftersom det underlättar felsökning (du kan se vilket block du redigerar i webbläsarens utvecklarverktyg).

När du har märkt upp och sparat sidan, besök webbplatsen som en användare med behörigheten site.editable, klicka på pennikonen till vänster och redigera text som i en vanlig textredigerare. Håll ned Shift i ungefär tre sekunder för att markera alla redigerbara områden.

Du kan testa det på pluginets demowebbplats (sparning är inaktiverad, Grav 1.7.46).

Åtkomsträttigheter: frontend och backend

För att en användare ska se pennikonen krävs redigeringsbehörighet. Reglerna skiljer sig åt för frontend-användare (innehållsredaktörer) och backend-användare (administratörer).

Frontend-användare

En användare måste kunna logga in via pluginet Grav Login eller Private Grav. Lägg sedan till följande i kontofilen (user/accounts/username.yaml):

1
access:
2
  site:
3
    login: 'true'
4
    editable: 'true'

Utan behörigheten site.editable visas inte pennikonen, även om användaren är inloggad och har andra rättigheter.

Backend-användare (administratörer)

Som standard håller Grav isär admin- och frontendsessioner. För att låta en administratör redigera sidor direkt på webbplatsen (utan att gå in i adminpanelen), ställ in följande i system.yaml (eller via adminpanelen Configuration → System):

1
session:
2
  split: false

Detta slår ihop sessionerna: inloggning i adminpanelen ger automatiskt tillgång till frontend-redigeraren. Administratören behöver också behörigheten admin.super eller admin.pages i sin kontofil.

Om ikonen inte visas efter inloggning, kontrollera admininställningarna för cachelagring:

1
admin:
2
  super: 'true'
3
  login: 'true'
4
  cache: 'false'

Parametern cache: false inaktiverar cachelagring för admin och kan lösa problemet med den osynliga ikonen.

Begränsningar: vad pluginet inte kan göra

Pluginet fungerar uteslutande med ren Markdown. Detta är en arkitektonisk begränsning, inte en bugg: ContentTools redigerar HTML i webbläsaren, och pluginet konverterar HTML tillbaka till Markdown. I den processen kommer all dynamisk uppmärkning att förstöras. Redigera inte innehåll via ContentTools om det:

• sätts ihop av Twig-mallar (till exempel modulära sidor: barnblock infogas av föräldern dynamiskt, och pluginet kan inte se deras källkod);
• injiceras av andra plugin (Page Inject och liknande plugin infogar innehåll från andra sidor, vilket är en enkelriktad process);
• ändras via JavaScript i webbläsaren (bildspel, accordions och andra interaktiva element konverteras till statisk HTML);
• innehåller Grav Markdown-specialtaggar (bilder med parametrarna ?lightbox och ?resize skadas vid konverteringen HTML → Markdown, eftersom bearbetningsparametrarna försvinner).

Säkerhetsreglerna är enkla:

• Håll bilder och komplexa shortcodes utanför redigerbara områden.
• Håll områdena små: antalet är obegränsat, och 10 små block är bättre än ett stort block med risker.
• Testa på en kopia av inlägget eller i en staging-miljö innan du ger redaktörer åtkomst.
• Om du märker skillnader i Markdown-formateringen mellan versionen med pennikonen och versionen utan, flytta det fragmentet utanför [editable].

Alternativ: tillägget Fred

Om funktionerna i Editable with ContentTools inte räcker till, ta en titt på Fred, en nyare frontend-editor för Grav som också bygger på ContentTools. Viktiga skillnader:

• Bilduppladdning via en dialog (med rotering och enkel bildbehandling).
• Automatisk inpackning av innehåll via händelsen onPageProcessed, vilket kräver mindre manuell shortcode-märkning.
• Aktiv utveckling: författaren tar emot issues på GitHub och fortsätter lägga till funktioner.

Installation via kloning av repot till /user/plugins/fred:

1
cd user/plugins
2
git clone https://github.com/BugHunter2k/grav-plugin-fred.git fred

Behörigheter sätts på liknande sätt: site.editor: true i användarkontofilen (notera: site.editor, inte site.editable).

Både Editable with ContentTools och Fred löser samma problem: de ger innehållsansvariga ett verktyg för snabba redigeringar utan att gå in i adminpanelen. Det första passar om du behöver ett enkelt, beprövat verktyg för Markdown-sidor utan experiment. Det andra fungerar om du vill ha mer automatisering och är beredd på de potentiella ojämnheter som aktiv utveckling kan innebära.

Video: så fungerar ContentTools

En två minuters demonstration av redigering av en Grav-sida i webbläsaren: författaren visar hur redigerbara områden markeras, ändringar görs och innehåll sparas tillbaka till Markdown. Ett bra sätt att se tillägget i aktion innan installation.

⁉️🤔 Vanliga frågor

Varför visas inte pennikonen efter installation?

Kontrollera fyra saker. För det första, enabled: true i tilläggets konfiguration (user/config/plugins/editable-contenttools.yaml). För det andra måste användaren ha behörigheten site.editable i sin kontofil. För det tredje, för backend-användare måste session.split vara false i system.yaml. För det fjärde, rensa Grav-cachen: bin/grav clear-cache. Oftast är problemet antingen behörigheter eller delade sessioner.

Kan jag redigera modulära sidor?

Nej. Modulära sidor sätts ihop från undersidor via Twig-mallar, vilket är en enkelriktad process: tillägget kan inte "plocka isär" resultatet tillbaka i delar. På frontend ser du den färdiga HTML-koden, men källan (separata Markdown-filer för barnmoduler) finns i andra mappar, och tillägget vet inte var det ska spara ändringar. För modulära sidor, använd det vanliga admin-gränssnittet i Grav.

Vad händer om jag lämnar en bild inuti [editable]?

Gravs särskilda Markdown-taggar för bilder (med parametrarna ?lightbox, ?resize, ?cropResize) kommer att skadas vid konvertering från HTML till Markdown. Själva bilden blir kvar på plats (<img>-taggen konverteras till vanlig Markdown ![](url)), men bearbetningsparametrarna försvinner. Slutsats: ha alltid bilder med parametrar utanför det redigerbara området. Om en bild är enkel (utan parametrar) kan du tekniskt sett lämna den inuti, men i praktiken är det säkrare att flytta all media utanför [editable].

Tillägget är övergivet av författaren. Är det säkert att använda?

Författaren meddelade officiellt att supporten upphör 2022, och den senaste commiten är daterad augusti 2024 (en kompatibilitetsuppdatering för Grav 1.7). Tillägget är stabilt på Grav 1.7 och påverkar inte säkerhetskritiska komponenter: det arbetar bara med Markdown-innehåll och har ingen åtkomst till serveroperationer. Om du planerar att gå över till Grav 2.0, överväg att titta på Fred eller vänta på en officiell lösning för frontend-redigering (nya tillvägagångssätt baserade på TinyMCE och Prosemirror diskuteras på forumet).

Vad är skillnaden mellan Editable with SimpleMDE och ContentTools-versionen?

Editable with SimpleMDE använder samma tillvägagångssätt (frontend-redigering), men istället för en visuell editor erbjuder den Markdown-editorn SimpleMDE med live-förhandsvisning. Den passar dig som föredrar att skriva märkning för hand och vill se resultatet till höger om editorn snarare än i WYSIWYG-läge. Båda tilläggen är från samma författare (bleutzinn) och båda har varit övergivna sedan 2022.

Är det värt att installera en frontend-editor för Grav 2026

Om din webbplats körs på Grav 1.7, består av enkla Markdown-sidor och innehållsansvariga är trötta på att gå in i adminpanelen för ett par redigeringar, installera Editable with ContentTools. Fem minuter för installation, minimal konfiguration och redigering blir en operation med ett klick. Öppna sidan, klicka på pennan, fixa texten, spara. Inget letande i sidlistor, inget växlande mellan flikar.

För nya projekt eller när du planerar en övergång till Grav 2.0 (en release väntas under 2026, men det finns inget exakt datum), överväg Fred: det utvecklas mer aktivt och har större chans att få kompatibilitet med den andra versionen av CMS:et. Oavsett vilket sparar frontend-redigering dussintals klick och minuter av tid vid varje redigering, vilket är särskilt märkbart på webbplatser med frekventa innehållsuppdateringar. Testa det i en testmiljö och avgör hur mycket detta arbetssätt snabbar upp ditt arbetsflöde.