DE{CODE}: Tematica modernă și viitorul WordPress: lucrul cu editarea completă a site-ului și nu numai

Publicat: 2023-02-12

WordPress 5.9 a introdus Editarea completă a site-ului la bază, ceea ce înseamnă o schimbare majoră în modul în care construim site-uri web cu WordPress. În această sesiune DE{CODE}, alăturați-vă avocatului pentru dezvoltatori WP Engine, Nick Diego, în timp ce despachetează aceste modificări, precum și câteva modalități prin care le puteți utiliza pentru a construi site-uri web mai bune - modul modern WordPress.

Video: Lucrul cu editarea completă a site-ului și nu numai

Diapozitive de sesiune

Tematică modernă și viitorul WordPress - Lucrul cu editarea completă a site-ului și Beyond.pdf de la WP Engine

Transcriere text integral

NICK DIEGO : Bună ziua și bun venit la „Lucrul cu editarea completă a site-ului și viitorul tematicii moderne în WordPress.” Numele meu este Nick Diego și sunt un avocat al dezvoltatorilor aici la WP Engine. Așadar, puțin despre mine – așa că am început să lucrez cu WordPress încă din 2012. Am fost în primul rând un dezvoltator de pluginuri și de atunci am trecut la a face multe cu teme de bloc. De fapt, m-am alăturat WP Engine în noiembrie 2021, așa că acesta este un fel de nou concert pentru mine. Sunt pasionat de blocuri și modele și de orice editare pe site, motiv pentru care nu aș putea fi mai încântat să fac această prezentare astăzi.

Deci, ce este editarea întregului site? Am auzit multe despre asta în ultimii ani. Deci, este de fapt „o colecție de funcții care aduce experiența familiară și extensibilitatea blocurilor în toate părțile site-ului dvs., mai degrabă decât doar postări și pagini”. Deci, este de fapt o umbrelă de caracteristici, care includ lucruri precum Editorul de site, Stiluri globale, blocuri tematice, Șabloane și, desigur, Teme bloc.

Deci, în conversația noastră de astăzi, vom acoperi câteva lucruri diferite. Vom începe cu elementele de bază. Vreau să mă asigur că suntem cu toții pe aceeași pagină, mai ales din punct de vedere terminologic. Apoi vom vorbi despre anatomia unei teme de bloc, apoi despre stiluri globale, setări în care include fișierul theme.json. Și, în sfârșit, îmi voi împărtăși gândurile despre tematica modernă și cum va arăta.

Deci, în prezentarea de astăzi, vom folosi o grămadă de exemple diferite, iar acestea vor fi din tema 2022, care a fost inclusă în WordPress 5.9 încă din ianuarie 2022. Aceasta este o temă bloc care a fost dezvoltată de Core. Echipa WordPress și este un loc grozav de început și este disponibil în depozitul de pluginuri, așa că nu există o temă mai bună de folosit pentru exemple.

Deci, pe măsură ce începem astăzi, din nou, vom începe cu elementele de bază. Și nu există nimic mai de bază decât un bloc. Deci, dacă ați folosit WordPress în ultimii ani, probabil că sunteți foarte familiarizat cu blocurile. Ele sunt unitatea fundamentală de conținut în WordPress. Poate fi un paragraf de text într-o galerie de imagini. Poate lua aproape orice formă. Și ideea din spatele editării întregului site este că, în curând sau acum, totul de pe site-ul tău va fi un bloc. Vom discuta mai multe despre cum funcționează.

Acum, aici avem un exemplu de o grămadă de blocuri diferite care sunt în prezent în WordPress. Cele două coloane din stânga cu care ar trebui să fiți familiarizați. Avem paragrafe și titluri și blocuri de acoperire – așa mai departe și așa mai departe. În 5.9 – din nou, care a fost lansat anul acesta – avem acum ceea ce se numește blocuri tematice. Acestea sunt blocuri care sunt conținut pe care, în mod tradițional, nu l-ați putea edita direct din WordPress.

Acestea includ lucruri precum sigla site-ului dvs., bucla de interogare, fragmentul postării, autorul postării. Acestea sunt toate tipurile de conținut de care ați avea nevoie pentru a vă scufunda în fișierele șablon bazate pe PHP și pentru a codifica direct sau pentru a utiliza un plugin terță parte care v-a ajutat la editarea acestor zone. Și toate acestea vin sau au venit la WordPress și permit utilizatorilor să le editeze direct și toate iau forma unui bloc.

În continuare, vrem să vorbim despre modele. Modelele sunt un fel de piatră de temelie a experienței de editare a întregului site. Modelele ar putea fi o conversație întreagă în sine, dar vă vom oferi o mică previzualizare despre modele dacă nu sunteți familiarizat. Deci, din nou, un model este doar o colecție predefinită de blocuri care formează un aspect specific. Un model ar putea fi un singur bloc cu un anumit stil. Ar putea fi mai multe blocuri.

Modelele permit utilizatorilor, cu un singur clic, să insereze un întreg design direct în site-ul lor, mai degrabă decât să fie nevoiți să construiască designul manual, câte un bloc, ceea ce poate accelera cu adevărat dezvoltarea unui site. De asemenea, este foarte util dacă îți amintești – vezi această demonstrație frumoasă a site-ului web și are tot acest conținut acolo. Și instalezi tema și este ca, ei bine, cum obțin acel demo? Modelele rezolvă asta pentru tine, deoarece autorul temei poate oferi o mulțime de machete de pagină sau modele individuale pe care, cu un singur clic, un utilizator le poate insera și obține acel demo pe care l-a văzut și de care a fost atras când a ales tema.

Deci, să aruncăm o privire rapidă la un model aici. Avem doar un titlu simplu, ceva text și câteva butoane. Și acesta poate fi, din nou, inserat cu un singur clic în pagină și vedem aici că este alcătuit din trei blocuri diferite, un bloc de titlu, un bloc de paragraf și un bloc de butoane.

Acum, cu 5.9, din nou, care a apărut anul acesta, am văzut introducerea Pattern Explorer. Deci tema 2022, pe care am menționat-o mai devreme, cea pe care o folosim în toate exemplele noastre, se numește tema Hatchery – o mulțime de păsări. Și puteți vedea aici în Exploratorul de modele, avem o grămadă de modele diferite pe care autorii temei le-au construit.

Deci, ca utilizator, pot introduce oricare dintre acestea direct pe site și obțin aceeași estetică pentru care autorul temei a creat tema, deci seria de difuzoare, câteva păsări una lângă alta – orice doriți. Iar modelele și modelele care sunt servite cu o temă sunt foarte importante pentru acea experiență de editare pe întregul site.

În continuare, avem Editorul. Nu putem să nu vorbim despre Editor. Dacă ați folosit WordPress, probabil că sunteți foarte familiarizat cu acest lucru. Dar vreau să menționez acest lucru, deoarece Editorul a primit multe nume diferite în trecut – Editor de bloc, Gutenberg, Editorul Gutenberg. În scopul acestei discuții, vom apela doar la Editor. Acesta este numele oficial al lui și asta va fi ceea ce vedeți aici. Din nou, acesta a fost introdus înapoi în WordPress 5.0 la sfârșitul anului 2018.

Deci, în Editor, trebuie doar să faceți clic pe Insertor și vă puteți introduce blocurile și modelele. Acum, am vrut să arăt ecranul pentru că în continuare trebuie să vorbim despre Editorul site-ului. În cele din urmă, probabil că prefixul de site al Editorului de site va dispărea și vom avea doar Editorul. Dar Editorul de site este o experiență coerentă care vă permite să editați și să navigați direct între diferite șabloane, părți de șablon, opțiuni de stil și multe altele.

Deci, practic, Editorul site-ului preia editorul nostru standard cu care ne-am obișnuit în ultimii ani și îl duce la nivelul următor, permițând utilizatorilor să editeze zone suplimentare ale site-ului dvs., care sunt toate acum alimentate de blocuri. Așadar, WordPress 5.9 a introdus editarea întregului site și, odată cu aceasta, Editorul de site. Și în versiunea 6.0, care va fi lansată în mai, vom vedea o mulțime de îmbunătățiri ale acestui lucru, ceea ce este foarte interesant.

Deci, dacă utilizați o temă de blocare precum 2022, veți putea accesa Editorul site-ului. Există două moduri diferite, bara laterală de sus și apoi sub secțiunea de aspect. Acum, Editorul site-ului, din nou, pentru că face parte din – este foarte puternic, este disponibil doar pentru administratori. Deci, nu vă faceți griji, editori, nu vor putea accesa Editorul site-ului. Trebuie să fiți administrator pentru a accesa Editorul site-ului.

Și odată ce am sărit aici, arată foarte asemănător cu editorul standard, dar vei observa ceva puțin diferit. În partea de sus, aici, avem Acasă. Și asta ne spune că de fapt edităm șablonul home.HTML și avem câteva zone diferite ale paginii pe care le putem edita separat. După cum puteți vedea aici, avem antetul și subsolul.

Deci, acesta este ceva ce nu ai putut niciodată să faci înainte. Nu ați putea edita niciodată home.PHP, dar acum șablonul HTML direct din interfață, nu fără o altă extensie terță parte.

Și dacă facem clic în pagină și în vizualizarea listă, putem vedea că avem o buclă de interogare. Din nou, acele teme familiare de construire sunt probabil foarte, foarte, foarte familiarizate cu construirea de bucle în cadrul șabloanelor pentru teme, dar aici putem face asta cu blocuri folosind bucla de interogare. Și putem vedea, de asemenea, câteva dintre acele blocuri tematice precum titlul postării, imaginea prezentată, fragmentul postării și data postării. Toate acestea pot fi mutate și modificate de către utilizator din interfață fără a fi necesară nicio codificare.

Acum, dacă faceți clic pe o pictogramă WordPress sau pe pictograma site-ului, putem obține această bară laterală. Și apoi putem vedea că avem acces la toate șabloanele și părțile noastre de șabloane. Acum, vreau să remarc că fluxul – toate aceste ecrane sunt pe deplin în curs de dezvoltare. Editarea completă a site-ului este încă în versiune beta și urmează o mulțime de perfecționări și îmbunătățiri. Deci ceea ce vedem astăzi poate să nu arate la fel în șase luni, dar este un început fantastic.

Deci, dacă mergem la șabloane, putem vedea toate șabloanele care sunt incluse cu 2022. Ar trebui să vedeți unele familiare precum Pagina și Index și Pagina principală și 404. Și apoi, dacă mergem la părțile noastre de șabloane, putem vedea unele personalizate. părți șablon care au fost incluse de autorii temei. Deci avem câteva anteturi diferite și avem un subsol.

Acum, din nou, toate acestea sunt editabile de către utilizator. Și așa, dacă vedem acest punct mic aici, putem vedea că această parte a șablonului de antet a fost editată de mine. Acum, când editați o parte de șablon sau un șablon, acele modificări sunt salvate în baza de date. De fapt, nu modifică șabloanele din tema dvs., ceea ce este grozav deoarece puteți reveni oricând la șabloanele de teme sau la părțile șablonului.

Dar din nou, dacă facem clic aici, putem începe să edităm acea parte a șablonului de antet și veți vedea că toate acestea sunt formate din blocuri. Deci, este aceeași experiență pe care ați folosi-o în Editor atunci când editați o postare sau o pagină. Puteți face acest lucru acum în interiorul Editorului de site pentru toate șabloanele și părțile de șablon.

Așadar, a fost o prezentare rapidă a Editorului de site și a modului în care funcționează, dar acum vreau să vorbesc despre anatomia unei teme bloc, care este componenta fundamentală principală a editării întregului site. Deci, cum funcționează anatomia unei teme bloc? Ei bine, este de fapt împărțit în câteva categorii diferite. Deci avem teme bloc. Aceștia îmbrățișează pe deplin editarea întregului site. Șabloanele de teme sunt compuse în întregime din blocuri. Șabloanele și părțile de șablon sunt mai degrabă HTML decât PHP.

Și apoi vreau să remarc că o temă de bloc poate fi foarte simplă. Tot ce trebuie să facă este să fie format dintr-un fișier style.CSS și un fișier index.html, precum și un fișier index.PHP. Acest fișier PHP este un fel de rămășiță a dezvoltării tradiționale de teme WordPress și probabil va dispărea în viitor.

