Tema copil WordPress. Cum se creează o temă copil WordPress. Scurte instrucțiuni despre cum să creați o temă copil WordPress

Ce este o temă copil și de ce trebuie să creați una pentru site-urile WordPress? Să ne uităm la aceste aspecte și să ne dăm seama cum se poate face.

Tema copilului(tema copilului) — subiect nou(subtemă) pentru un site WordPress bazat pe cel de bază (părinte). Ea ia totul setări standardșablon din " părintească » subiecte. Această temă are capacitatea de a face orice modificări fără teama de a pierde date în timpul actualizării.

Tema copilului de fapt este o copie a părintelui. Și link-uri către directoarele de date principale design și interfață la fișierele din baza de date a temelor principale (părinte).

Creați teme pentru copii a face oricare schimbari in cod sursă tema de bază. Acest lucru se face pentru a evita resetarea tuturor modificărilor odată cu lansarea actualizării " părintească » șablon.

Cu cuvinte simple, pe site-urile WordPress iesi regulat Actualizări de plugin și teme de bază. Dacă ați făcut modificări la cod sursă tema părintelui(fără a crea un copil), apoi după actualizare - ei va dispărea.

Pentru ce este o temă de copil?

Când am început prima dată să-mi creez blog personal pe WordPress, nu știam încă toate subtilitățile” meşteşuguri ". Si bineinteles, nu a creat tema copilului , și a început să facă toate modificările la codul sursă al părintelui.

Când a apărut actualizarea șablonului meu, toate modificările din cod au fost pur și simplu șterseși am avut din nou un șablon curat. Astfel, am reinstalat manual valorile, faviconul și identificatorii de fiecare dată.

Acest lucru este foarte incomod. Și tocmai din acest motiv, după alegerea unui șablon de bază, nevoie de a crea lui tema copilului. Este important să faceți acest lucru chiar de la început, deoarece motoarele de căutare reacționează negativ la instabilitate în setările sistemului site-uri.

Și din punct de vedere uman, efectuarea din nou a tuturor modificărilor după lansarea actualizării este foarte incomod. Această acțiune trebuie efectuată o dată și uitată pentru totdeauna.

Cum se creează o temă pentru copii în WordPress

Puteți face acest lucru în două moduri:

• Descărcați și activați pluginul corespunzător
• Faceți-o manual prin directorul rădăcină al site-ului

Să ne uităm la fiecare metodă separat.

Crearea unei teme secundare folosind un plugin

Cel mai convenabil și popular plugin pentru a crea " fiicelor „se numește Tema Copilului Configurator.

El este prezent în magazin oficial pluginuri pentru wordpress. Faceți clic pe " Instala". După instalare și activare, accesați „ Instrumente» -> « Teme pentru copii". Accesați setările pluginului.

În meniul plugin veți vedea această fereastră. Trebuie să selectăm primul element din meniul de pornire " CREAȚI o nouă temă pentru copii". Să-l alegem.

După ce ați selectat șablonul părinte, faceți clic pe „ Analiza". În continuare, se vor deschide următoarele elemente.

Pe baza rezultatelor analizei, ar trebui să vedem următorul mesaj: „ Această temă pare OK pentru a fi folosită ca temă Copil". Aceasta înseamnă că pluginul a verificat șablonul nostru pentru capacitatea de a crea „ fiicelor " și a dat aprobarea.

Practic, acesta este tot ce trebuie să configurați în acest plugin pentru a crea o temă copil. Lăsați toate celelalte setări la " asa cum este«.

Singura nuanță dacă ați adăugat deja widget-uri și alte setări din meniul site-ului, puteți verifica al 8-lea element. În acest caz, totul setări vizualeșablonul va fi copiat în tema copil.

Mergeți la al 9-lea punct și faceți clic pe butonul „ Creați o nouă temă pentru copii". Tema copilului dvs. a fost creată și pluginul poate fi șters, deoarece și-a îndeplinit rolul și nu mai este necesar pentru funcționalități ulterioare.

