Skapa ett child-tema till wordpress

WordPress, världens mest använda ramverk för hemsidor just nu, hela 25% av alla världens hemsidor bygger på WordPress enligt en undersökning hösten 2015.

Varför är då WordPress så bra? Det är enkelt att svara på:

• Det finns ett plugin för allt du kan tänkas behöva.
• Det finns mängder med teman, både gratis och betalalternativ, för alla typer av designer.
• Det finns tusentals utvecklare som arbetar med uppdateringar.
• Det är enkelt att installera och komma igång med.

Detta visar bara några av fördelarna med WordPress, naturligtvis finns det en hel del nackdelar:

• Det är utsatt för hackning, ju fler användare, desto mer attraktivt blir det för hackaren.
• Det är lätt att man installerar ’för många plugins’, det blir då en säkerhetsrisk och kan upplevas lite slött.

Jag kommer inte att lista alla detaljer i detta inlägg men om ni tittar runt lite på denna sida kommer ni hitta mycket mer information om just WordPress. Detta inlägg skulle ju handla om ”child-teman”.

Vad är ett ”child-tema”?

Man skulle kunna kalla ett child-tema en ”utökad version av ditt befintliga tema”. WordPress-teamet och alla team som utvecklar skickar ofta ut uppdateringar. Det är bra eftersom de ofta täpper till säkerhetshål och lägger till nya funktioner för er som användare.

Men ibland vill man göra lite egna saker på sin sida, kanske lite egen CSS-kod, kanske lägga till en egen funktion eller något liknande. När det då kommer en uppdatering kan dessa filer skrivas över.

Jag har många gånger träffat på kunder som inte kan uppdatera sin sida eftersom de har för mycket ”special-lösningar” inbyggt, jag har träffat folk som uppdaterat sin sida och stora delar av den slutat att fungera.

Så kan man ju inte ha det!

När man installerat sin sajt och hittat det tema man tycker att man ska använda bör man därför kontrollera om det finns ett så kallat ”child-tema”, om inte så får man skapa ett. Hur man gör det tänkte jag visa nu.

Just i denna guide kommer jag att använda mig av ett av världens mest använda teman just nu, det heter ”Enfold” och är skapat av Kriesi.at. Temat finns att köpa på Themeforest och kostar i skrivande stund ca: 477 kronor ($59).

Du kan naturligtvis använda vilket tema du vill i denna guide, den enda anledningen att jag valt just detta tema är att jag fick frågan om att skapa ett till Enfold.

Upplägget är enkelt:

1. Vi skapar en mapp.
2. Vi skapar de filer som krävs.
3. Vi är klara.

Börja med att öppna mappen {din-hemkatalog}/wp-content/themes/ på din hemsida. Där hittar du minst ett tema, (en bra idé är att ta bort alla teman som du inte använder), och skapar en ny mapp med samma namn som det tema du vill använda, följt av ”-child”. I mitt exempel blir det med andra ord en mapp som heter ”enfold-child”.

Nu behöver vi bara skapa två filer för att hela grunden ska vara klar:

1. style.css
2. functions.php

För att WordPress ska veta att allt är okej måste vi dock skriva in lite kod i dessa filer. (Koden hittar du längst ner på denna sida.)

När du skapat dessa två filer och laddat upp i mappen ”temanamn-child” loggar du in på administrationen på din WordPress-sida och välja temat ”Temanamn Child”.

Observera att du inte kan ta bort ”moder-temat”, detta måste finnas kvar, det är nämligen det som uppdateras sedan.

I filen ”style.css” kan du ändra just css-kod för temat och i filen ”functions.php” kan du lägga till nya funktioner. Ofta vill man åsidosätta vissa inbyggda funktioner eller css-taggar, då är detta perfekt för det.

Nedan ser ni koden för de två filerna. (Denna kod måste vara med, annars fungerar inte temat.)

/*
Theme Name: Enfold Barn-tema
Description: Ett barn-tema för Enfold. Använd detta om du vill ändra funktioner och CSS för Enfold.
Version: 1.0
Author: Daniel Wiberg
Author URI: https://www.danielwiberg.se
Template: enfold
*/

Naturligtvis kan du ändra mitt namn om du vill, men länka gärna till mig om du använder koden.

<?php
/*
* Spara egna funktioner i denna filen
*/

Sedan kan du ladda upp en fil i mappen ”enfold-child”, denna fil ska ha namnet ”screenshot.png”. På så sätt får du en bild som visas när du klicar på länken ”Utseende”. Detta är den jag har:

Lycka till och ställ gärna frågor om ni har några.