Și, în sfârșit, majoritatea temelor bloc includ un fișier theme.JSON. Vom vorbi despre asta separat. Este un subiect foarte important referitor la setările și stilurile globale. Deci, să aruncăm o privire asupra structurii fișierelor tematice. Deci, acesta este 2022, o versiune prescurtată a structurii fișierelor din interiorul anului 2022. Și putem vedea acele fișiere necesare chiar aici.

Apoi observăm și că există câteva foldere, și anume Templates și Template Parts. În fiecare dintre aceste foldere, aveți toate fișierele HTML pentru fiecare șablon și parte de șablon. Ceea ce nu este vizibil aici, ceea ce este de fapt foarte interesant, așa că am vrut să introduc acest lucru, Gutenberg, pluginul Gutenberg, unde se face toată această editare viitoare a site-ului de dezvoltare, a introdus recent un nou folder numit Patterns. Deci, puteți plasa fișierele de model chiar în folderul Pattern, iar WordPress le va înregistra pentru dvs. Doar o scurtă privire. Vă încurajez să verificați Gutenberg și toate noile funcții.

Dar să revenim la slide aici. Avem șabloanele și părțile de șablon. Și puteți vedea fișierele HTML individuale pentru fiecare. Acum, pentru a înțelege mai bine cum funcționează, vom arunca o privire la fișierul 404.HTML. Acesta este un fișier sau o pagină de pe site-ul dvs. pe care nu ați putea-o edita direct decât dacă ați accesat codul sau dacă ați folosit o resursă terță parte care v-ar permite să editați acest șablon.

Deci, revenind la Editorul site-ului, putem vedea că pagina noastră 404 este chiar aici. Dacă facem clic pe acesta, utilizatorul poate acum edita diferitele componente ale acelui șablon. Cu toate acestea, să aruncăm o privire la ce cod HTML real alcătuiește acest șablon, codul care este de fapt în temă.

Deci, aici, putem vedea că avem fișierul nostru 404.HTML și are o grămadă de markup. Începând de sus și de jos, vedem că avem specificația pentru un bloc de piese șablon. Ceea ce face aceasta este că face referire la părțile noastre de șablon înregistrate și le trage în șablon. Deci, dacă ne întoarcem aici, putem vedea că avem o parte footer.HTML și o parte header.HTML. Și la asta se face referire aici.

Deci, acesta este un bloc unic care vă permite să introduceți șabloane care sunt compuse din alte blocuri. Acum, desigur, puteți include doar toate blocurile care ar alcătui un antet și toate blocurile care alcătuiesc un subsol, dar referindu-vă la partea de șablon, puteți face totul într-un singur loc și apoi aplicați aceeași parte de șablon pe toate șabloanele dvs., similar cu ceea ce ați face într-un WordPress tradițional cu PHP.

Acum, pe măsură ce ne uităm mai departe, avem un marcaj, doar un marcaj principal și apoi avem un div. Nu am de gând să intru prea adânc în asta. Există câteva lucruri interesante aici, și anume aspectul de aici, adevărat, care face unele setări de aspect, dar acesta este doar un marcaj general pentru pagină, modelul 404.

Acum, am menționat modelul. Cele 404 din această temă sunt de fapt grupate într-un model. Deci, toate blocurile care alcătuiesc conținutul 404 sunt într-un model. Și apoi avem un bloc de model care face referire la acel model și apoi trage acele blocuri. Acum, bineînțeles, din nou, ați putea include aici toate blocurile care alcătuiesc pagina 404, dar punându-le într-un model și apoi referindu-le, o face puțin mai ușor de gestionat.

Deci, când revenim la Editorul site-ului, avem conținutul nostru și putem vedea diferitele secțiuni. Deci partea de sus este acea parte a șablonului de antet care este introdusă. Și apoi, evident, secțiunea principală este acel model 404 care este introdus. Și acum, deoarece acestea sunt toate blocuri, tot ce trebuie să facem este să le editam așa cum am face-o în mod normal . O putem face îndrăzneață. Am putea schimba culoarea. Am putea elimina blocuri, am putea adăuga blocuri – așa mai departe și așa mai departe.

Destul de ușor și nu a fost nevoie să edităm deloc niciun cod. Trebuia să înțelegem cum funcționează codul, dar nu trebuia să atingem niciun cod. Apoi, când suntem fericiți, facem clic pe Salvare. Din nou, aceste modificări sunt salvate în baza de date, deci nu modificați de fapt fișierele teme. Deci, dacă ar fi să anulăm modificările, ne vom întoarce la orice ne oferă tema.

Unul dintre lucrurile grozave despre Editorul de site – și din nou, acesta este încă în curs de dezvoltare – este că puteți adăuga noi părți de șablon. Deci, din nou, această temă adaugă o grămadă de anteturi și subsoluri diferite, dar dacă am dori să adăugăm mai multe? Poate am vrut o bară laterală. Poate am vrut diferite secțiuni de conținut. Putem face asta chiar în Editorul site-ului.

Și din nou, acest flux va fi îmbunătățit – mai multe caracteristici, mai multe funcții. Dar în prezent este funcțional și puteți adăuga totul chiar aici. Un lucru de remarcat este că nu puteți adăuga încă șabloane în Editorul site-ului. Puteți într-o interfață diferită în interiorul editorului WordPress, dar nu încă în Editorul site-ului. Dar asta va veni.

Deci ultima parte din aceasta este că am vorbit despre realizarea tuturor acestor schimbări. Ei bine, ce ar fi dacă ați putea exporta toate modificările dvs. ca o singură temă care de fapt vine și este de fapt foarte interesant să vedeți cum va avea impact asupra dezvoltării temei. Deci, cu cea mai recentă versiune a lui Gutenberg, acum puteți exporta toate modificările, plus tema originală.

Acestea sunt îmbinate și o puteți exporta ca o temă nou-nouță, cu toate modificările aplicate fișierelor din cadrul temei. Așa că vă puteți imagina că luați 2022. Îl încărcați. Tu faci toate modificările. Puteți modifica unele șabloane și apoi exportați o temă completă. Are câteva implicații foarte interesante pentru dezvoltarea viitoare a temei.

Acum trebuie să vorbim despre setările și stilurile globale. Acesta este fișierul theme.JSON. Acest lucru este nou pentru WordPress și pe cât de interesant, pe atât de complicat. Deci, dacă ne uităm înapoi la tema 2022, putem vedea acel fișier stând în partea de sus acolo. Și când accesăm fișierul theme.JSON, este într-adevăr cinci secțiuni, una fiind doar numărul versiunii.

Și voi vorbi pe scurt despre șabloanele personalizate și părțile de șablon. Deci, aici, dacă ai avea un șablon personalizat, un șablon complet personalizat, unul pe care WordPress nu l-ar recunoaște în mod natural, acolo îl poți înregistra aici. De asemenea, aici înregistrați toate acele părți ale șablonului, cum ar fi anteturile și subsolurile. Orice șablon tradițional, cum ar fi Index, Pagina, Postare – acele șabloane pe care WordPress le recunoaște în general – nu trebuie să le puneți aici, doar personalizate și, desigur, propriile părți de șablon.

Dar tema tema.JSON este secțiunea de setări și stil. Deci, dacă ne uităm mai întâi la setări, se întâmplă multe aici. Și din nou, acest lucru este foarte prescurtat. Dar partea de sus sunt setările globale. Acestea sunt setări care influențează Editorul și Editorul site-ului pe întregul site. Acestea includ lucruri precum chenar și culoare și tipografie. Aici ați seta paleta de culori pentru tema dvs., setările de tipografie pentru tema dvs., fonturile - așa mai departe și așa mai departe.

Și apoi avem și setări la nivel de bloc, unde ați putea, să zicem, să setați o paletă de culori pentru întregul dvs. site, dar apoi să setați o paletă de culori mai mică și o paletă de culori complet diferită, de exemplu, pentru blocul de paragraf sau pentru blocul de butoane. Prin urmare, oferă o mare flexibilitate, dar setările sunt caracteristicile disponibile pentru un utilizator în Editor sau într-un bloc.

Deci, dacă ne uităm, din nou, la culoare, am definit aici paleta noastră. Avem o culoare de prim plan, un fundal și apoi primar, negru, alb și un fel de verde de pădure. Și apoi, dacă intrăm în Editor, putem vedea că atunci când apare selectorul nostru de culori, avem acele culori definite pentru ca utilizatorul să le selecteze.

Acum, să intrăm în stil. Deci, stilurile sunt practic ca CSS-ul tău. Deci, în mod tradițional, ați adăuga toate CSS-urile într-un fișier styles.CSS sau într-o altă configurație. Dar secțiunea de stiluri din theme.JSON vă permite să setați stilul la nivel de bloc și, de asemenea, la nivel global pe întreaga temă. Gândiți-vă la acestea ca la valori implicite, corect, pentru că Editorul – ideea este că utilizatorii pot intra acolo și pot începe să modifice și să facă modificări și să își proiecteze site-ul așa cum le place folosind blocuri.

Dar trebuie să existe o valoare implicită, iar acestea sunt setate în secțiunea de stil din theme.JSON este implicit. Deci, din nou, avem stilurile globale, cum ar fi culorile noastre globale, tipografia globală, și apoi putem seta și stiluri la nivel de bloc. Deci, problema stilurilor globale este aici în care am seta culoarea de fundal a temei noastre. Aici am seta dimensiunile fonturilor pentru titlurile noastre, diferitele opțiuni de tipografie pentru linkuri, text și titluri și tot felul de lucruri. Și la nivel de bloc, putem face același lucru, dar special pentru blocuri.

Acum, unul dintre lucrurile frumoase despre secțiunea de setări despre care tocmai am vorbit este că, de fiecare dată când creați o setare, WordPress va defini o variabilă. Deci, când ne uitam la acea paletă de culori, am definit fundal, prim-plan și primar. WordPress va genera de fapt o variabilă care se mapează la acel cod hex, indiferent de codul hex setat pentru primar, prim-plan, fundal.

În stiluri, putem folosi acele variabile pentru a defini stilurile atât pentru stilurile globale, cât și pentru cele la nivel de bloc. Avantajul acestui lucru este că, dacă un utilizator ar trebui să schimbe vreodată culoarea de fundal, atunci va curge prin specificația de stil din theme.JSON. Acum, dacă aruncăm o privire la secțiunea de blocuri, aici avem blocul nostru de butoane și îl avem de la un designer de teme.

Am vrut ca butoanele mele să aibă o culoare implicită de verde cu ceva text alb. Puteți vedea că în secțiunea de culoare a blocului de butoane, definim culoarea de fundal este cea primară, adică acel verde pădure, iar textul nostru este fundalul, care este alb. Deci, putem folosi acele variabile în theme.JSON pentru a defini stiluri pentru blocurile noastre și pentru site-ul însuși.

Acum, acest lucru se leagă de stiluri globale, la care am făcut aluzie mai devreme. Așa că înapoi în Editorul site-ului, dacă facem clic pe acest mic cerc cu două tonuri din partea de sus, vom deschide panoul nostru global de stiluri. Acum, se întâmplă multe aici, așa că voi face doar o demonstrație rapidă a modului în care funcționează. Dar să știți că vă încurajez să descărcați tema 2022 sau o altă temă bloc și să explorați cu adevărat stilurile globale.

Și dacă urcăm aici și ne uităm la culori, facem clic pe acestea, acum putem vedea că paleta de culori este acolo, cea oferită de temă, precum și câteva elemente diferite, cum ar fi fundalul, textul și linkurile noastre. . Acum, la acest panou pe care îl analizăm aici, edităm elementele globale ale site-ului. Deci, de exemplu, am vorbit despre fundalul site-ului. Chiar acum, este alb. Deci, dacă dau clic pe Fundal, pot intra aici și pot vedea că este selectat ca alb. Aceasta este culoarea pe care am stabilit-o în theme.JSON.

Dar dacă îmi place foarte mult această culoare de piersici? Ei bine, cu un singur clic, pot face clic și iată-ne. Culoarea noastră de fundal a site-ului nostru este acum piersici. Deci, acest lucru oferă utilizatorului un control fără precedent pentru a-și modifica complet site-ul pentru a se potrivi nevoilor sale. Dar, din nou, theme.JSON oferă implicit pe care, în calitate de dezvoltator de teme, o oferi utilizatorului, iar apoi o poate prelua de acolo.

