Hur man skapar och anpassar ett barntema på WordPress

Vad är ett barntema och varför är det så viktigt?

I det här inlägget kommer vi att ge dig svar på dessa frågor och visa dig steg för steg hur du skapar och anpassar ditt eget barntema med plugins eller kod.

Om du vill göra ändringar i temat på din WordPress-webbplats,du har förmodligen sett att folk berätta att använda ett barntema.

Men vad är ett barntema, och varför är barntema så viktiga?

I det här inlägget kommer vi att ge dig svar på dessa frågor tillsammans med en introduktion till barntema och hur de är perfekta för dig.

Sedan visar vi dig steg för steg hur du skapar och anpassar ditt eget barntema med plugins eller kod.

Men om du aldrig har installerat WordPress, upptäck Hur man installerar en Wordpress-blogg 7 steg et Hur man hittar, installera och aktivera en Wordpress tema på din blogg

Och låt oss komma tillbaka till det vi är här för.

Vad är ett WordPress-tema för barn?

Ett barntema är inte ett fristående tema. Det är ett "barn" av ett befintligt föräldertema, därav namnet.

Du installerar det tillsammans med ditt överordnade tema, men det ger dig en chans att säkert göra ändringar i ditt överordnade tema utan att behöva redigera själva överordnade temat.

Barnetema får de flesta / alla dess designinställningar från föräldertema. Men i situationer där du ändrar underordnatema kommer denna ändring att åsidosätta inställningarna för föräldertema.

Fördelarna med ett barntema

Just nu undrar du: varför kan du inte bara göra dina ändringar direkt till föräldertema?

Det främsta skälet till att det inte är en bra idé är Uppdateringar av WordPress-teman.

Om du vill hålla din WordPress-webbplats säker och fungera måste du snabbt tillämpa uppdateringar när de kommer ut, inklusive uppdateringar av ditt WordPress-tema.

Om du anpassar din webbplats genom att ändra ditt tema direkt (inget barntema), vilket innebär att du kommer att skriva över alla dina ändringar varje gång du uppdaterar WordPress-temat.

Detta betyder att du:

Uppdatera ditt WordPress-tema och tappa jobbet. Inte en väldigt rolig upplevelse, eller hur?
Uppdatera inte ditt WordPress-tema för att inte förlora ditt arbete ... vilket inte är bra för säkerheten och driften av din WordPress-webbplats.

Med ett barntema kan du göra alla dina ändringar i barntemat. Då kommer du att kunna uppdatera överordnade temat utan att förlora något av ditt arbete.

Utöver att hjälpa dig att uppdatera på ett säkert sätt, är det vanligtvis praktiskt att använda ett barn-tema för anpassningar. Eftersom det skiljer alla dina ändringar på ett ställe är det enkelt att spåra alla dina ändringar och ändra dem efter behov.

Det är också lätt att gå upp och ner. Om du till exempel vill sluta använda dina ändringar och återgå till överordnade temat, avaktivera bara underordnatema.

några WordPress-teman använd till och med den här standardmetoden för förälder/barn. Om du till exempel vill använda Genesis-ramverket behöver du både det överordnade temat (basramverket) och ett underordnat tema för att styra designen.

När man ska använda ett barntema

Förutom några få undantag som vi listar nedan måste du toujours använd ett barntema om du planerar att göra dina egna ändringar av ett befintligt WordPress-tema.

När du inte behöver använda ett barntema

Generellt sett är det bra att använda ett barntema när du anpassar ditt WordPress-tema.

Det finns dock några undantag från regeln där det kan finnas ett bättre alternativ än att använda ett barntema.

Först och främst, om du bara vill göra några mindre CSS-tweaking, kan det vara överdrivet att skapa ett barntema bara för några tweaks.

Istället kan du lägga till din anpassade CSS med funktionen Ytterligare CSS integrerad i WordPress Customizer. Eller så kan du använda ett gratis WordPress-plugin som Simple CSS.

För det andra, om du gör några ändringar som du vill vara oberoende av teman, är ett barntema kanske inte det bästa alternativet.

Om du till exempel registrerar en anpassad taxonomi eller en anpassad inläggstyp, vill du förmodligen inte använda filen functions.php av ditt barntema (eftersom du vill behålla dem även om du ändrar temat). Istället bör du bara lägga till koden utanför ditt tema med ett plugin som t.ex. Kod Snippets eller din egen anpassade plugin.

Hur man skapar ett barntema på Wordpress

Nu när du vet varför barntema är viktiga, låt oss undersöka hur du faktiskt kan skapa ett barntema för din WordPress-webbplats.

Först om du använder Hej Elementor tema, vi har redan skapat ett barntema åt dig - du behöver inte göra det själv. Du kan ta tag i Hello Elementor-temat från WordPress.org. Du kan installera det som alla andra WordPress-teman (vi visar också hur du installerar ett barntema senare i det här inlägget).

Om du använder ett annat WordPress-tema är det alltid värt att ta en snabb titt på Google för att se om din WordPress-temautvecklare tillhandahåller ett barntema. Till exempel har Astra, GeneratePress och OceanWP alla verktyg / filer som hjälper dig att ladda ner ett barntema.

Om ditt WordPress-tema inte redan har ett barntema kan du skapa ett barntema för alla WordPress-teman:

Använd Wordpress plugin gratis temagenerator för barn.
Skapa ett eget barnstem manuellt.

Vi visar dig hur du utför båda metoderna.

Hur man använder ett WordPress-plugin för ett barntema

Ett plugin för ett barntema-generator låter dig skapa ett barntema utan att lämna din WordPress-instrumentbräda.

Det mest populära alternativet här är gratis plug-in-programmet för barntema, som är aktivt på över 300.000 XNUMX webbplatser.

Child Theme Configurator hjälper dig inte bara att skapa tematecknen för barnen, utan kommer också att analysera temat du använder och temat och typsnitt för typsnitt efter behov.

Det innehåller också andra användbara funktioner om du försöker skapa ett barntema på en webbplats där du redan har lagt till innehåll. Till exempel kan den kopiera dina befintliga widgetar och anpassningsalternativ till underordnatema.

Men om du planerar att använda plugin på en webbplatsopérationnel, rekommenderar vi att du gör en fullständig säkerhetskopia innan du fortsätter. Eller helst, konfigurera allt på en demo-webbplats.

När du har säkerhetskopierad, börja med att installera och aktivera det gratis Child Theme Configurator-plugin från WordPress.org. Gå sedan till menyn Verktyg → Barn teman för att skapa ditt barntema.

I listan Välj en rullgardinsmeny föräldertema, välj det tema du vill skapa ditt barntema för. Klicka sedan på Analysera:

Plugin kommer sedan att analysera överordnad tema för alla beroenden.

När du är klar ser du några fler alternativ för att konfigurera hur du skapar ditt barntema. Om du inte är säker på vad en specifik inställning betyder kan du bara lämna den som standard:

När du är klar med att göra dina val klickar du på knappen längst ner till skapa en nytt barn tema.

Och det är allt ! Plugin skapar sedan barntema för dig. Den kommer dock inte att aktiveras pas detta barn tema.

Så här aktiverar du:

Gå till Utseende → Teman.
Förhandsgranska hur din webbplats ser ut med detta barntema (för att se till att det fungerar - om din webbplats ser udda ut är det antagligen på grund av ett CSS-problem).
Aktivera ditt barntema som du skulle göra med något annat WordPress-tema. Se till att lämna ditt överordnade tema dock installerat.

När du har aktiverat ditt barntema erbjuder plugin-programmet Child Theme Configurator också andra användbara verktyg som hjälper dig att hantera barnets tema. Om du till exempel går till fliken Filer från plugin-inställningar kan du visa alla relaterade filer i överordnat tema och underordnatema.

Sedan kan du kopiera filer från föräldertema till underordnatema.

Om du till exempel vill göra några ändringar single.php, kan du kopiera den här filen till underordnatema så att du säkert kan redigera den:

Du hittar också många andra verktyg som hjälper dig att arbeta med CSS.

Vi kommer att förklara varför dessa verktyg är användbara senare.

Hur man manuellt skapar ett barntema

För det här avsnittet antar vi att du vet lite mer om PHP och CSS. Om du känner dig överväldigad av instruktionerna här rekommenderar vi att du använder gratisplugin från föregående avsnitt.

För att manuellt skapa ett barn-tema måste du skapa två filer (det här är de strikta minimikraven för ett barn-tema):

style.css - till att börja med allt du behöver lägga till är kokplattkoden.

functions.php - detta låter dig ladda stilmallen för överordnad tema. Utan det skulle ditt barntema inte kunna använda CSS från ditt föräldertema, vilket gör din webbplats super ful!

style.css

Skapa först en fil med namnet style.css och lägg till följande kod:

/*

Tema Namn: Hej Elementor Child

Tema URI: https://github.com/elementor/hello-theme/

Beskrivning: Hello Elementor Child är ett barntema för Hello Elementor, skapat av Elementor-teamet

Författare: Elementor Team

Författare URI: https://elementor.com/

Mall: hej-elementor

Version: 1.0.1

Textdomän: hej-elementor-barn

Licens: GNU General Public License v3 eller senare.

Licens URI: https://www.gnu.org/licenses/gpl-3.0.html

*/

Se till att ersätta allt som kommer efter kolon med din faktiska information:

Teman namn - namnet på ditt barntema.

URI-tema - webbplatsen för ditt tema och dess dokumentation.

Beskrivning - en kort beskrivning av temat.

Författare - namnet på författaren till temat.

Författare URI: - tematförfattarens webbplats.

Mall - namn på din överordnade temamapp (som anges i mappen wp-content / teman). Detta är den viktigaste linjen; ditt barntema fungerar inte utan det.

version - version nummer för ditt barn tema.

Textfält - detta används för internationalisering. Du kan bara lägga till "barn" i slutet av mallnamnet.

Licens - lämna detta som standard.

URI-licens - lämna detta som standard.

Utesluter raden mall, det spelar ingen roll vad du anger, så stress inte för mycket. Se bara till att du matar in ditt föräldertemas mappnamn korrekt för mall.

Om du vill lägga till dina egna anpassade stilar i framtiden kan du lägga till det i det här formatmallen under kokplattkoden.

functions.php

Sedan måste du skapa filen functions.php för ditt barntema. Återigen är det detta som låter dig ladda ditt överordnade temas hela CSS-formatmall.

I filen funktioner.php, lägg till följande kod:



/ * Funktion för att ställa in stilark från föräldertema * /

funktion child_enqueue__parent_scripts () {
wp_enqueue_style ('förälder', get_template_directory_uri (). '/ style.css');
}
add_action ('wp_enqueue_scripts', 'child_enqueue__parent_scripts');

Ladda upp filer till WordPress-webbplatsen

När du har dina filer style.css et functions.php, måste du ladda upp dem till din WordPress-webbplats som ett nytt tema.

För att göra detta, anslut till din WordPress-webbplats med FTP.

Gå sedan till temakatalogen på din webbplats (wp-innehåll / teman)och skapa en ny mapp för ditt barntema.

Om till exempel mappen för ditt föräldertema är hej-elementor, kan du namnge mapp för barntema hello-eletor-barn för att hjälpa dig komma ihåg det.

Ladda sedan upp din fil style.css et functions.php inuti den här mappen:

När du har laddat ner båda filerna kan du gå till Utseende → Teman och aktivera ditt barntema som du skulle göra med något annat WordPress-tema.

Hur man installerar ett WordPress-tema för barn

Vi har behandlat några av dessa aspekter ovan i de specifika metoderna, men vi ska gå igenom hur du installerar ett WordPress-barntema ännu en gång.

Det kommer också att vara användbart om du laddade ner ett underordnat tema från din temas utvecklare webbplats, snarare än att skapa det själv.

Du kan installera ett WordPress-barntema precis som du skulle göra med något annat WordPress-tema:

Tillgång till Utseende → Teman i din WordPress dashboard.
Klicka på Lägg till ny.
Ladda upp ZIP-filen för barnets tema.

Under installationsprocessen upptäcker WordPress att du laddar ner ett barntema och verifierar att överordnade temat finns:

När du har laddat ner filen måste du göra det aktivera den.

Kom ihåg att ditt barntema ska fungera måste du installera på den gångenföräldertema och barntema.

Ditt barntema bör vara ditt aktiva tema, men du bör fortfarande ha ditt föräldertema installerat.

Så här ska det se ut:

Barnetema är det aktiva temat
Det överordnade temat är fortfarande installerat, men inte aktivt

Hur du anpassar ett barntema

Precis som med anpassningen av ett vanligt WordPress-tema har du flera alternativ att "anpassa" ett barntema.

För att vara mer exakt är du det inte riktigt anpassa barnet tema - du använder barnet tema för att anpassa det befintliga (överordnade) temat.

Först visar vi dig några sätt du kan använda koden för att anpassa ditt barntema. Därefter delar vi ett enklare sätt att anpassa saker till Elementor Theme Builder.

Anpassa ett barntema med kod

Om du vill anpassa ditt barntema med kod måste du ha god kunskap om CSS, HTML och PHP.

Här är några av de saker du kan göra:

Lägg till anpassad CSS

För att anpassa ditt barns tema med CSS kan du lägga till det direkt i filen style.css av ditt barntema.

Lägg till CSS under den befintliga koden längst upp i filen.

Alla CSS som du lägger till i ditt barntema kommer att ersätta det för ditt föräldertema så länge du använder samma väljare.

Byt ut befintliga mallar

Om du vill ersätta mallarna för ditt överordnade tema kan du:

Kopiera mallfilen från ditt överordnade tema till underordnatema.
Redigera mallfilen i ditt barntema.

Om du till exempel vill ändra singel.php, kopierar du filen först single.php från ditt föräldertema till barntema (se till att behålla samma struktur).

Sedan kan du redigera koden i ditt barn-temaversion av single.php.

Notera: WordPress kommer att använda ditt barntema mall så länge den har samma namn. På grund av detta döljer du ganska mycket den befintliga mallen i föräldertema.

Om du använder Child Theme Configurator-plugin som vi nämnde ovan kan det hjälpa dig att kopiera filer till underordnatema utan att lämna din WordPress-instrumentpanel.

Lägg till nya mallar

Förutom att kopiera och ändra befintliga mallar från ditt överordnade tema kan du också skapa nya anpassade mallar i underordnatema.

Om du till exempel vill skapa en mall för en anpassad inläggstyp som du har lagt till kan du lägga till mallarna i ditt barns tema.

Anpassa ett barntema med Elementor-temagenerator

Om du inte är bekant, Elementor Theme Builderlåter dig anpassa en del av eller hela ditt WordPress-tema med ett visuellt gränssnitt.

Med Elementor Pro och Theme Builder kan du skapa anpassade mallar för dina webbplatsmallar:

Header
sidfot
Singel (t.ex. ett enda blogginlägg eller en sida)
Arkiv (t.ex. sidan som visar alla dina blogginlägg)

Dessa mallar fungerar med både barntema och föräldertema.

Med Elementor Theme Builder behöver du inte arbeta med kod direkt. Det finns inget att lägga till anpassad CSS eller kopiera dina PHP-mallfiler - du gör allt med dra och släpp.

Anta till exempel att du vill anpassa rubriken för ditt barntema. Istället för att behöva kopiera din fil header.php på ditt barntema och sedan ändra PHP, kan du bara designa en ny rubrik med Elementors visuella och dra och släpp-gränssnitt. Sedan kan du tillämpa denna rubrik var som helst på din webbplats eller bara specifika delar av din webbplats.

Om du är nybörjare i CSS, HTML och PHP kan du anpassa ditt barns tema med denna kodfria metod. Och även om du gör det kan det här visuella tillvägagångssättet fortfarande spara mycket tid än med PHP i dina mallfiler.

När du skapar en ny mall med Elementor Theme Builder kan du välja malltyp. Till exempel en rubrik.

Sedan kan du antingen starta från en tom skiffer eller välja en av Elementor Pro-modellerna:

Därifrån kan du använda sidfältet för att dra och släppa alternativ för att kontrollera utseendet på din rubrik:

När du är klar kan du välja exakt var du vill använda denna rubrikmall:

Hur man tar bort ett barntema på Wordpress

Om du vill sluta använda ditt barntema kan du stänga av det precis som med ett vanligt WordPress-tema.

Detta är :

Gå till Utseende → Teman.
Aktivera ett annat tema. Antingen överordnat tema eller ett helt nytt WordPress-tema.

Kom ihåg att om du stänger av barnet-temat och växlar tillbaka till ditt föräldertema kommer alla ändringar du lagt till genom ditt barntema inte längre att finnas där.

Istället kommer du tillbaka till att utforma ditt överordnade tema.

Börja använda ett WordPress-barntema

Ett barntema hjälper dig säkert att göra ändringar i ditt WordPress-tema.

Ditt barntema kommer att ärva alla dess stilar från ditt föräldertema, men alla ändringar du gör i underordnatema kommer att åsidosätta överordnade temat. Detta innebär att du säkert kan uppdatera ditt överordnade tema utan att förlora några ändringar du gjort i underordnatema.

För att komma igång med ett WordPress-barntema kan du:

Kontrollera om din temautvecklare redan erbjuder ett barntema. Om du använder Hello Elementor kan du göra det ladda ner ett barntema för det från GitHub.
Använd gratis plug-in-programmet för barntema.
Skapa ditt barnstem manuellt.

Därifrån kan du anpassa ditt barntema med CSS, HTML och PHP. Du kan också hoppa över koden och använda Elementor Theme Builder för att anpassa ditt tema med ett visuellt dra och släpp-gränssnitt.

Upptäck också några teman och premium WordPress-plugins

Du kan använda andra Wordpress plugins för att ge ett modernt utseende och för att optimera hanteringen av din blogg eller hemsida.

Vi erbjuder dig här några premium WordPress-plugins som hjälper dig att göra det.

1. AP-prissättningstabeller

AP-pristabell är en Wordpress plugin premium som gör det enkelt att skapa funktionsrika prislistor med intuitiva gränssnitt. Den erbjuder 35 fördefinierade mallar och ett obegränsat antal alternativ.

med denna Wordpress plugin lätt att använda, att designa en fantastisk pristabell med bara några få klick kommer att vara mycket enkelt. Det låter dig skapa obegränsade prisraster genom att ge möjligheten att lägga till rader och kolumner, ställa in kolumnkant, kolumnutrymme, kolumnbredd och mycket mer.

Läs också Hur man anpassar WooCommerce-knappen "Lägg i kundvagn"

Detta plugin tillåter dig också lägg till ljudinnehåll, video och Google Map.

Ladda ner| demo | webbhotell

2.wp Sidbyggare

WordPress Page Builder är den ultimata byggaren för din WordPress-webbplats som levereras med fantastiska verktyg för att generera alla anpassade inlägg, anpassad taxonomi eller anpassad metabox.

Som funktioner har den bland annat: en anpassad inläggstypCPT, en personlig taxonomi, avancerade anpassade fält, dra-och-släpp-funktionalitet, stöd för Google Map-plats, stödda repeterbara fält samt och mycket mer.

Ladda ner | demo | webbhotell

3. Rankie

Rankie är en mycket praktisk WordPress-modul som är utformad för att regelbundet kontrollera WordPress-rankningar på Google och noggrant övervaka positionen för varje sökord.

Som ett spårningsplugin kommer Rankie att uppdatera nyckelordspositionering varje dag och generera exakta rapporter.

Läs också vår 6 vanliga frågor relaterade till SEO och omdirigeringar

Det innehåller också ett kraftfullt forskningsverktyg som genererar värdefulla nyckelordslistor. Google använder det redan för forskning.

Ladda ner | demo | webbhotell

Rekommenderade resurser

Ta reda på om andra rekommenderade resurser som hjälper dig att bygga och hantera din webbplats.

Slutsats

Här! Det är det för denna handledning. Har du fortfarande frågor om nyttan av ett barns tema på WordPress? Låt oss veta i kommentar avsnitt och vi kommer att försöka hjälpa!

Du kommer dock också att kunna konsultera vår medel, om du behöver fler element för att genomföra dina projekt för att skapa webbplatser, genom att konsultera vår guide om WordPress blogg skapande.

Tveka inte att dela med dina vänner på dina favorit sociala nätverk.