Blockteman och Webbplatsredigeraren förklarade

Kort svar: Ett blocktema är ett WordPress-tema där hela sajten, inte bara innehållet, är byggd av block. Sidhuvud, sidfot, bloggarkiv och enskilda sidor är mallar som du redigerar visuellt i Webbplatsredigeraren (Utseende → Redigerare), med samma block som när du skriver ett inlägg. Ett klassiskt tema har i stället sina mallar i PHP-kod och anpassas via temats egna inställningar.

Webbplatsredigeraren i WordPress 7.1

Med ett blocktema aktiverat hittar du redigeraren under Utseende → Redigerare. Till vänster finns sex delar:

Del	Vad du gör där
Identitet	Webbplatsens namn, slogan och logotyp
Stilar	Färger, typsnitt och avstånd för hela sajten
Sidor	Redigera sidor direkt i sitt sammanhang
Navigation	Menyerna
Mönster	Färdiga block­kombinationer, och dina egna synkroniserade mönster
Mallar	Mallarna som styr hur olika typer av sidor ser ut, och malldelar som sidhuvud och sidfot

Klickar du på förhandsvisningen till höger redigerar du den mall som visas, med samma blockredigerare som för inlägg.

Stilar: utseendet för hela sajten

Under Stilar ändrar du utseendet på ett ställe, och det slår igenom överallt:

• Bläddra bland stilar: färdiga stilvariationer från temat. Twenty Twenty-Five har flera, med olika färger och typsnitt.
• Typografi, Färger, Bakgrund, Skuggor och Layout: grundinställningarna för hela sajten.
• Block: standardutseendet för en viss blocktyp, till exempel alla knappar eller alla citat.

Sedan WordPress 7.1 kan du dessutom ställa in olika stilar för mobil, surfplatta och dator utan att skriva CSS, och ge knappar egna stilar när muspekaren är över dem. Mer om det i WordPress 7.1: nyheterna.

Mallar och malldelar

En mall bestämmer hur en viss typ av sida ser ut. Blockteman har vanligtvis mallar som:

• Index: reservmallen som används när inget annat passar
• Blogg hem, Enskilda inlägg och Sidor
• Alla arkiv och Sökresultat
• Sida: 404: sidan som visas när något inte finns

Namnen ovan är från Twenty Twenty-Five på svenska. Andra teman kan ha fler eller färre mallar.

En malldel är en återanvändbar bit, framför allt sidhuvudet och sidfoten. Ändrar du sidhuvudet en gång ändras det i alla mallar som använder det.

Byggstenen för listor av inlägg är blocket Frågeloop (Query Loop). Det hämtar inlägg efter de villkor du väljer, till exempel de sex senaste i en viss kategori, och visar dem med den layout du bygger. Med Frågeloop och några mönster kan du bygga en magasinsliknande startsida utan ett tungt magasinstema.

Var sparas ändringarna?

När du ändrar något i Webbplatsredigeraren sparas ändringen i databasen, inte i temats filer. Det betyder:

• Ändringarna ligger kvar när temat uppdateras.
• Du kan återställa en mall till temats original om du ångrar dig.
• Byter du till ett annat tema följer dina malländringar inte med. De hör till det tema du gjorde dem i.

Blocktema eller klassiskt: skillnaderna

	Blocktema	Klassiskt tema
Sidhuvud, sidfot, mallar	Redigeras visuellt i Webbplatsredigeraren	Styrs av PHP-mallar och temainställningar
Utseende	Stilar (bygger på theme.json)	Anpassa (Customizer) och temats egna paneler
Menyer	Navigationsblocket	Utseende → Menyer
Widgetar	Block direkt i mallarna	Widgetområden under Utseende → Widgetar
Responsiva stilar utan CSS (7.1)	Ja	Begränsat
Vanligt i dag	Standardtemana och nya teman	Många populära teman som Astra och GeneratePress

För utvecklare: theme.json

Under huven styrs ett blocktema av filen theme.json i temats rot. Där anges vilka färger, typsnitt och storlekar som finns att välja, vilka inställningar användaren får ändra och sajtens standardstilar. Allt du ändrar under Stilar i redigeraren är i praktiken lager ovanpå temats theme.json.

Ett minimalt blocktema består av tre delar: style.css med temats namn, theme.json och en mall i mappen templates/, som minst templates/index.html. Mallarna är HTML-filer med blockmarkering.

Sedan WordPress 7.1 kan teman definiera egna brytpunkter för mobil och surfplatta i theme.json, och stilar för tillstånd som hover och focus.

Vill du göra egna ändringar i ett befintligt blocktema i kod, utan att de skrivs över vid uppdatering, behöver du ett barntema (child theme).