Așadar, aceasta a fost o prezentare foarte scurtă a editării întregului site și a Editorului de site și a temelor de blocare. Dar vreau să îmi iau ceva timp și să vorbesc despre gândurile mele despre viitorul tematicii moderne. Deci, când ne gândim la tematica modernă, tematica modernă, cred, va pune accent pe design în detrimentul dezvoltării. Acum, s-ar putea să vă gândiți, ei bine, proiectarea temelor este întotdeauna despre design.

Dar dacă te gândești la dezvoltarea tradițională a temei, a fost nevoie de multă codare reală. Toate fișierele șablon au fost PHP, ceea ce a necesitat o cantitate semnificativă de cunoștințe despre WordPress, precum și despre dezvoltarea PHP pentru a face și a fi corect. Ei bine, asta se cam schimbă. Vedem că acum, cu Editorul, puteți proiecta teme direct în interfața de utilizare a Editorului de site și a editorului tradițional.

Și acesta va fi un rol major în modul în care proiectăm teme. Deci, sunt un susținător al dezvoltatorilor pentru WP Engine și, în echipa noastră, construim o temă experimentală numită Frost. Și atunci când facem un model nou sau vrem să modificăm un șablon, nu vom intra în fișiere și nu le modificăm. Intrăm în Editorul site-ului sau intrăm în Editor și modificăm acel model, sau construim un model sau construim un șablon. Și apoi suntem mulțumiți de el, apoi îl exportăm și apoi îl punem în temă.

Deci nu codificăm de fapt. De fapt, facem totul vizual. Și beneficiul acestui lucru este că știm că un utilizator, oamenii care vor folosi tema, vor fi, de asemenea, acolo să modifice modelul sau să modifice șablonul. Și așa că are sens ca, în timp ce construim tema, facem același proces pe care l-ar face un utilizator pentru a folosi tema, ceea ce cred că este un fel de magic.

Și acest lucru va duce la o metodă low-code sau chiar fără cod de dezvoltare a temei. Acum, desigur, suntem la o conferință pentru dezvoltatori, nu? Și așa vorbim despre niciun cod și cod redus. Dar ultimul meu punct, vom vorbi despre unde cred că se află dezvoltarea. Dar cred că acest lucru este foarte interesant pentru că va aduce o nouă generație de utilizatori, oameni care doresc să-și construiască propria temă, să-și personalizeze propria temă, dar poate că nu știu PHP, poate că nu știu JavaScript. .

Ei pot face toate acestea acum în Editorul site-ului, ceea ce cred că este un fel de etosul WordPress, democratizarea publicării. Și cred că editarea întregului site chiar se străduiește în acest sens. Și în ultimii doi ani sau anul trecut, sincer, am văzut un astfel de progres cu editarea integrală. Devine destul de interesant. Deci, cred cu adevărat că editarea întregului site este viitorul WordPress tradițional.

Acum, s-ar putea să nu fie pentru toată lumea. Vreau să fac asta foarte clar. Și mai este nevoie de multă dezvoltare. Deci, când vorbim despre diferite tipuri de oameni care folosesc WordPress, avem totul, de la utilizatorul standard până la agenții. Iar agențiile ar putea dori să ofere o interfață foarte curată, foarte structurată pentru ca clienții lor să o utilizeze și să lucreze pe site-urile lor web. Este posibil să nu fie editarea întregului site. Cred că e în regulă.

Dar, așa cum vedem în economie, avem Squarespace și Wix și Element sau alți generatori de pagini. Există un contingent uriaș al comunității web de utilizatori care își dorește un instrument care să le permită și să le împuternicească să editeze și să proiecteze propriul site. Și cred că WordPress chiar a lipsit în WordPress, în special în Core. Și cred că acesta este scopul editării întregului site și asta este un fel de promisiunea editării întregului site.

Deci multe de făcut. Mai sunt o tonă de făcut. Încă trebuie să le dăm seama de multe lucruri, și anume lucruri precum controalele receptive și cum restricționăm diferite componente ale interfeței de utilizare, astfel încât anumiți utilizatori să nu încurce designurile sau să modifice lucruri pe care nu ar trebui să le modifice. Deci multe lucruri de aflat încă.

Dar unul dintre domeniile care cred că este cu adevărat incitantă este dezvoltarea pentru editarea întregului site. Acum că avem acest instrument care le permite utilizatorilor să-și creeze propria temă sau să își creeze propriul site, trebuie să începem să ne gândim cum putem duce acest lucru la următorul nivel. În calitate de dezvoltatori, cum putem construi pe asta? Dacă ne gândim la WordPress tradițional, luăm ecranul widget-uri în general. WordPress a oferit un nivel de bază de widget-uri și funcționalități, iar dezvoltatorii au ieșit și au construit tot felul de extensii.

Și cred că aceeași idee trebuie aplicată editării întregului site. În acest moment, există foarte puține, dacă există, extensii și plug-in-uri care folosesc cu adevărat editarea completă a site-ului și o duc la nivelul următor. WordPress va continua să repete editarea întregului site și va ajunge la un punct. Dar nu va face niciodată tot ce își dorește toată lumea și cred că acum este momentul să ne gândim serios la editarea întregului site și să începem să ne gândim la modalitățile prin care putem construi pe deasupra, ca dezvoltatori și să aducem cu adevărat această experiență la următorul nivel.

Așa că provoc pe toată lumea să iasă, să exploreze Gutenberg, să încerce tema 2022 și să o instaleze, să înceapă dezvoltarea blocurilor de învățare. Există o cantitate incredibilă de oportunități pentru blocurile de nișă. Și încercați să vă construiți propria temă. Încercați să luați 2022. Încercați să îl modificați. Încercați să vă construiți tema de bază. Este cu adevărat plăcut și există atât de mult potențial pentru aceste lucruri.

Așa că vreau să mă opresc aici și să vă mulțumesc pentru participare. Și înainte de a pleca, vreau să vorbesc despre câteva resurse care cred că sunt cu adevărat importante, mai ales dacă această prezentare, dacă sunteți nou în editarea full-site și doriți să aflați mai multe. Deci, din nou, poți, desigur, să mă urmărești. Eu tweet despre asta tot timpul.

Dar există câteva resurse. Deci primul este Frost. Am făcut aluzie la asta mai devreme. Deci, aceasta este o temă pe care relațiile cu dezvoltatorii WP Engine o construiesc. Și este un produs experimental. Nu ar trebui să spun produs. Este un experiment, în care încercăm să-l folosim pentru a educa comunitatea despre cum să construim teme bloc. Învățăm pe parcurs. Facem o mulțime de modificări și actualizări pe parcurs, încercând să fim la curent cu WordPress, dar este o resursă grozavă. De asemenea, din nou, acea temă din 2022 – un loc fantastic pentru a începe și a învăța.

În continuare, vreau să conectez Learn WordPress. Acesta este learn.wordpress.org. Echipa de instruire de la wordpress.org depune multă muncă pentru a încerca să educe și să aducă publicului multe dintre aceste concepte. Deci, dacă sunteți interesat și doriți să aflați mai multe, este un loc fantastic. Avem ateliere și tot felul de conținut diferit acolo, inclusiv spații de învățare socială. Acestea sunt organizate săptămânal, unde vorbim despre diferite subiecte, analize profunde despre cum să codificați un bloc și cum să construim o temă de bloc – așa mai departe și așa mai departe.

Și apoi, desigur, dacă sunteți interesat de dezvoltare, începeți întotdeauna cu manualul editorului de blocuri. De acolo am început și există atât de multe resurse grozave. Și apoi, în sfârșit, Gutenberg. Dacă nu ești familiarizat cu Gutenberg, te încurajez să te familiarizezi cu Gutenberg, mai ales dacă ești interesat de dezvoltarea WordPress. Și este un loc grozav în care să te scufunzi, să explorezi modul în care se construiește editarea întregului site, cum se construiesc diferite blocuri și cum poți aplica asta în propriile fluxuri de lucru.

Așa că vă mulțumesc foarte mult pentru participare. Sper că ați obținut multe din această prezentare și sunteți încurajat să continuați să explorați editarea integrală a site-ului. Multumesc mult.