Ghidul tău suprem pentru lucrul cu teme WordPress pentru copii

Dacă doriți să personalizați temele pe care le cumpărați de la noi de la HeroThemes, poate dacă construiți site-uri web pentru dvs. sau clienții dvs. folosind un design la comandă, atunci veți avea nevoie să puteți valorifica puterea temelor pentru copii WordPress.

Cel mai elementar, folosirea temelor copil te va face mai eficient – ​​păstrarea codului pe care îl folosești pentru fiecare proiect în propria temă părinte sau utilizarea unei teme părinte disponibile ca una dintre noi, va însemna că aderați la Principiile DRY (Do Not Repeat Yourself).

Dar luate mai departe, puteți utiliza teme pentru copii și părinte pentru a crea rețele de site-uri cu o bază de cod de bază, puteți construi teme personalizate bazate pe cadre de teme ale unor terțe părți sau puteți chiar să vă creați propria temă părinte avansată pentru a fi utilizată ca cadru temă. . În acest articol vă voi oferi o privire de ansamblu rapidă asupra elementelor esențiale ale temelor pentru copii și apoi vă voi arăta câteva tehnici mai avansate. Veți învăța:

• cum să utilizați o temă copil pentru a adapta o temă părinte terță parte sau un cadru de temă la nevoile proiectului dvs
• modul în care WordPress prioritizează fișierele șablon în fiecare dintre temele părinte și copil
• cum să suprascrieți funcțiile temei părinte în fișierul de funcții al temei copilului.

Înțelegerea temelor pentru părinți și copii

În teorie, orice temă poate acționa ca o temă părinte, deși unele sunt mai bine concepute pentru acest rol (inclusiv al nostru!). Dacă utilizați una dintre temele noastre și doriți să o modificați pentru propriul proiect, este mult mai bine să utilizați o temă copil pentru a face acest lucru decât să piratați tema principală, ceea ce înseamnă că veți pierde toate modificările când actualizați. tema la versiunile viitoare. Pentru a crea o temă copil, pur și simplu creați o nouă temă și adăugați următoarele la începutul foii de stil. Exemplul meu de mai jos folosește tema HeroThemes HelpGuru ca părinte, dar puteți folosi orice temă, inclusiv un alt produs HeroTheme, cum ar fi KnowAll.

Începeți să vă construiți baza de cunoștințe astăzi!

Tema noastră KnowAll include o temă copil pentru a vă ajuta să vă personalizați site-ul din baza de cunoștințe

Obțineți Tema

/*
Theme Name: My child theme
Theme URI: URL of the theme or site it's used for
Description: Description of what the theme is for and its main features.
Author: Your name
Template: helpguru
Version: 1.0
*/
@import url("../helpguru/css/style.css");

Liniile importante sunt acestea două:

Template: helpguru
@import url("../helpguru/css/style.css");

Prima secțiune specifică șablonul, care îi spune WordPress că aceasta este o temă copil și că părintele ei este tema HelpGuru. Rețineți că aici utilizați numele folderului temei părinte și nu numele temei (deci mai sus am folosit „helpguru”, nu „HelpGuru”).

A doua secțiune importă foaia de stil din tema părinte, ceea ce înseamnă că toate stilurile temei părinte vor fi activate în tema copilului. Apoi adăugați propriul stil sub această declarație @import - asta înseamnă că stilul din ambele teme va fi folosit, dar acolo unde există o declarație în ambele foi de stil pentru același element, CSS-ul temei copil va prevala din cauza cascadei (ca și temei dvs. copil). stylingul vine după stilul din tema părinte).

O temă copil poate consta dintr-o foaie de stil și nimic altceva, dacă doriți, caz în care tot ceea ce o veți folosi este să înlocuiți o parte din stilul temei părinte. Alternativ, puteți adăuga fișiere șablon suplimentare și/sau un fișier cu funcții, caz în care va trebui să înțelegeți cum accesează WordPress fișierele șablon din temele părinte și copil.

Fișiere șablon de teme pentru părinți și copii

Modul în care WordPress folosește fișierele șablon în temele părinte și copilului este destul de simplu. Când o anumită pagină (sau postare sau orice alt tip de conținut) este afișată, WordPress va folosi cel mai relevant fișier șablon fie din tema părinte, fie din tema secundară, în conformitate cu ierarhia șablonului. Dacă găsește două versiuni ale aceluiași fișier șablon, o va folosi pe cea din tema copil. Aceasta înseamnă că fișierele șablon ale temei copilului dvs. vor înlocui fișierele șablon ale temei părinte în două scenarii:

• dacă tema copilului dumneavoastră conține un fișier șablon care este mai sus în ierarhie decât cele din tema părinte;
• sau dacă tema părinte și copil conțin ambele o versiune a fișierului șablon necesar.

Alegerea fișierelor șablon de temă pentru părinți sau copii

WordPress va folosi ierarhia șablonului pentru a determina ce fișier șablon să folosească, dar acesta interacționează cu fișierele pe care le aveți în fiecare dintre temele părinte și copil. Pentru a spune simplu, WordPress parcurge trei pași:

1. Identifică tipul de conținut afișat.
2. Funcționează prin ierarhia șablonului până când găsește un fișier pentru a afișa acel conținut, fie în tema părinte, fie în tema secundară.
3. Dacă fișierul este prezent atât în ​​tema părinte, cât și în cea copil, îl folosește pe cea din tema copil.

Să ilustrăm acest lucru cu un exemplu. Tabelul de mai jos prezintă setul de fișiere șablon în două teme ipotetice, dintre care una este fiul celeilalte. Fișierele pe care le-am evidențiat au prioritate.

Deci, în exemplul de mai sus, să vedem ce fișiere șablon ar fi folosite pentru a afișa anumite tipuri de conținut:

• Postările unice pentru tipul de postare personalizat „produs” vor fi afișate folosind single-product.php din tema copil.
• Postările unice pentru alte tipuri de postări (inclusiv postările normale) vor fi afișate folosind single.php din tema copil.
• Paginile statice vor fi afișate folosind page.php din tema părinte.
• Listările pentru categoria widget-uri vor fi afișate folosind category-widgets.php din tema copil.
• Alte liste de categorii vor fi afișate folosind category.php din tema părinte.
• Alte liste de arhive vor fi afișate folosind archive.php din tema părinte.
• Rezultatele căutării vor fi afișate folosind search.php din tema părinte.
• 404 pagini vor fi afișate folosind 404.php din tema părinte.
• Alte pagini fără un fișier șablon specific vor fi afișate folosind index.php din tema copil.

Luând-o mai departe – Suprascrieți funcționalitatea temei părinte

Pe lângă suprascrierea sau completarea fișierelor CSS și/sau șablon într-o temă părinte, puteți utiliza o temă secundară pentru a înlocui funcționalitatea din tema părinte sau pentru a adăuga funcționalități suplimentare.

Avertizare! Dacă tot ceea ce folosești tema copilului este să adaugi funcționalități suplimentare, ar fi mai bine să scrii un plugin. Din păcate, fișierele de funcții din temele părinte și copil nu interacționează la fel ca foile de stil, de fapt funcționează în sens invers (confuz, știu). WordPress apelează funcțiile din tema părinte după cele din tema copilului, ceea ce înseamnă că pot suprascrie funcțiile temei copil. Știu că asta sună a cam dureros: ai creat o temă pentru copii, deoarece asta e ceea ce vrei pe site-ul tău, nu? Ei bine, din fericire, există modalități de a depăși acest lucru. Prima metodă este cea pe care o utilizați în tema copilului dvs. și aceasta este să setați prioritatea atunci când vă atașați funcțiile la acțiunea relevantă sau la cârligele de filtrare. Al doilea este făcut în tema părinte și asta pentru a vă face funcțiile conectabile. Voi ajunge la asta într-un moment, dar mai întâi să ne uităm la metoda din tema copilului dumneavoastră.

Utilizarea priorității pentru a suprascrie funcționalitatea temei părinte

Pentru a activa fiecare funcție pe care o adăugați în tema copilului, va trebui să o atașați la un cârlig de acțiune sau un cârlig de filtru folosind add_action() sau add_filter() . Funcțiile add_action() și add_filter() au trei parametri:

• $tag – identificatorul unic pentru acțiunea sau cârligul de filtru
• $function_to_add – numele funcției dvs
• $priority – prioritatea cu care doriți să vă conectați funcția (din care mai multe în curând)

Cu add_filter() puteți folosi un al patrulea parametru opțional, $arguments , dar acesta nu este deosebit de relevant pentru temele copil. În cele mai multe cazuri, sunt utilizați doar primii doi parametri (amândoi sunt necesari), dar puteți utiliza parametrul opțional $priority pentru a înlocui o funcție din tema părinte cu funcția din tema copil. Cu cât prioritatea este mai mare, cu atât se încarcă mai târziu: valoarea implicită este 10 , așa că dacă tema părinte nu specifică o prioritate, pur și simplu setați prioritatea în tema copilului dvs. la un număr mai mare de 10. Să vedem cum aceasta este lucrări. Imaginați-vă că lucrați cu un copil al temei HelpGuru și doriți să suprascrieți funcționalitatea meniului și să adăugați propria temă. Această temă include funcția ht_theme_setup() pentru a configura tema (inclusiv înregistrarea meniurilor, adăugarea de suport pentru imaginile prezentate și multe altele), care este atașată la cârligul de acțiune after_setup_theme . Codul din fișierul de funcții al HelpGuru este următorul:

if ( ! function_exists( 'ht_theme_setup' ) ) :
function ht_theme_setup() {
// contents of function
}
}
add_action( 'after_setup_theme', 'ht_theme_setup' );

Pentru a suprascrie elemente ale funcției ht_theme_setup() (dar nu toate: vom ajunge la asta în curând) în tema copilului, ați scrie o funcție care înlocuiește elementele funcționalității oferite de HelpGuru și ați atașa-o la acțiunea after_setup_theme cârlig, specificând o prioritate mai mare de 10:

function my_theme_setup() {
// contents of function
}
add_action( 'after_setup_theme', 'my_theme_setup', 15 );

Când WordPress întâlnește aceste funcții atașate aceluiași cârlig, va declanșa mai întâi cea cu prioritate inferioară, adică cea din tema părinte. Apoi va declanșa cea cu prioritate mai mare din tema copilului, ceea ce înseamnă că poate suprascrie funcția din tema părinte. După cum am menționat mai sus, există o altă metodă, pe care este o bună practică să o scrieți în temele dvs., astfel încât acestea să poată fi utilizate mai ușor ca teme părinte, și aceasta este pentru a vă face funcțiile conectabile.

Utilizarea funcțiilor conectabile pentru a permite înlocuirea unei teme pentru copii

Deoarece WordPress trece funcția din tema părinte după cele din tema copilului, puteți codifica funcțiile temei părinte, astfel încât acestea să verifice o funcție cu același nume în tema copil și, dacă există una, funcția temei părinte nu este. a trecut. Faceți acest lucru cu o declarație condiționată, precum cea pe care am văzut-o mai sus în HelpGuru:

if ( ! function_exists( 'ht_theme_setup' ) ) :
function ht_theme_setup() {
// contents of function
}
}

Dacă nicio funcție cu același nume nu a fost deja transmisă (de ex. în tema copil), funcția din tema părinte va fi transmisă. Dar dacă WordPress a întâlnit deja o funcție cu acest nume, va ignora funcția conectabilă (adică cea din tema părinte). Pentru ca acest lucru să funcționeze, trebuie doar să creați funcții în tema copilului cu același nume cu cele din tema părinte pe care doriți să le înlocuiți. Deci, pentru a suprascrie funcția ht_theme_setup() în întregime, ați folosi aceasta în tema copilului:

function ht_theme_setup() {
// contents of function
}

Asta e! Doar scrieți o altă funcție cu același nume și o va înlocui pe cea din tema părinte. Notă: Această tehnică va funcționa numai dacă vă creați propria temă părinte – nu fi tentat să editați fișierul cu funcții într-o temă părinte terță parte pentru a le face conectabile. La urma urmei, scopul creării unei teme pentru copil este să nu atingi părintele!

rezumat

După cum sper că am demonstrat, lucrul cu teme pentru copii vă poate crește eficiența și eficacitatea ca dezvoltator WordPress, mai ales dacă dezvoltați site-uri personalizate pentru clienți sau pentru dvs. Cel puțin, folosirea unei teme secundare a unei teme existente, cum ar fi una dintre HeroThemes-urile noastre, vă poate face fluxul de lucru de dezvoltare mai rapid și mai eficient, deoarece vă scutește de a face aceeași muncă mereu.

Puteți duce acest lucru mai departe utilizând fișierele șablon ale temei secundare și fișierele cu funcții pentru a înlocui sau completa funcționalitatea din tema părinte. Și dacă chiar doriți să duceți la maximum temele pentru copii, vă puteți construi propria temă părinte, oferindu-vă un punct de pornire rapid pentru toate proiectele noi și permițându-vă să adăugați mult mai multe temelor pentru copii cu mai puțin efort decât pornind de la zero. .