Modele greșite de dezvoltare WordPress și cum să le rezolvați

Cu WordPress devenind tot mai popular, există o cantitate masivă de coduri generate de utilizatori, agenții și piețe. Am lucrat cu WordPress multă vreme și mă uimește câte dezvoltatori de acolo fac mereu aceleași greșeli.

Voi trece prin unele dintre cele mai comune greșeli de dezvoltare și cum le puteți rezolva cu ușurință, și înainte de a vă face codul mai bun!


De ce codul dvs. suge

Dacă faceți o căutare Google pentru "WordPress", aceasta returnează 1,9 miliarde de rezultate. Există milioane de site-uri cu exemple de cod, tutoriale și fragmente care vin foarte util ca dezvoltator WordPress. Problema este de 2 ori:

  1. Oamenii nu respectă standardele de codare WordPress
  2. Oamenii copiați și lipiți doar

Deci, ca un nou dezvoltator de WordPress, faceți o căutare Google, găsiți un articol, copiați și inserați codul și funcționează! Brilliant vă spuneți-vă și vă amintiți sau marcați codul. Marea problemă aici este că codul poate să nu fie perfect, dar ești nou, deci nu vei observa. Pe măsură ce funcționează, puteți pur și simplu să-l folosiți pentru totdeauna.

Să începem cum puteți evita unele greșeli comune!


Codurile WordPress Coding

WordPress în sine admit că unele părți ale structurii codului WordPress pentru marcajul PHP sunt inconsistente în stilul lor (cuvintele lor exacte). Acestea lucrează pentru a curăța codul și pentru ao face consecventă și au stabilit un standard pentru tot Codul WordPress. Nu contează dacă este vorba de un Plugin sau de o temă, ar trebui să respecte toate aceleași standarde.

Codurile WordPress Coding

Dacă nu ați citit niciodată această pagină înainte Citește! Acesta ar trebui să fie unul dintre primele locuri în care orice dezvoltator care lucrează cu vizite WordPress. Nu voi trece prin punctele de aici, dar ar trebui să vă faceți timp să treceți și să-l citiți.

Eu însumi sunt vinovat de încălcarea a două dintre aceste reguli, dar cheia reală este coerența. Singura regulă pe care o fac eu este să rup tot timpul. Personal cu care se ocupă dacă declarații prefer să folosesc structura Alternative Syntax for Control. Pentru mine sunt mai ușor de citit. Fiind consistenți în codul meu, cel puțin oamenii pot vedea instantaneu că fac ceva diferit și mă urmăresc prin codul meu.

Tine minte: Standardele de coerență și de codificare fac într-adevăr un drum lung de a face codul să arate și să citească mai bine!


Codex, Codex, Codex

În secțiunea anterioară am analizat standardele de codificare WordPress, acest document se găsește în cea mai folositoare resursă de dezvoltare pentru dezvoltatorii WordPress. Codul WordPress. Disponibil în aproape 50 de limbi, Codex-ul este biblioteca dezvoltatorilor. Acesta conține documentația despre aproape fiecare funcție, clasă și variabilă în WordPress, cum să le folosiți și exemple de cod. Am de obicei 3 sau 4 tab-uri deschise pe codul de la un moment dat, de fapt, în momentul în care am 4 deschise! Nu contează dacă sunteți nou în WordPress sau lucrați cu el de ani de zile, documentația aici este de neprețuit.

Frumusețea Codex-ului este că este o comunitate vie, care respiră pentru documentare. Puteți contribui la propriile cunoștințe pentru a le face mai bine sau pentru a adăuga o pagină dacă acestea lipsesc, amintiți-vă dacă adăugați orice cod care să respecte standardele de codare WordPress!

Cea mai mare sfat pentru Codex este de a căuta! Ca și în cazul oricărui site bazat pe Wiki, navigația este puțin complicată și nu are niciun sens la început. Căutarea construită ar trebui să vă ajute să găsiți ceea ce căutați. Dacă vă străduiți să găsiți ceea ce căutați și apoi să sarăți în canalul IRC #WordPress, există de obicei câțiva oameni care vă vor îndruma către pagina Codex dreapta.


Instrumentul potrivit pentru munca corectă

Deci acum știm despre standardele de codificare și de unde să obținem documentația potrivită și să ne ajutăm să aruncăm o privire asupra codului tău.

    Salut 

Fragmentul de mai sus reprezintă primele câteva linii tipice ale celor mai multe teme WordPress, însă nu ar trebui să fie. Scripturile și stilurile pot fi tratate mult mai bine cu WordPress și ne dau câteva funcții minunate pentru a lucra cu ele. Acum vorbesc aici despre teme, dar orice plugin care are nevoie de scripturi sau stiluri ar trebui să facă lucrurile exact în același mod. Introducand wp_enqueue_style () și wp_enqueue_script ()! Dacă nu știi ce fac aceste funcții atunci trebuie să rezolvăm asta! Hai să trecem prin ce trebuie să faci.

Lăsați WordPress să știe totul despre asta!

Indiferent dacă este vorba despre un script sau un stil, cel mai bine este să lăsați WordPress să știe despre el. Noi facem asta folosind wp_register_script () sau wp_register_style (). Acestea sunt ambele modalități sigure de înregistrare a unui script sau a unui stil cu WordPress, astfel încât să puteți utiliza ulterior. Acum, această funcție nu trimite nimic la tema sau site-ul dvs., pur și simplu pregătește WordPress pentru utilizarea lor.

 

$ mâner (Necesar) Aceasta este ta nume pentru foaia de stil sau scenariu. Acest lucru poate fi orice vă place, atâta timp cât este unic. Puteți prefixa întotdeauna numele pentru a evita conflictele.

$ src (Necesar) Aceasta este adresa URL a foii de stil sau a scriptului. Poate fi extern sau intern la site-ul dvs. în funcție de ceea ce faceți. Extern este util dacă utilizați un serviciu de tip tri-partid, cum ar fi Tipul de Kit sau Fonturile Google sau pentru Social Media Javascript. Tu ar trebui nu hardcode URL-ul pentru foi de stiluri sau scripturi locale, există funcții adecvate pe care le puteți utiliza pentru acest lucru pe care le vom discuta mai târziu.

$ dependențele (Opțional) Acesta este unul foarte util, deși este opțional. Aceasta vă permite să specificați o serie de dependențe pentru scriptul sau foaia de stil. De asemenea, se va asigura că aceste dependențe sunt încărcate înainte ca scenariul sau stilul dvs. să fie.

$ ver (Opțional) Aici puteți să specificați numărul de versiune a stilului, dacă acesta are unul. Acest lucru este util pentru a vă asigura că versiunea corectă este trimisă browserului unui utilizator, indiferent de cache. Desigur, puteți seta propriile numere de versiune pentru propriile scenarii și stiluri sau puteți folosi un truc mic pentru a obține numere de versiune dinamică.

$ in_footer (Opțional numai pentru Script) În mod normal, scripturile sunt plasate în cu toate acestea, dacă ați setat acest parametru la adevărat scriptul va fi plasat în partea de jos a . Dacă doriți să ieșiți în subsol, atunci trebuie să vă asigurați că tema dvs. are wp_footer () cârlig în locul potrivit.

$ media (Opțional numai pentru stil) Acesta poate fi un șir de caractere pentru a specifica mass-media pentru care a fost definită foaia de stil. (De exemplu. 'toate', 'ecran', „Portabile“, 'imprimare').

Să le punem împreună într-un exemplu frumos:

 

Foarte pe scurt, avem un JavaScript pe care îl sunăm din dosarul temei, este dependent de jQuery, setat la versiunea 1 și dorim să ieșim la sfârșitul paginii noastre. De asemenea, avem și noi style.css că sunăm din dosarul temei, nu are dependență, este versiunea 1.0 și este pentru ecran. De asemenea, este important să rețineți că trebuie să executăm aceste scripturi utilizând un cârlig de acțiune. În acest caz folosim wp_enqueue_scripts ca cârlig de acțiune, așa cum recomandă Codul.

Totul este foarte ușor odată ce ai atârnat și ai obișnuit să o faci!

Să WordPress face grele de ridicare

Acum am înregistrat scripturile și stilurile noastre WordPress știe totul despre ele și acum putem începe să le folosim. Întorcându-ne la noi wp_enqueue_script () și wp_enqueue_style () putem acum să enquege stilurile și scripturile pe care le-am înregistrat în pasul anterior. Funcțiile scripturii și stilului enqueue funcționează foarte asemănător cu funcțiile registrului. Marea diferență este că WordPress va scoate acum JavaScript sau stilul pe pagina pe care o generează.

 

Deoarece am înregistrat deja scripturile și stilurile care le încriu, este foarte simplu. Frumusețea acestui lucru este că ne putem înșela în mod condiționat scenariile și stilurile, astfel încât să le încărcăm doar pe paginile pe care le sunt necesare. De asemenea, deoarece sunt chemați în același cârlig de acțiune, puteți să-i faceți pe toți într-o singură funcție. Aruncați o privire la exemplul de mai jos:

 

Așa că am înregistrat stilul și scenariile noastre corect și le-am înrădăcinat. Avem, de asemenea, un scenariu și stil care sunt enqueued pe pagina noastră de pornire folosind o declarație condiționată.

Acesta este un exemplu perfect al uneia dintre cele mai mari greșeli pe care le văd când văd teme sau pluginuri scrise de alții. Prin a învăța câteva funcții WordPress ușor, puteți încărca în siguranță stilurile și scenariile și asigurați-vă că toate dependanțele sunt în vigoare. De asemenea, dacă cineva utilizează un plugin pe care l-ați scris, este ușor pentru ei să facă modificări fără a le șterge prin actualizări. Tot ce trebuie să faceți este să vă copiați CSS-ul pe tema lor și vă pot dezabona stilul și vă puteți înregistra propriile!

Puteți vedea un tutorial complet despre modul de utilizare a acestor funcții în partea de jos a acestui tutorial.


JavaScript vă ucide puii

 

Dacă ați pus vreodată acest lucru în tema dvs., plugin sau orice altceva de a face cu WordPress tocmai ați ucis un pisoi. Am discutat deja importanța înregistrării și încorporării scripturilor și a stilurilor dvs. Deci, de ce anulați toate eforturile depuse. WordPress vine însoțit de o mulțime de scripturi pentru ca dvs. să le utilizați pur și simplu prin înscrierea acestora. Bineînțeles că puteți, chiar și atunci când faceți lucrurile în mod corect, să vă desființați versiunea inclusă a unui script și să vă înregistrați propria versiune. Ca mai sus, poate că vrem să folosim versiunea Google CDN. Acest lucru este bine dacă lucrați pe propriul dvs. site, în propria temă sau plugin privat și nu o veți elibera. Cu toate acestea, dacă vă publicați public codul stick la bibliotecile incluse. Alte pluginuri se pot rupe, temele ar putea să nu mai funcționeze pentru că nimeni nu respectă regulile. Deseori găsesc site-uri cu 3 sau 4 versiuni diferite ale jQuery încărcate, pur și simplu pentru că oamenii nu se înregistrează și încrucișă în mod corespunzător sau un autor de plugin vrea să folosească o versiune diferită a ceva.

Să ne facem o favoare și să respectăm niște standarde!

Avertizare: Plugin-urile sau temele care utilizează o bibliotecă neacordată vor fi respinse dacă sunt trimise atât la depozitul ThemeForest cât și la depozitul WordPress.org!

Acum este, de asemenea, important să vorbim pe scurt despre jQuery. Este masiv, toată lumea o folosește, temele îl iubesc și plugin-urile îl iubesc. Cu toate acestea, poate provoca probleme dacă nu este utilizat corect. Biblioteca jQuery inclusă în WordPress se încarcă în modul "fără conflict". Acest lucru îi permite să lucreze de-a lungul celorlalte biblioteci pe care le poate utiliza WordPress. Cu toate acestea, în modul fără conflict $ comanda rapidă nu funcționează și a fost înlocuită cu ceva mai lung jQuery.

 $ (document) .ready (funcția () $ (# myfuntion) ...);

Cele de mai sus trebuie să fie re-scris pentru a lucra, cel mai simplu mod este să folosești următorul pachet:

 jQuery (document) .ready (funcția ($) $ (# myfunction) // Acum $ () funcționează ca un alias pentru jQuery () în interiorul acestei funcții!);

Problema cu încărcarea unei versiuni externe a jQuery este că este posibil să nu se încarce în mod fără conflict, poate rupe alte scripturi și autorul ar fi scris JavaScript fără a urma regulile de mai sus. Înseamnă că totul se rupe atunci când încercați să utilizați versiunea jQuery inclusă! Întotdeauna încercați să folosiți bibliotecile grupate și scrieți întotdeauna JavaScript / jQuery în mod fără conflict!

Puteți obține mai multe informații despre WordPress și jQuery pe pagina Codex.


Găsește-ți drumul în jurul tău

Cum obțineți calea adresei tematice? Cum direcționați oamenii către pagina de pornire a site-ului? Mulți dezvoltatori încă nu știu cum să facă niște lucruri de bază cu WordPress. Voi scoate câteva dintre cele mai comune.

  1. Obținerea locației temei: Dacă utilizați templatePath sau bloginfo ('template_directory'). Stop! Ar trebui să utilizați foarte util get_template_directory () după cum se vede în exemplele mele de mai sus.

    Există de fapt 4 variații ale acestei funcții:

    1. get_template_directory () returnează PATH în dosarul tematic. Util de utilizat în interiorul funcțiilor PHP sau include.
    2. get_template_directory_uri () returnează adresa URL în dosarul tematic. Util pentru enqueueing și înregistrarea script-uri și stiluri și dacă doriți să includă și imagine.
    3. get_stylesheet_directory () returnează PATH în dosarul stilistic. Acest lucru va indica întotdeauna tema Child, dacă unul este în uz în timp ce get_template_directory () va indica întotdeauna tema maternă.
    4. get_stylesheet_directory_uri () returnează adresa URL în dosarul de stil. Ca și în cele de mai sus, acest lucru va indica întotdeauna tema Child, dacă unul este în uz.

    Asigurați-vă că utilizați funcția corectă. Dacă vă așteptați ca utilizatorii să înlocuiască tema într-o temă pentru copii, atunci este mai bine să utilizați funcția corectă.

  2. Obținerea locației plugin-ului: Cu pluginuri există două funcții diferite de utilizat:
    1. plugin_dir_url () returnează adresa URL a fișierului plugin care a trecut.
    2. plugin_dir_path () returnează calea directorului fișierului de plugin introdus.

    Cu plugin-uri, mi se pare întotdeauna mai ușor să definiți un drept constant la început și să îl folosiți în plugin-ul meu.

     
  3. Obținerea adresei URL a site-ului: Este o cerință destul de comună, poate doriți să adăugați pur și simplu un link la pagina dvs. de pornire? Ca să nu mai folosiți directorul de temă bloginfo (). Exemplul de mai jos oferă un exemplu foarte bun despre cum să procedați corect.
     "> Acesta este un link către pagina noastră de pornire

Dacă vă îndoiți de ceva, atunci citiți Codex-ul într-adevăr vă ajută! Folosind funcțiile corecte pentru a vă aduce în jur de WordPress, este mult mai probabil ca pluginul sau tema dvs. să nu se ciocnească sau să interfereze cu codul altora. Nu este nimic mai frustrant decât încercarea de a depana o eroare în propriul cod doar pentru a găsi că este un alt plugin care este încurcat totul altceva!


Plugin sau Tema?

Acesta a fost un punct de discuție în rândul comunității pentru vârste. Ar trebui să-mi pun funcționalitatea în interiorul temei sau într-un plugin? Întotdeauna găsesc că răspunsul simplu este acesta: funcționarea dvs. va funcționa dacă utilizați o temă diferită? Ceea ce vreau sa spun aici este daca adaugati functii suplimentare, poate un tip de post personalizat sau un efect custom lightbox pentru imagini, va functiona cu orice tema sau poate functiona cu orice tema? Nu este nimic mai rău decât petrecerea de vârstă înființarea unui site cu o mulțime de minunate tipuri de posturi personalizate adăugând o mulțime de conținut doar pentru a vă găsi schimbați tema și totul dispare.

De obicei, urmez această regulă simplă, dacă poate fi un plugin, fă-o una. Temele sunt menite să se ocupe în mod specific de stilul vizual al unui site, și nu de funcționalitatea acestuia. Pluginurile sunt pentru funcționalitate. Acum, dacă plugin-ul dvs. scoate ceva, deoarece majoritatea sunt, puteți să verificați cu ușurință tema activă pentru fișierele șablon necesare și să reveniți la fișierele de șablon ale pluginului, dacă este cazul. De fapt, în cele mai multe cazuri plugin-urile mele vin așa. Cel puțin atunci veți da utilizatorului posibilitatea de a modifica modul în care arată fără să-și piardă modificările dacă publicați o actualizare. Voi încerca să acopere acest lucru într-un tutorial viitor, totuși lecția aici este menținută mai simplă. Împărțirea funcționalității până la bucăți de mărime de mâncare dă utilizatorului posibilitatea de a alege, dacă nu le plac butoanele de distribuire socială, să le dezactiveze sau să le înlocuiască cu propriile lor. Mai multe pluginuri, pagini cu opțiuni tematice mai puțin complicate!


Filtre de acțiune și cârlige, de ce nu le folosiți?

Acesta este un alt punct pe care am vrut să-l ridic pe scurt, deoarece știu că există câteva tutoriale excelente despre acțiuni și filtre (unul este legat la partea de jos pentru tine). Indiferent ce tip de dezvoltare WordPress faceți, aflați despre acțiunile și filtrele. Aceasta este una dintre cele mai mari greșeli pe care le văd oamenii. WordPress are un API excelent pentru dezvoltarea temelor și a plugin-urilor și vă poate face mult mai bine dezvoltarea folosind instrumentele pe care WordPress le pune acolo pentru dvs. Cele mai bune plugin-uri de acolo folosesc extensiv acțiunile și filtrele, astfel încât dacă doriți să personalizați modul în care funcționează pentru dvs. este simplu.

Un exemplu este WooCommerce de la WooThemes. Acum, în timp ce nu sunt un fan al panourilor opționale masive pe care le pun în temele lor, WooCommerce a fost construit cu alți dezvoltatori în minte. Aproape totul poate fi personalizat sau înlocuit prin simpla înlăturare a acțiunilor sau înlocuirea acestora. Acțiunea lor și filtrele de referință sunt extinse și într-adevăr nu vă permit să lucrați alături de ea exact cum doriți. Acum nu mă aștept să mergeți în această măsură pentru propriile dvs. proiecte, dar putem învăța aici câteva lecții importante. În cazul în care codul dvs. este ușor de personalizat fără să-l hackezi, atunci oamenii sunt mai predispuși să îl folosească, să îl revizuiască și să îl recomande!

Acțiunile și filtrele sunt unul dintre cele mai importante lucruri pe care ar trebui să le înveți despre dezvoltarea WordPress, să iei ceva timp și vei ajunge acolo!


Concluzie

Am acoperit mult în acest articol și sper că a fost de folos. Vreau doar să vă descompun și mai mult:

  1. Urmați standardele de codare WordPress
  2. Fiți în concordanță cu codul dvs.
  3. Utilizați documentația! Codul este biblia voastră
  4. Utilizați funcțiile care există din motive corecte
  5. Gândește-te unde ți-ai pus codul
  6. Utilizați acțiunile și filtrele

Când copiați și inserați codul pe care l-ați găsit de la Google, faceți un minut să îl priviți, înțelegeți-l și încercați să aplicați cele de mai sus. Respectă standardele de codificare? Utilizează funcțiile corecte? Ce face jQuery? Sunteți doar 1 temă sau plugin departe de toate aceste puncte devenind a doua natură. Data viitoare când vedeți o greșeală, încercați să o remediați!

postări asemănatoare
  • Cum să includeți Javascript și CSS în temele și pluginurile WordPress
  • Ghidul începătorului pentru acțiunile și filtrele WordPress
Cod