Crearea manuală a unei teme copil

Cel mai bine este să folosiți un plugin, desigur. Dar din moment ce site-ul meu avea destul de multe setări pentru șablon de bază, a trebuit să o fac cu mâna. Deoarece pluginul nu va transfera toate modificările de la șablonul părinte la copil.

Da si pentru înțelegere comună Nu ar strica să vedem cum se face acest lucru manual.

În primul rând, ai nevoie accesați folderul cu site-ul de pe găzduire registratorul dvs.

Mergem la adresa: /www/your-site.ru/wp-content/themes/. Noi creăm folder nou cu titlul " Tema Copilului Meu„(sau orice altul - nu contează). Am primit numele " tema de bază a copilului«.

Acum mergeți la folderul cu tema noastră principală (pentru mine este folderul „ de bază") și copiați fișierul de acolo stil.css.

Inserăm acest dosarîn folderul pentru crearea unei teme secundare.

Acum trebuie să-i faci modificări. Selectați un fișier stil.cssși faceți clic pe " Schimba«.

Acum selectați întregul conținut al fișierului și ștergeți(prin funcția " ctrl + A"). Vom primi fișier curat stil.cssîn care vom fi introduceți codul necesar.

Din moment ce import setările temei de bază, am toate datele indicate pentru acest subiect. Dacă aveți o altă temă, trebuie să introduceți numele acesteia în acest cod.

Să înțelegem fiecare linie de cod.

1. Numele temei: numele temei dvs. în panoul de administrare pentru dvs.
2. Șablon: indicați numele temei părinte.
3. @import url("../theme-name/style.css");— indicăm cu comanda de unde să obținem datele șablonului pentru tema copil (adresa către registru Tema Părinte).
4. .foo (culoare: albastru; )- setare opțională de stil de șablon personalizat pentru „ Tema Copilului«.

/*
Numele temei: numele temei copilului meu
Șablon: numele-temei-voastre
*/

@import URL ("../ numele-temei-voastre/style.css");

Așa va arăta fișierul finalizat stil.css pentru tema copilului:

Lăsați această bucată de cod și faceți clic pe „ Salva". Tema copilului tău este gata.

Cum să activați o temă pentru copii pe WordPress

Ai creat un subiect? Acum trebuie să-l puneți pe site-ul dvs. Cum să faci asta?

Accesați secțiunea " Aspect » -> « Subiecte". Și noi căutăm a noastră fiica „după numele care i-a fost atribuit prin comandă” Numele temei" în dosar stil.css.

Dacă ați instalat tema printr-un plugin, atunci numele acesteia va fi în formatul: „ subiect-copil". Căutați-l după acest nume. Dacă subiectul s-a numit „ douăzeci şi şaptesprezece", atunci tema sa copil (prin plugin) va fi numită: " douăzeci şi şaptesprezece-copil«.

IN " Subiecte„găsim șablonul copilului dvsși selectați butonul „ Activa«.

În ultima fotografie pe care o vedeți două șabloane de bază. Stânga - tema secundară a șablonului ( Tema Copilului ), iar cea potrivită este tema părinte ( Tema Părinte ). „Fiica” adoptă toate setările de design de la părinte prin comandă @import.

Probleme legate de tema copiilor și cum să le rezolvi

Când creați manual o temă copil prin cod, este posibil să întâmpinați o problemă. IN " Editor„va exista un singur fișier cu temă copil” Foaie de stil„în coloana din dreapta” Fișiere tematice«.

La tema părinte în „ Fișiere tematice"va avea multe rânduri, iar copilul va avea doar un fișier" Foi de stil (style.css)". Ce să faci într-o astfel de situație?

Am rezolvat această problemă astfel: Am copiat toate fișierele din folderul cu tema părinte, cu excepția stilului modificat.css, și le-am încărcat în folderul copil.

Prin urmare, aș sugera o modalitate mai simplă de a rezolva această problemă.

Doar copiați întregul conținut al folderului tema părintelui, inserați în folderul pentru tema copilși reconfigurați fișierul stil.css ca în exemplul de mai sus.

Asta este. Apoi toate filele din " Editor» le puteți salva și le puteți face orice modificări dorite.

Concluzie

Crearea unei teme pentru copii este destul de simplă și ar trebui făcută chiar de la începutul vieții site-ului tău WordPress. Cel mai simplu mod este să folosești un plugin după ce creează o temă copil pentru tine, îl poți șterge.

Efectuând un truc atât de simplu, veți uita de alte probleme cu actualizările temei.

Nu știu exact de ce șabloanele pentru site-urile WordPress sunt numite în mod persistent teme, dar tocmai asta dă naștere unei tautologii în introducerea acestui articol: subiectul acestui articol este cum să creezi un copil Tema WordPress. Pentru a spune simplu, cum să vă asigurați că modificările aduse unui șablon de site web nu dispar după fiecare actualizare a șablonului de către autor.

De ce este necesar acest lucru?

De ce este nevoie de o temă copil, am explicat în introducere. Să explic în practică. Nu am folosit de mult timp șabloane în versiunea autorului, schimb constant ceva în fișierul responsabil de design (style.css), elimin link-urile din subsol, schimb introduceri și anunțuri pentru articolele din arhive. Pe scurt, fac modificări în fișierele șablon. De fiecare dată când autorul actualizează șablonul, aș pierde și mi-aș restabili editările dacă nu aș folosi teme secundare.

De remarcat că în ultima perioadă, situația cu pierderea editărilor a devenit oarecum mai simplă. În toate subiecte moderne, există o editare personalizată a fișierului de stil (style.css), care nu se schimbă după actualizarea temei, cu toate acestea, acest lucru nu se rezolvă sarcină comună articole, creați o temă copil WordPress.

Creați manual o temă pentru copii WordPress

• Să presupunem că aveți o temă „tată”, creați o temă copil pentru aceasta;
• Creați un director de teme pentru copii, lăsați-l să fie „fiică”;
• În Notepad++, creați un fișier .css cu următorul conținut:

Rețineți că directiva Template specifică tema părinte și este obligatorie.

Important! Acum, când plasați un fișier în directorul „copil”, acesta înlocuiește un fișier similar în „părinte”. Această regulă NU funcționează pentru fișierul functions.php.

Dar asta nu este tot. Este necesar să transferați stilurile „părinte” la stilurile „fiică”. Acest lucru se face în două moduri:

Metoda 1. Pur și simplu transferați conținutul fișierului de stil (style.css) într-un fișier părinte similar;

Metoda 2. Sau adăugați fișierul style.css al unei fiice rândul următor:

@import url("../tată/stil.css");

Vă rugăm să rețineți: adresa relativa indicând șablonul părinte.

Pluginuri de temă pentru a crea o temă copil

Despre pluginuri pentru crearea unei teme copil, voi spune asta: dacă aveți nevoie de o temă copil, instalați pluginul, creați o „fiică”, ștergeți pluginul și nu vă faceți griji lucrate manual. Funcționarea oricărui plugin enumerat mai jos va dura 10-15 secunde, cu excepția cazului în care creați o temă secundară a unui șablon deja modificat.

Vrăjitorul temei pentru copii

Vă permite să creați o nouă temă copil fără a fi nevoie să o utilizați instrumente suplimentare direct din interfața de administrare WordPress.

Configurator teme pentru copii

https://ru.wordpress.org/plugins/child-theme-configurator/

Un utilitar rapid și ușor de utilizat, care vă permite să analizați orice subiect de lucruși creați o temă copil și personalizați-o. Child Theme Configurator facilitează identificarea și înlocuirea exactă Atributele CSS pe care doriți să le configurați. Analizorul scanează tema furnizată și configurează automat tema copilului.

Copilizează-mă

https://ru.wordpress.org/plugins/childify-me/

Vă permite să creați o temă copil pentru orice tema instalată, direct din panoul Aspect>>>Temă.

Creați o temă secundară a șablonului modificat

Să ne imaginăm o situație: lucrezi cu site-ul tău web și te-ai săturat să editezi constant șablonul după o actualizare. Ce să fac? Trebuie să creați o temă secundară a unui șablon deja modificat. Cum să faci asta?

Opțiunea 1. Instalați pluginul Child Theme Configurator, acesta vă va „lumina” șablonul și va transfera fișierele modificate pe tema copil;

Opțiunea 2. Faceți o „fiică” în modul manualși mai departe: Transferați fișierele modificate din tema părinte în tema secundară.

Toate! Acum lucrați la o temă copil pe care ați modificat-o mai devreme.

Concluzii

Acum știi cum să creezi o temă copil WordPress. Utilizarea acestei funcționalități simplifică lucrul cu șabloane și elimină sarcina de monitorizare a temelor aflate în schimbare constantă. Cu o temă copil, puteți edita șablonul fără teama de a vă pierde corecțiile după actualizare. Întrebări în comentarii.

În unele cazuri, atunci când lucrează pe un site web, clientul cere să nu facă modificări temei originale. Acest lucru este necesar dacă intenționați să îl actualizați în viitor, iar modificările aduse fișierelor vor dispărea.

Pentru cazuri similare WordPress oferă un mecanism pentru a crea o temă copil. Această temă folosește șablonul părinte ca bază și, în același timp, îl puteți adăuga pe al dvs propriile dosare si functii.

Mecanismul de lucru cu teme pentru copii este destul de simplu. În primul rând, trebuie să creați un folder nou în folderul wp-content/themes pentru acesta. Vom presupune că folderul cu șablonul principal se numește părinte și vom crea unul nou, pe care îl vom numi copil.

Trebuie să plasați cel puțin un fișier style.css în folderul copil. Acesta trebuie să conțină următoarele instrucțiuni:

/* Numele temei: Copil Șablon: părinte */

Prima instrucțiune (Numele temei: Copilul) este pur și simplu numele temei copilului, de fapt nu este obligatorie, dar a doua instrucțiune (Șablon: părinte) este obligatorie și indică faptul că acest șablon este un copil al părintelui.

Dacă plasați un fișier în dosar cu o temă copil, acesta îl înlocuiește pe același din șablonul părinte. Această regulă se aplică tuturor fișierelor, cu excepția funcțiilor.php.

@import url("../parent/style.css");

Pentru funcţionare corectă Nu ar trebui să existe reguli CSS înainte de directiva @import.

Nici unul setări suplimentare nu este nevoie să o faci. Uneori conexiune automată stiluri css dintr-un folder copil poate să nu funcționeze. Dezvoltatorul șablonului trebuie să folosească funcțiile:

• get_stylesheet_uri() — adresa fișierului de stiluri;
• get_stylesheet_directory_uri() — adresa folderului cu stiluri,

dar poate include style.css într-un alt mod, ceea ce duce la probleme. În acest caz, cel mai probabil nu va fi dificil să priviți codul și să găsiți problema.

Mai multe detalii despre fișierul functions.php. Dacă tema copil are un astfel de fișier, motorul îl va încărca mai întâi și apoi fișierul cu acest nume din folderul părinte. În acest fel, puteți extinde liber funcționalitatea șablonului.

Toate celelalte fișiere aflate în folderul copil, așa cum sa menționat deja, își înlocuiesc omologii din tema părinte. Adică, puteți lua single.php original, îl puteți modifica și îl puteți plasa într-un folder copil. Când rulați motorul WordPress, acesta va fi folosit.

Beneficiile utilizării unei teme pentru copii sunt clare: păstrați intactă tema originală și o puteți actualiza liber. Nu există dezavantaje deosebite, cu excepția cazului în care dezvoltatorul a făcut greșeli în șablonul original care au făcut dificilă utilizarea.

Structura folderului din tema copil trebuie să se potrivească cu structura părinte dacă modificați fișiere din subdosare.

Temele pentru copii din WordPress vă permit să faceți modificări subiecte existente, și în așa fel încât astfel de modificări să nu se piardă la actualizarea temei originale (sau părinte). Pe lângă aspect, temele copil vă permit să schimbați marcajul și chiar funcționalitatea temei părinte, extinzându-l pentru a se potrivi propriilor nevoi.

Suportul pentru temele pentru copii în WordPress a apărut cu mult timp în urmă, dar majoritatea utilizatorilor de astăzi preferă să facă modificări direct codului temei sursă. În acest articol, vom aborda modul în care funcționează temele copil în WordPress și de ce ar trebui folosite temele copil atunci când faceți modificări la temele existente.

Ce este o temă de copil

O temă copil în WordPress este o temă care moștenește aspectul și toată funcționalitatea temei părinte (originale). Această moștenire face ușor de schimbat și completat zone separate tema părinte fără a modifica tema originală în sine. Datorită acestei abordări, actualizarea temei părinte nu va afecta astfel de modificări.

Tema părinte poate fi orice altă temă WordPress (cu excepția temelor copil), iar pentru ca tema copil să funcționeze, ambele teme trebuie instalate, dar trebuie activată cea copil.

Cum se creează o temă pentru copil

Cea mai simplă temă copil constă dintr-un singur fișier style.css, care specifică numele temei copil și numele directorului care conține tema părinte. Același fișier conține adesea un link către foaia de stil a temei părinte cu folosind CSS directive @import.

De exemplu, vom crea o temă copil, Tema Copilul meu, și vom folosi tema Twenty Twelve implicită ca temă părinte.

În primul rând, asigurați-vă că tema părinte există - găsiți directorul twentytwelve în wp-content/themes. Apoi creați un director nou în wp-content/themes și numiți-l my-child-theme . În acest director nou, creați un fișier style.css și inserați următorul antet în el:

/** * Numele temei: Tema copilului meu * Șablon: twentytwelve */ @import url("../twentytwelve/style.css");

Folosind acest antet, am determinat numele noului nostru subiect și l-am indicat și pe cel părinte. directiva @import în acest caz,încarcă toate stilurile din tema Twenty Twelve, pe deasupra cărora ne vom face modificările. Fără această directivă, tema noastră copil va moșteni doar șabloanele (markup) ale temei părinte, și nu stilul.

După aceasta, directorul de teme ar trebui să arate cam așa:

Accesând Aspect → Teme, veți vedea că noua dvs. temă este deja disponibilă pentru activare.

Dacă îl activezi și mergi la pagina de start a site-ului dvs., veți vedea că tema copilului dvs. arată exact ca tema standard Douăzeci și doisprezece.

Lucrul cu stiluri

Stilurile CSS ale temelor secundare pot fi setate direct în fișierul style.css imediat după directiva @import. De exemplu, pentru a seta culoarea de fundal și culoarea linkului în tema dvs., adăugați următorul cod la sfârșitul foii de stil:

Corp ( fundal: roșu; ) a ( culoare: verde; )

În acest fel, puteți schimba stilurile oricăror elemente ale temei părinte și puteți găsi cu ușurință elementul necesar folosind instrumentele de dezvoltare din browser Google Chrome sau folosind extensia Firebug pentru browserul Firefox.

Lucrul cu șabloane

Cu o temă copil, puteți schimba cu ușurință șabloanele temei părinte. Pentru a face acest lucru, trebuie doar să creați un fișier în tema copil cu același nume ca șablonul din tema părinte. De exemplu, pentru a înlocui șablonul footer.php cu al dvs., creați un fișier footer.php în directorul cu tema copilului: