Creați temă WordPress: pas cu pas pentru dezvoltare personalizată

De la lansarea sa originală în 2003, WordPress a evoluat dintr-un simplu instrument de blogging într-un puternic și popular constructor de site-uri web și un CMS complet (sistem de gestionare a conținutului) utilizat de aproximativ 38% din site-urile de pe web! Având în vedere popularitatea sa, dacă site-ul dvs. trebuie să iasă din mulțime, va trebui să creați o temă WordPress unică pentru site-ul dvs.

În realitate, nu este de mirare că WordPress a reușit să o facă până acum și să devină atât de popular.

Cantitatea de flexibilitate pe care o are și caracteristicile pe care le găzduiește, permit utilizarea sa largă în diferite tipuri de site-uri web. În plus, WordPress este destul de ușor de utilizat, cu puțină sau deloc experiență anterioară în codificare sau dezvoltare web.

Acestea sunt motivele din spatele poveștii de succes ale WordPress și sunt tocmai motivele aproape 40 la sută din toate site-urile de pe World Wide Web sunt alimentate de acest software. 

WordPress are o serie de funcții la îndemână care fac dezvoltarea și programarea web less complicat și mai accesibil tuturor.

Introducere în dezvoltarea temelor WordPress 

O altă caracteristică populară care face WordPress atât de popular este temele sale. Tema este pur și simplu o colecție de foi de stil și șabloane care definesc modul în care va arăta și afișa un site alimentat de WP.

Software-ul oferă utilizatorului o mare varietate de opțiuni de editare diferite atunci când vine vorba de teme din zona de administrare WP.

Sute de teme WordPress sunt complet gratuite sau cu multe altele la un preț rezonabil de câteva zeci de dolari.

De fapt, WordPress.org găzduiește o bază de date imensă de teme în directorul lor de teme.

Alte site-uri web precum Themeforest oferă, de asemenea, o mulțime de teme premium de la diferiți dezvoltatori.

Fiecare dintre aceste teme prezintă un aspect, un model de design și caracteristici diferite.

Depinde de utilizator să găsească unul care să se potrivească cel mai bine nevoilor site-ului web. În majoritatea cazurilor, temele sunt realizate având în vedere anumite industrii sau profesii, ceea ce înseamnă că, de exemplu, proprietarii de restaurante pot găsi cu ușurință teme cu caracteristici de rezervare.

Deși există o mulțime de teme minunate care s-ar putea potrivi nevoilor dvs., este sigur să spuneți că, dacă doriți să creați ceva remarcabil, va trebui să o faceți singur. Dacă nu puteți programa, o alternativă bună opțiunea ar fi să alegeți un dezvoltator de software independent (prețurile pot varia în funcție de diferiți factori).

Cu toate acestea, în acest articol vom parcurge TOȚI pașii necesari pentru a vă crea propria temă WordPress personalizată pentru site-ul dvs. web WP. Vom arunca o privire asupra fiecărui aspect important pentru a ne asigura că veți obține cele mai bune oferte de WordPress. 

Noțiuni de bază cu crearea propriei teme ca începător ar putea, la prima vedere, să pară o sarcină gigantică.

Cu toate acestea, crearea unei teme personalizate de la zero nu este prea complicată în WP. Nu trebuie să fii un șiret de dezvoltare web, dacă ai elementele de bază ale codării cu PHP, poți învăța cu ușurință cum să creezi o temă WordPress.

Mai mult decât atât, crearea propriei teme poate fi destul de plină de satisfacții, mai ales când vedeți rezultatul final live pe site-ul dvs. web.

Crearea primei teme WordPress personalizate

Pentru a începe să creați o temă WordPress, veți avea nevoie de câteva lucruri de bază:

• Un site web WordPress
• Un plan bun de găzduire
• Puțină experiență anterioară cu lucruri cum ar fi mediile de punere în scenă locale
• Înțelegere de bază a limbajelor de codare CSS și PHP
• O temă de început

Înțelegerea ierarhiei șabloanelor WordPress 

În WordPress, fișierele șablon (elementele de bază ale temei dvs.) sunt modulare și reutilizabile.

Fișierele șablon sunt responsabile pentru generarea paginilor de pe site-ul dvs. WP. Unele dintre aceste fișiere sunt utilizate pe aproape toate paginile dvs., în timp ce altele sunt utilizate numai în circumstanțe specifice.

Aruncați o privire la diagrama de mai jos - aceasta explică modul în care este organizată ierarhia șabloanelor WordPress.

Fișierele șablon vor determina aspectul general al conținutului de pe site. Dacă doriți să creați un antet, veți utiliza un header.php sau dacă doriți să adăugați o secțiune de comentarii, veți utiliza fișierul comments.php fișier. 

Pentru a înțelege ierarhia șablonului, ar trebui să știți că WordPress folosește ceva numit „șir de interogare” pentru a decide ce șablon sau set de șabloane trebuie utilizat pentru a crea și afișa o anumită pagină.

Șirul de interogare este informația stocată în linkul fiecărei părți a site-ului web pe care încercați să îl modificați. În termeni mai simpli, WordPress analizează informațiile și efectuează căutări prin ierarhia șablonului pentru a găsi un fișier șablon care se potrivește cu informațiile furnizate în șirul de interogare.

Aceasta este în esență o schemă în care WP caută fișiere șablon potrivite la fiecare încărcare a paginilor.

De exemplu, dacă introduceți următoarea adresă URL http://example.com/post/this-post, WordPress va localiza fișierele șablon necesare în următoarea ordine: 

1. Fișiere care se potrivesc cu slug, în acest caz, acest post.
2. Fișiere care se potrivesc cu ID-ul postării.
3. Un fișier post unic generic, cum ar fi single.php.
4. Un fișier de arhivă, în acest caz, archive.php.
5.  index.php fișier.

Ultimul fișier (index.php) este necesar în fiecare temă, deoarece este implicit (sau alternativ) dacă nu se poate găsi alt fișier în procesul de potrivire. subliniere (o temă WP starter) are cele mai comune fișiere. Aceste fișiere incluse în această temă vor funcționa imediat din cutie.

Le puteți edita dacă doriți să experimentați sau dacă doriți să creați unele funcționalități personalizate pe site-ul dvs.

Ce este o temă WordPress Starter? 

O temă de pornire este o bază de fundal a unei teme WordPress personalizate.

Îl puteți folosi ca bază pentru a vă pune în funcțiune propria temă unică. Cu o temă de pornire, vă puteți construi propria temă WordPress personalizată, fără a fi nevoie să proiectați sau să codificați o temă întreagă de la zero.

Temele de pornire WordPress conțin toate fișierele definite în ierarhia de mai sus.

Utilizarea unei teme de început vă permite să înțelegeți mai bine cum funcționează WordPress, deoarece vă arată elementele de bază, structura unei teme și modul în care diferitele părți funcționează împreună.

O temă WordPress personalizată poate fi aplicată la o serie de tipuri de site-uri web diferite, de la prezentări și directoare la magazinele online construit cu WooCommerce, rețelele de socializare sau orice altceva ai putea avea nevoie de site-ul tău web.  

Optarea pentru teme de început (cum ar fi UnderStrap, Underscores și Bones) va ajuta la crearea temei WordPress care deschide ușa utilizării unei varietăți de opțiuni diferite.

Utilizarea Underscores ar putea fi cea mai bună alegere pentru începători, deoarece oferă cele mai importante caracteristici. De asemenea, vine de la un dezvoltator de lungă durată și de încredere. Aceasta înseamnă că este mai probabil să fie compatibil, sigur și fiabil și va avea un suport mai bun pe termen lung.

De ce ar trebui să utilizați o temă Starter

După cum sa menționat mai sus, o temă de pornire este o bază, un plan care vă ajută să veniți cu un site web unic. Funcționează deja pe deplin, dar încă îi lipsesc caracteristicile cheie care definesc un site web ușor de utilizat. 

În esență, trebuie încă să fie stilizat și configurat corespunzător. 

Acestea fiind spuse, temele de început sunt ideale pentru cei care au puțină sau deloc experiență cu WordPress sau cu dezvoltarea web în general. Este o modalitate excelentă de a vă prezenta tema construirii temei și de a învăța elementele de bază ale site-urilor web bazate pe WP. 

O temă WordPress Starter vă economisește timp și necesită puține cunoștințe de bază în codificare și în restul complexităților WordPress. 

Puteți profita de ani de muncă grea a dezvoltatorilor temei de început și puteți utiliza aceste linii directoare pentru a înțelege mai bine modul în care funcționează WordPress și designul temelor.   

Exemple populare de teme pentru începători

• subliniere - O temă de start fiabilă și renumită, care oferă începătorilor un început dezvoltarea temei. Underscores este destul de simplu și perfect pentru a începe imediat dacă aveți toate instrumentele necesare. Tema este excelentă pentru înțelegerea conceptelor de dezvoltare a temei. Punctele de subliniere se referă la începerea unui nou proiect care ar trebui privit mai mult ca un set de instrumente în continuă dezvoltare less ca un cadru.
  
  
• Radacini - Această temă de pornire vă oferă o abordare orientată mai mult către dezvoltatori, cu marcarea sa bazată pe HTML5 Boilerplate. De asemenea, acceptă instrumente mai avansate precum Bootstrap și mormăit. Tema inițială Roots include, de asemenea, o împachetare tematică care vă ajută să vă mențineți procesul raționalizat și să eliminați apelarea în mod repetat a acelorași șabloane.

Roots folosește, de asemenea, preprocesoare și suporturi CSS LESS, o extensie de limbaj compatibilă înapoi pentru CSS, care poate accelera semnificativ procesul de dezvoltare a temei.

Acestea fiind spuse, Roots oferă o abordare mai pragmatică și necesită un pic mai mult know-how de la dezvoltator.  

6 pași de bază pentru a vă dezvolta tema WordPress

După ce acoperiți elementele de bază, sunteți în sfârșit gata să începeți cu crearea unei teme WordPress.

Deoarece acest articol este orientat mai mult către începători, vom folosi o temă de început, totuși, sunteți liber să creați totul de la zero, fără nici o temă de început.

Dacă acesta este calea pe care doriți să o parcurgeți, nu uitați că veți avea nevoie de mult mai mult timp și va trebui să vă scufundați puțin mai adânc în codare și în dezvoltarea web în general.

1. Configurarea mediului de dezvoltare

Primul dvs. pas în acest proces ar trebui să fie crearea unui mediu de dezvoltare.

Acesta este practic un server pe care trebuie să îl instalați pe computer pentru a gestiona și dezvolta site-uri WP locale. Un mediu de dezvoltare vă permite să vă dezvoltați site-ul în siguranță, pe lângă faptul că vă oferă mai multe opțiuni pentru crearea unui mediu local.

Utilizarea DesktopServer este una dintre căile ideale pe care le poți parcurge. Este o modalitate ușoară de a obține o versiune locală și rapidă a WP, care este compatibilă atât cu Windows, cât și cu Mac. Selectați versiunea gratuită, înregistrați-o și descărcați-o, apoi instalați software-ul.

După ce ați instalat, deschideți programul și configurați-vă mediul local.

Este un proces destul de simplu și veți fi gata în câteva minute. După configurare, veți avea un site web și un mediu de dezvoltare care va funcționa și va arăta ca orice site WP live.

2. Descărcați și instalați o temă Starter

Cele mai de bază teme pentru începători (cum ar fi Underscores) sunt ușor pentru începători cu cei care încep.

Contrar majorității temelor de bază, Underscores permite personalizarea opțiunilor prin intermediul Opțiuni avansate (cum ar fi autorul și descrierea) după denumirea temei dvs. 

Puteți adăuga, de asemenea, StyleSheets Syntactically Awesome sau SASS care este un limbaj CSS de preprocesare care vă permite să introduceți caracteristici precum cuibărire, operații matematice, utilizarea variabilelor etc.

După ce ați făcut alegerile, tot ce trebuie să faceți este să faceți clic pe Generare pentru a descărca fișierul .zip cu tema dvs. de pornire.

Acum, instalați fișierul pe site-ul dvs. local. Dacă ați făcut totul corect, acum puteți vedea o versiune de bază a temei dvs. personalizate WordPress.

Înțelegerea principiilor de bază WordPress 

Acum că elementele de bază sunt configurate, puteți începe să lucrați. Cu toate acestea, înainte de a vă scufunda în procesul de personalizare, va trebui să vă familiarizați cu principiile de bază și componentele creării unei teme WordPress folosind principiile de bază ale WP. 

În primul rând, trebuie să aflați despre fișiere șablon, elementele principale ale oricărei teme din WP.

Fișierele șablon determină practic modul în care aspectul și conținutul dvs. vor fi afișate pe site-ul dvs. Dacă doriți să creați un antet, veți dori să utilizați fișierul header.php fișier, în timp ce comments.php ar fi folosit pentru a afișa orice comentarii.

După cum sa discutat mai sus, WP își folosește ierarhia șablonului pentru a determina ce fișier șablon va alege pentru a executa conținutul pe care îl solicită / are nevoie un utilizator. Puteți lucra cu aceste fișiere așa cum sunt, dar având în vedere că sunteți aici pentru a crea tema WordPress, cea mai mare parte a muncii dvs. va fi adaptarea acestor fișiere la nevoile dvs.

Când vorbim despre principiile de bază ale WP, ar trebui să înțelegeți și conceptul din spate Buclă.

Este codul pe care WP îl folosește în principal pentru a vă afișa conținutul și poate fi găsit în tot conținutul care afișează fișiere șablon, cum ar fi index.php or sidebar.php. Este un subiect destul de complex, dar, din fericire, vine la pachet cu tema inițială (dacă utilizați Scoruri subțiri), ceea ce înseamnă că procesul dvs. ar trebui să fie mai simplu. 

Va trebui să înțelegeți conceptul și să lucrați cu el. Consultați câteva exemple din linkul de mai sus, pentru a înțelege mai bine modul în care este utilizată bucla și cum puteți personaliza codul în funcție de nevoile dvs.

3. Creați detalii despre temă

Tematică nu sunt componente pur cosmetice.

Există o mulțime de funcții diferite pe care le puteți adăuga pe site-ul dvs., care pot îmbunătăți funcționalitatea. Vom discuta despre cum să implementăm câteva caracteristici de bază pentru a vă condimenta site-ul.

Adăugare cârlige vă poate permite să rulați diferite acțiuni PHP, să afișați alte informații sau să inserați date de stil, după cum este necesar.

Cârligele sunt fragmente de cod care sunt inserate în fișierele șablon. Cele mai multe dintre ele sunt implementate direct ca parte a nucleului WordPress, dar unele cârlige sunt destul de utile și la personalizarea temelor.

Iată o listă cu cele mai frecvente cârlige și rolurile lor:

• wp_head () - se adaugă la element din header.php. Permite scripturi, stiluri și alte informații care rulează atunci când site-ul începe să se încarce.
• wp_footer () - adăugat de obicei la footer.php înainte de etichetă, cel mai adesea utilizată pentru a insera cod pentru Google Analytics sau alt cod care trebuie să apară pe fiecare pagină, dar care este prea greu pentru a fi încărcat în antet.  
• wp_meta () - În general se găsește la sidebar.php și este cel mai adesea folosit pentru a include scripturi suplimentare (de exemplu, un nor de etichete).
• comment_form () - Adăugat la comments.php direct înainte de închiderea fișierului etichetă pentru a afișa comentarii. 

Când folosiți Underscores, aceste cârlige vor fi deja incluse cu tema, dar este întotdeauna o idee bună să aflați mai multe despre ele și să vedeți toate cârligele disponibile. Cârligele vă permit să extindeți capacitățile temei dvs. personalizate.  

4. Adăugarea stilurilor folosind CSS

Cascading Style Sheets sau CSS definește aspectul conținutului de pe site-ul pe care îl creați.

Prin utilizarea funcției style.css , care este deja inclus în tema dvs., puteți edita oricare dintre stilurile găsite aici și le puteți salva pentru a vedea cum vă modifică designul. În mod implicit, conține doar stilul de bază.

CSS este utilizat pentru a permite prezentarea și separarea conținutului de pe site-ul dvs. web, de la aspect la fonturi și conținut. CSS vă poate ajuta să faceți conținutul de pe site-ul dvs. mai accesibil și mai flexibil.

Aprofundarea cu privire la modul de utilizare a stilului cu teme WordPress poate deveni destul de păros și nu depășește scopul acestui articol. Dacă nu sunteți prea sigur despre acest lucru, vă recomandăm să citiți mai multe despre CSS înainte de a continua.

5. Inclusiv JavaScript

Adăugarea de fișiere JavaScript la tema dvs., dacă este necesar, poate spori caracteristicile și capabilitățile interactive și poate avea un site mai funcțional. Este deosebit de util atunci când doriți să încorporați plugin-uri terțe pe site-urile dvs., cum ar fi playere video sau audio specifice, lucruri precum glisoare, suport popup și alte biblioteci terțe pentru a crea funcționalități avansate.

Pentru a utiliza Javascript cu site-ul dvs. personalizat, puteți crea un apel folosind sintaxa de mai jos pentru a adăuga fișierul script la temă.

Alternativ, puteți utiliza scriptul direct în header.php fișier șablon între metaetichete și linkul pentru foaia de stil, așa cum ați face în cazul unei pagini HTML. Când îl utilizați în fișierul antet, ar trebui să arate cam așa: 

Dacă doriți să utilizați JS direct, adăugați apelul pentru fișiere direct conform celor de mai jos. Dacă doriți să setați o caracteristică „trimiteți acest lucru unui prieten”, o puteți pune sub titlul postării. Asta ar arăta similar cu acesta: 

" rel="bookmark">

<!--

pagina de e-mail ();

// ->

De asemenea, puteți stoarce scripturi folosind sintaxa prezentată mai târziu în acest articol.

6. Testați-vă tema și exportați-o

Când ați terminat cu toate cele de mai sus, este în sfârșit timpul să testați tema personalizată WordPress creată pentru a vă asigura că rulează fără probleme.

În acest scop, puteți utiliza fișierul Test de unitate tematică Date, un set de date fictive pe care le puteți încărca pe site-ul dvs. Datele constau în variante de stil și conținut diferit, permițându-vă să vedeți cât de eficient tema dvs. poate gestiona atât date previzibile, cât și imprevizibile.

Testați totul cu atenție (conform link-ului Codex de mai sus), astfel încât să puteți fi siguri că tema pe care ați creat-o îndeplinește standardele cerute și respectă așteptările dvs. înainte de a o exporta.

Odată ce sunteți sigur de testare, puteți exporta tema.

Puteți face exportul găsind locul în care ați instalat mediul de dezvoltare a site-ului local.

Deschideți folderul și accesați  / Wp-content / teme /, unde puteți găsi tema la care lucrați.

Acum, cu un instrument de compresie, creați un fișier fișier Zip pe baza dosarului prin comprimarea acestuia. Când ați terminat tot ce trebuie să faceți este să îl încărcați și să îl instalați pe orice site WordPress. De asemenea, îl puteți trimite la WordPress Director de teme. 

Ghid detaliat de dezvoltare a temei WordPress

Acum, după ce ați făcut elementele de bază, pașii următori vor enumera câteva detalii suplimentare despre cum să creați tema WordPress.

Crearea de fișiere / directoare tematice personalizate

După cum știți deja, temele WP sunt create din diferite fișiere șablon care cel puțin vor include un sidebar.php, header.php., și footer.php. Le puteți apela folosind etichetele șablonului (get_header (), la apelarea antetului, get_sidebar (), la apelarea barei laterale etc.).

De asemenea, puteți crea versiuni personalizate ale acestor fișiere cu modificări ușoare precum acestea: bara laterala-{your_custom_template} .php, antet-{your_custom_template} .php și subsol-{your_custom_template} .php. 

De asemenea, puteți apela etichetele șablonului cu aceeași analogie cu numele șablonului ca parametru ca acesta:

get_header ( „modelul_custom_dvs.” ); 

Paginile sunt create de diferite fișiere, ceea ce înseamnă că puteți crea și alte fișiere șablon personalizate și le puteți apela în orice locație dată din pagină, pur și simplu utilizând get_template_part (). Doar dați fișierului un nume adecvat și utilizați aceeași metodă personalizată ca și pentru fișierele cu antet, subsol și bara laterală. 

Să presupunem că doriți să creați un șablon care să gestioneze conținutul dvs. - trebuie doar să creați un fișier numit content.php și apoi extindeți numele fișierului pentru a adăuga un aspect specific. În acest caz, să fie așa conţinut-produs.php.

La final, când încărcați fișierul șablon în temă, ar arăta cam așa:

get_template_part ('conținut', 'produs') ;.

Utilizarea directoarelor

Pentru a vă conecta la directoare tematice, pur și simplu utilizați funcția get_theme_file_uri ();

Această funcție va returna URI-ul complet în folderul principal al temei dvs. și îl puteți utiliza pentru a face referire la fișiere și sub-foldere utilizând următorul exemplu:

echo get_theme_file_uri ('images / logo.png');

Aduceți scripturi și foi de stil

Când veniți cu propria temă, puteți crea, de asemenea, foi de stil personalizate și propriile fișiere JavaScript.

Ori de câte ori faceți acest lucru, asigurați-vă că le încărcați folosind metoda standard WordPress, în caz contrar, există șansa ca tema și pluginurile dvs. să nu funcționeze corect în toate circumstanțele.

Tot ce trebuie să faceți este să creați o funcție care să conțină toate stilurile și scripturile. Pentru aceasta, WP creează atât un handle, cât și o cale pentru a găsi fișierul și dependențele (dacă există), odată ce acest lucru se va întâmpla, va trebui să utilizați un cârlig pentru a insera foile de stil și scripturile. 

Funcția de bază pentru enqueing stil:

wp_enqueue_style ($ handle, $ src, $ deps, $ ver, $ media);

Pentru generarea de scripturi:

wp_enqueue_script ($ handle, $ src, $ deps, $ ver, $ in_footer); 

Conectați Google Fonts

Fonturile Google sunt o resursă excelentă gratuită de fonturi pentru designerii de web și pot fi adăugate pur și simplu la tema personalizată.

Mai întâi, va trebui să găsiți un tip de font care vă place în biblioteca de fonturi Google. După ce ați găsit un font cu care doriți să lucrați, pur și simplu faceți clic pe butonul „Selectați acest stil”, care vă duce la o pagină nouă.

Dacă derulați aici, puteți găsi instrucțiunile de utilizare a acestora într-o casetă cu codul necesar pe care îl puteți adăuga pe site-ul dvs.   

Puteți adăuga fonturile fie prin metoda standard și recomandată, fie puteți opta fie pentru metoda @import CSS, fie prin metoda Javascript.

De asemenea, îl puteți adăuga la WP stoarcând fontul din tema dvs. funcții.php.sau folosind un plugin specific.

function wpb_add_google_fonts () {

wp_enqueue_style ('wpb-google-fonts', 'https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,700italic,400,700,300', fals);

}

add_action ('wp_enqueue_scripts', 'wpb_add_google_fonts');

Dacă doriți, puteți citi mai multe despre cum să schimbați fonturile într-o temă WordPress aici.

Împărțirea paginii în secțiuni (Header.php / Footer.php)

Pe majoritatea site-urilor, antetul, subsolul și bara laterală vor fi la fel pe toate paginile. Este adevărat că, în unele cazuri, veți dori să personalizați câteva lucruri, dar, în general, acestea sunt consistente.

Deci, pentru a împărți pagina într-un antet și subsol, veți dori să tăiați și să lipiți din index.php pagina, părțile relevante care ar trebui să fie în antet / subsol și în bara laterală. Acest lucru depinde puțin de index.php curent.

De exemplu, dacă utilizați punctele de subliniere, antetul și subsolul au fost deja definite corect în header.php și footer.php.

Să continuăm acest exemplu ca și cum am crea conținutul pentru antet.

În majoritatea site-urilor web, anteturile conțin stilurile esențiale ale capului și navigarea către site.   

Începe de la adăuga înainte de închidere . Ar trebui să ai așa ceva. Aceasta se bazează pe tema inițială a sublinierilor, dar poate doriți să modificați antetul după cum este necesar pentru a vă crea propriile personalizări.

header.php

/ **
* Antetul temei noastre
*
* Acesta este șablonul care afișează toate fișierele secțiune și totul până la
*
* @link https://developer.wordpress.org/themes/basics/template-files/#template-partials
*
* @pachet Daves_Theme
*/

?>

>

">

>

the_custom_logo ();
if (is_front_page () && is_home ()):
?>
" rel="home">

altceva:
?>
" rel="home">

endif;
$ daves_theme_description = get_bloginfo ('description', 'display');
if ($ daves_theme_description || is_customize_preview ()):
?>

wp_nav_menu (
array (
'theme_location' => 'meniu-1',
'menu_id' => 'meniul principal',
)
);
?>

Același proces ar trebui să se aplice și subsolului.

Folosind Functions.php

Tema functions.php fișier este un fișier șablon din tema WP care acționează ca un „master” care se încarcă automat atât pentru administratori, cât și pentru paginile front-end ale unui site.

De obicei, definește funcțiile, acțiunile, filtrele și clasele pe care alte fișiere șablon le utilizează în temă. De asemenea, poate fi folosit pentru a extinde funcționalitatea temei prin cârlige, acțiuni și filtre suplimentare.

Puteți găsi cu ușurință fișierul functions.php în folderul tematic. Puteți adăuga funcții WP încorporate și funcții PHP obișnuite deopotrivă la filtre și cârlige care sunt deja definite în nucleul WP.

Puteți crea pur și simplu un fișier functions.php creând un fișier text simplu pe care îl denumiți functions.php și îl puneți în directorul temei. Cu acest fișier, puteți activa formate de postare, meniuri de navigare și miniaturi de postare, împreună cu acțiuni și filtre WP. 

Consultați fișierul functions.php dintr-o temă de start pentru a vedea câteva exemple de ceea ce se poate face. De asemenea, puteți căuta articole care utilizează funcțiile.php care extind funcțiile unui site WordPress folosind fișierul funcții.

Utilizarea principalelor setări în temă

Setările principale permit modificarea anumitor setări ale temei fără a modifica fișierele temei sau a trebui să modificați orice cod. O descriere detaliată a acestui lucru nu intră în sfera de aplicare a acestui articol, așa că vă vom trimite la câteva articole care explică acest concept în detaliu.

1. Setări API descriere pe WordPress Codex.
2. Ghid complet pentru API-ul Setări WordPress

Bucla WordPress

După cum am discutat anterior, Bucla este un mecanism implicit utilizat de WP pentru a afișa postări prin fișiere șablon.

Folosind mecanismul de buclă, WP preia postările de pe paginile curente și le formează conform „instrucțiunilor” din buclă.

Practic, parcurge postările pentru paginile curente pe rând, efectuând acțiunea specificată în temă. 

Puteți utiliza bucla pentru

• Afișarea conținutului și comentariilor
• Afișarea titlurilor postărilor și a extraselor pe pagina de pornire a blogului
• Afișați date din câmpuri personalizate și tipuri de postări personalizate
• Afișați conținutul pe pagini individuale utilizând etichete șablon.
• Personalizați bucla pentru a afișa și manipula conținutul în fișierele șablon

Dacă utilizați tema de pornire Underscores, veți găsi bucla WordPress folosită în fișierele single.php și page.php. Poate doriți să vă uitați la aceste fișiere pentru a înțelege cum funcționează și / sau cum pot fi utilizate.

get_header ();
?>

while (have_posts ()):
bara();

get_template_part ('template-parts / content', get_post_type ());

the_post_navigation (
array (
'prev_text' => ' '. esc_html __ ('Precedent:', 'daves-theme'). „ % title ”,
'next_text' => ' '. esc_html __ ('Next:', 'daves-theme'). „ % title ”,
)
);

// Dacă comentariile sunt deschise sau avem cel puțin un comentariu, încărcați șablonul de comentarii.
if (comments_open () || get_comments_number ()):
comments_template ();
endif;

în cele din urmă; // Sfârșitul buclei.
?>

get_sidebar ();
get_footer ();

Meniu și Pagini

Meniu principal

Puteți selecta meniul principal în Editorul de meniu WP (situat la Aspect - Meniu). Tema dvs. poate accepta mai multe meniuri de navigare în diferite locuri din temă. 

Există, de asemenea, modalități de a înregistra meniuri suplimentare, de exemplu, poate doriți să creați un meniu „subsol”.

Aruncați o privire la Codex-ul WordPress pentru a înțelege cum să faceți acest lucru: https://codex.wordpress.org/Navigation_Menus

Pagina personalizată

WP permite crearea de pagini și postări în mod implicit. Controlează aspectul paginii prin page.php fișier șablon.

În timp ce acest fișier afectează toate paginile unice din tema dvs., puteți modifica aspectul și aspectul acestora. Editarea acestor șabloane de pagină personalizate în WP necesită un pic de HTML, PHP și CSS, dar din nou, ar trebui să fie destul de simplă.

index.php

Acest șablon este șablonul de rezervă implicit în WordPress pentru afișarea oricărei pagini atunci când ierarhia șablonului nu poate găsi nicio altă pagină care să corespundă parametrilor dați.

Va trebui să utilizați acest lucru pentru a satisface orice nu este tratat de restul fișierelor șablon.

Archive.php

archive.php șablonul este utilizat pentru a afișa pagini personalizate de etichetă, autor, categorie și alte arhive.

Crearea unei pagini de arhive poate fi o modalitate bună de a atrage tot conținutul într-o singură pagină.

Categorii

În dezvoltarea web WP, nu este neobișnuit să folosiți diverse șabloane pentru categorii, tipuri de posturi personalizate, taxonomii și etichete. Prin crearea diferitelor categorii de șabloane, puteți include caracteristici diferite pe fiecare pagină a categoriilor.   

Un șablon tipic category.php va arăta similar cu acesta:

/ **

* Un șablon de categorie simplă

*/

get_header (); ?>

// Verificați dacă există postări de afișat

if (have_posts ()):?>

Categorie:

// Afișează descrierea opțională a categoriei

 if (category_description ()):?>

// Bucla

while (have_posts ()): the_post (); ?>

de

 <?php

  comments_popup_link ('Nu există comentarii încă', '1 comentariu', '% comentarii', 'comentarii-link', 'Comentarii închise');

?>

<?php endwhile;

altfel:?>

Scuze, nicio postare nu se potriveste criteriilor dumneavoastra.

Bara laterală.php

Bara laterală este zona în care puteți pune widgeturile într-o temă WP. Cel mai adesea, se află în partea dreaptă sau sub conținutul dvs. de pe toate paginile.

Barele laterale sunt utilizate pentru a afișa lucruri care nu sunt conectate direct la conținutul postării sau al paginii, dar chestii precum linkuri către diferite zone ale site-ului dvs., formulare de înscriere, reclame, linkuri de socializare și așa mai departe.

De obicei, bara laterală este utilizată împreună cu widget-urile WP.   

Iată cum puteți adăuga o bară laterală pregătită pentru widget la tema dvs.:

funcție wpb_widgets_init () {

    register_sidebar (array (

        'name' => __ ('Bara laterală principală', 'wpb'),

        'id' => 'sidebar-1',

        'description' => __ ('Bara laterală principală apare în dreapta pe fiecare pagină, cu excepția șablonului de pe prima pagină', 'wpb'),

        'before_widget' => ' ',

        'after_widget' => ' ',

        'before_title' => ' ',

        'after_title' => ' ',

    ));

    register_sidebar (array (

        'name' => __ ('Bara laterală a paginii din față', 'wpb'),

        'id' => 'sidebar-2',

        'description' => __ ('Apare pe șablonul static pentru prima pagină', 'wpb'),

        'before_widget' => ' ',

        'after_widget' => ' ',

        'before_title' => ' ',

        'after_title' => ' ',

    ));

    }

add_action ('widgets_init', 'wpb_widgets_init');

Pagini de postare individuale (single.php)

Să presupunem că doriți să utilizați un șablon sau un aspect diferit pentru un anumit articol de pe site-ul dvs. web.

Pentru aceasta, va trebui să creați un șablon de postare personalizat. Acest lucru este destul de similar cu crearea de pagini personalizate. Urmând instrucțiunile de bază aplicate acolo, puteți crea cu ușurință și postări individuale. 

Crearea unei imagini recomandate

Pentru a adăuga suport pentru imaginile prezentate, pur și simplu adăugați următorul cod la temă functions.php fișier:

add_theme_support ("post-miniaturi"); 

Acum, puteți accesa paginile sau postările dvs. și puteți verifica dacă opțiunea de imagine prezentată este disponibilă. Este posibil ca WP să nu o afișeze automat, așa că, pentru a afișa imaginea, poate fi necesar să faceți modificări ușoare la șabloanele dvs. în care sunt afișate paginile și postările prin adăugarea acestui cod:

Paginație 

Această funcție vă permite să faceți pagini înainte și înapoi prin paginile dvs. de conținut. Puteți utiliza această caracteristică atunci când vizualizați listele de postări cu mai multe intrări decât cele care pot fi încadrate pe o singură pagină sau când doriți să separați postări mai lungi utilizând etichetă.

Cea mai simplă formă de paginare este plasarea funcției posts_nav_link (). În șablon după buclă. Acest lucru generează legături atât la următoarea pagină a postărilor (când rupeți listele de postări), cât și la postările anterioare, acolo unde este cazul.  

posts_nav_link ();

De asemenea, puteți utiliza next_posts_link & prev_posts_link pentru a controla unde apare linkul paginii de postări anterioare și următoare.

next_posts_link ();

previous_posts_link ();

Comentarii 

Comentariile sunt o parte esențială a oricărui blog sau pagină. Oferă vizitatorilor site-ului web posibilitatea de a vă contacta, de a oferi feedback, de a pune întrebări și, în general, de a crea o legătură mai profundă cu site-ul dvs. și conținutul dvs.

Toate comentariile sunt afișate în zona de administrare și există mai multe funcții pe care le puteți adăuga, de la activarea comentariilor numai pentru anumiți utilizatori la moderarea comentariilor.

Puteți utiliza fișierul comments.php pentru a personaliza aspectul comentariilor din tema dvs.

Alte pagini și fișiere 

În funcție de nevoile dvs., puteți găsi sau crea pagini și fișiere diferite și le puteți adapta la preferințele dvs. utilizând aceleași linii directoare sau similare menționate mai sus. 

Folosirea temei părinte / copil

Tema părinte

Temele părinte din WP sunt teme care sunt declarate „părinți” de alte teme, și anume, temele pentru copii.

O temă copil este utilizată pentru a permite proiectanților și dezvoltatorilor să creeze personalizări ale temelor fără a rupe posibilitatea actualizării temei părinte. Acest lucru se datorează faptului că dacă un dezvoltator modifică fișierele temei originale, atunci când se efectuează o actualizare a temei, modificările se pierd.

Cu toate acestea, temele părinte își transmit caracteristicile și funcționalitatea pe temele copilului lor. Dezvoltatorii sunt liberi să aducă modificări funcționalității și caracteristicilor temei copil, fără a afecta capacitatea de actualizare a temei părinte.

Temă pentru copii

Temele copil moștenesc funcționalitatea temelor părinte. Acestea sunt utilizate în principal pentru a modifica o temă existentă fără a pierde niciun stil personalizat adăugat anterior în timpul actualizărilor temei.  

Temele pentru copii accelerează procesul de dezvoltare, deoarece este ușor să creați modificări cu ele.

Majoritatea temelor vor crea o temă pentru copii și o vor face disponibilă împreună cu tema, astfel încât oricine folosește tema să o poată personaliza prin intermediul temei pentru copii. Definim cum să creăm o temă pentru copii, în articolul nostru de aici.

Utilizarea cadrelor de dezvoltare

Acest termen se referă la bibliotecile de coduri care sunt utilizate în dezvoltarea temelor. 

Cadrele de dezvoltare au fost create pentru a servi ca șabloane de teme părinte cu toate funcționalitățile. Practic, ca și în cazul temelor părinte, cadrele rămân neatinse, în timp ce dezvoltatorii pot efectua modificări în temele copil.

Acest lucru face ca dezvoltarea să fie mai rapidă și ușurează eliminarea bug-urilor în cadrul tematic specific. Cadrele de dezvoltare notabile includ Cadrul tematic Genesis, Themify și Divi de Elegant Themes.

Încheiem cum să creați temă WordPress

Cele de mai sus au fost un ghid detaliat pas cu pas pentru a începe cu dezvoltarea propriei teme WordPress personalizate.

Una peste alta, deși trebuie să înțelegeți bine WordPress și PHP, nu este un proces atât de solicitant. Cunoașterea elementelor de bază ale dezvoltării web este importantă și puteți înțelege nucleul WordPress mai detaliat pe măsură ce vă dezvoltați. Dacă încă nu îți vine să fii la îndemână, e în regulă, ia-ți timp și experimentează puțin.

După ce ați făcut câteva greșeli, veți începe să învățați din ce în ce mai mult. De asemenea, este bine să aruncați o privire la baza de coduri a altor teme populare pentru a înțelege ce fac și pentru a vă face o idee bună despre practicile care au sens.

Spuneți-ne dacă aveți întrebări în comentariile de mai jos.

Despre autor

Autor: David AttardSite-ul: https://www.linkedin.com/in/dattard/E-mail: david@collectiveray.com

David a lucrat în sau în jurul industriei online și digitale în ultimii 21 de ani. Are o vastă experiență în industriile software și web design folosind WordPress, Joomla și nișele din jurul lor. A lucrat cu agenții de dezvoltare software, companii internaționale de software, agenții de marketing locale și acum este șeful operațiunilor de marketing la Aphex Media - o agenție SEO. În calitate de consultant digital, se concentrează pe a ajuta companiile să obțină un avantaj competitiv folosind o combinație a site-ului lor web și a platformelor digitale disponibile astăzi. Combinația sa de experiență tehnologică, combinată cu o puternică perspicacitate în afaceri, aduce un avantaj competitiv scrierilor sale.