Skapa ett Barntema / Child theme – WordPress

För att du ska kunna göra ändringar säkert i ditt Tema med CSS-kod, behöver du skapa ett Barntema. Varför då?

  • Ändringar som görs i originalfilen (style.css) kommer att skrivas över vid uppdateringar av Temat.
  • Du har full överblick över din CSS-kod när allt är samlat på ett och samma ställe.

Hur gör jag ett Barntema  / Child theme?

Skapa en ny mapp som du döper till t.ex. ”namnetpåtemat_child”. I denna mapp sparar du en kopia på originaltemats style.css. Öppna den nya filen och se till att den endast innehåller:

/*

Theme Name:
Description:
Author:
Author URI:
Template:
Version:

*/

Nu fyller vi på med följande uppgifter:

/*

Theme Name: (Namnet på ditt nya Barntema/Child Theme)
Description: (Beskrivning av ditt Barntema)
Author: (Barntemast skapare)
Author URI: (Skaparens hemsideadress)
Template: (originaltemats exakta namn!)
Version: (Vilken version av Barntemat)

*/

OBS! Det enda som är obligatoriska uppgifter är:

Theme Name: (det namn som kommer att synas i WordPress administrationen)

Template: (Här måste du skriva det exakta namnet på originaltemat som du gör ett Barntema till)

Det sista som vi lägger till är ett anrop som hämtar all CSS från originalfilen style.css. Det är i Barntemat som du sedan ändrar eller lägger till regler för ny CSS.

@import url(”../(exakt namn på originaltemat)/style.css”);

 

Här följer ett exempel på Barntema för Twenty Seventeen:

/*

Theme Name: twentyseventeen_child
Description: Barntema på Twenty Seventeen
Author:
Author URI:
Template: twentyseventeen
Version:

*/

@import url(”../twentyseventeen/style.css”); 

(Här under lägger du all ny CSS-kod)

 

Lägga till en bild för Temat

Om du vill ha en bild på ditt Barntema/Child theme i WordPress administrationen under Utseende > Teman :

Skapa en valfri bild (ca 1200×900). Döp den till: screenshot.png. Ladda upp den till ditt Barntemas mapp: Twenty Seventeen_child.

När du valt ditt nya Barntema, i Utseende > Teman, kan du uppdatera säkert framöver.

Click here to add a comment

Leave a comment: