Blocuri WordPress: Ghidul final al blocurilor Gutenberg

Blocurile WordPress sunt cea mai mare caracteristică nouă a WordPress. Cu blocurile WordPress, cunoscute și sub numele de blocuri Gutenberg, utilizatorii pot experimenta un mod mai ușor de a crea conținut bogat în postări și pagini într-un mod cu adevărat vizual.

În acest articol, vom face o scufundare profundă în blocurile WordPress, acoperind istoria noului editor de blocuri WordPress introdus pentru prima dată în WordPress 5.0. De asemenea, vom arunca o privire asupra impactului blocurilor WordPress asupra modului în care compuneți și editați postările și paginile de pe site-ul dvs. WordPress. În cele din urmă, vom acoperi un număr tot mai mare de pluginuri de colectare a blocurilor WordPress care pot schimba dramatic modul în care proiectați și lucrați cu conținut.

Să începem.

Istoria blocurilor WordPress

Numele proiectului pentru noul editor implicit din WordPress se numește Gutenberg. Editorul Gutenberg a introdus ceea ce acum se numește în mod obișnuit editorul de blocuri WordPress .

Fiind cele mai anticipate și mai dezbătute versiuni din istoria WordPress vreodată, editorul Gutenberg a reprezentat o abatere dramatică față de editorul clasic anterior care a existat încă de la înființarea WordPress.

Obiectivul principal al lui Gutenberg a fost de a crea o experiență de editare a conținutului mai bună, bogată, legată de modul în care sunt compuse și editate postările și paginile în WordPress. Dincolo de asta, viziunea despre Gutenberg se extinde dincolo de editorul de post / pagină, în widgeturi și bare laterale și chiar în antetul și subsolul unui site web.

În esență, Gutenberg vă permite să luați o postare sau o pagină și să împărțiți conținutul în diferite „blocuri”. De exemplu, blocurile WordPress includ un bloc de imagine, un bloc de paragrafe, un bloc de cotare, un bloc de titlu, chiar și un bloc de butoane.

Dezbaterea încălzită din jurul lui Gutenberg

Introdus pentru prima dată în WordPress 5.0, WordPress Gutenberg a fost controversat în comunitatea WordPress. Cu toate acestea, multe s-au schimbat cu editorul de blocuri și, pe măsură ce continuăm să vedem editorul WordPress îmbunătățit, vom vedea cât de repede sunt adăugate caracteristici suplimentare. Multe dintre temerile discutate când a fost lansat pentru prima dată dispar rapid, deoarece vedem o lansare constantă de remedieri de erori și actualizări ale caracteristicilor.

Dacă aruncați o privire asupra cronologiei când Gutenberg a fost adăugat la nucleul WordPress, ați fi văzut că mulți oameni erau destul de supărați și supărați că noul editor de blocuri va fi inclus în nucleul WordPress. O mulțime de oameni și-au exprimat nemulțumirea că Gutenberg nu ar fi trebuit să se întâmple niciodată sau cel puțin niciodată să nu fie integrat în nucleul WordPress ca experiență implicită a editorului.

Din păcate, unii oameni au crezut că mijloacele lor de trai vor fi periclitate de noul editor al blocului WordPress, că va necesita mai multe actualizări ale site-urilor existente și că va contribui și la dispariția constructorilor de pagini, care, în ultimii ani, au fost urcare și utilizare.

Cu toate acestea, dacă ne uităm la Guttenberg acum, nu mai putem suporta furia pe care am fi putut-o simți. De asemenea, nu putem continua să îl demitem pe Gutenberg. Este în nucleul WordPress. Ceea ce înseamnă că atunci când instalați WordPress pentru a începe noul site, veți obține în mod implicit editorul de blocuri Gutenberg.

Dezvoltatorii trebuie să înceapă să analizeze modul în care putem folosi editorul de blocuri în avantajul lor. Din fericire, comunitatea WordPress este suficient de mare încât un număr de dezvoltatori care s-au angajat să învețe cum să integreze și să adapteze propriile pluginuri pentru a funcționa în editorul de blocuri ca blocuri WordPress.

Noul nume al lui Gutenberg: Editorul de blocuri WordPress

Când editorul Gutenberg a fost adăugat pentru prima dată la nucleul WordPress în WordPress 5.0, a existat o anumită confuzie cu privire la ceea ce să-l numim. Când Gutenberg a fost introdus în nucleul WordPress, numele proiectului a fost abandonat. Deși este încă denumit Gutenberg, noul editor implicit WordPress se numește editor bloc .

Editorul de blocuri WordPress este radical diferit de editorul clasic WordPress, vechiul mod de editare a postărilor și paginilor din WordPress. Cu editorul de blocuri WordPress, utilizatorii pot experimenta o modalitate mai ușoară de a crea conținut bogat în postări și pagini într-un mod cu adevărat vizual.

Editorul de blocuri vă permite să vă concentrați asupra conținutului, care este, probabil, cel mai valoros activ al site-ului dvs. web. Noul editor WordPress permite, de asemenea, dezvoltatorilor sau agențiilor să creeze șabloane personalizate care le permit clienților săi o modalitate ușoară de a crea conținut nou.

Editorul de blocuri se uită la cel mai de bază nivel al paginii dvs., împărțind totul în rânduri. Și mai mult, puteți utiliza coloane în fiecare rând pentru a vă împărți conținutul pentru un control mai bun al locației fiecărui element pe care îl adăugați.

Sistemul de editare bazat pe blocuri din WordPress este cu adevărat remarcabil și poate fi familiar dacă ați folosit vreodată un plugin WordPress pentru generatorul de pagini. Rezultatul este că experiența de construire a conținutului WordPress devine mult mai vizuală.

Pluginul Gutenberg

În timp ce Gutenberg este acum complet încorporat în WordPress ca noul editor de blocuri, este încă dezvoltat activ ca plugin Gutenberg disponibil gratuit în directorul de pluginuri WordPress.

Cu pluginul Gutenberg, puteți profita de obținerea celor mai recente caracteristici adăugate editorului de blocuri înainte de a fi adăugate în nucleul WordPress. Instalarea și utilizarea pluginului Gutenberg pe un site de dezvoltare este o modalitate excelentă de a ști în prealabil ce modificări ale editorului de blocuri vin în următoarea versiune majoră a versiunii WordPress.

De exemplu, WordPress 5.5 a lansat ultimele 10 versiuni ale funcției pluginului Gutenberg în nucleul WordPress.

Ce sunt blocurile WordPress?

Pentru a profita la maximum de editorul de blocuri WordPress, veți dori să vă familiarizați cu toate elementele implicite pe care le include, cunoscute și sub numele de blocuri WordPress . Aici aveți o mulțime de opțiuni familiare, inclusiv listă, paragrafe, citate și multe altele.

Editorul de blocuri funcționează sub forma de bază că fiecare conținut este un bloc. Asta înseamnă că postările, paginile dvs., orice tip de postare personalizată pe care le aveți, sunt toate colecții de blocuri WordPress. O colecție de blocuri ar putea fi ceva asemănător unei combinații de blocuri de titlu, blocuri de paragrafe, blocuri de imagini, blocuri video și multe altele.

Tabelul blocurilor WordPress disponibile

Acest tabel include câteva dintre blocurile implicite WordPress incluse în WordPress în noul editor de blocuri.

De ce să folosiți Editorul de blocuri și blocurile WordPress?

Saltul la editarea bazată pe blocuri în WordPress este unul mare. Dacă ați folosit editorul clasic de mult timp, schimbarea va fi dezorientantă la început. Din experiența noastră, curba de învățare este abruptă, dar dacă veți obține modul de utilizare a blocurilor WordPress, puteți chiar accelera modul în care compuneți o postare.

Dacă sunteți un dezvoltator independent sau o agenție sau chiar cineva care doar construiește site-uri web cu WordPress, doriți să utilizați editorul de blocuri, deoarece aici se întâmplă toată inovația în WordPress.

După cum am văzut cu versiunile ulterioare ale WordPress, Gutenberg face continuu pași în îmbunătățirea interfeței, precum și a setului de caracteristici al noului editor de blocuri. De fapt, proiectul Gutenberg modelează viitorul temelor WordPress. Acest lucru înseamnă că, pe măsură ce continuăm să construim site-uri și WordPress, trebuie să fim conștienți de toate modificările pe care Gutenberg își propune să le abordeze, inclusiv aruncând o privire asupra foii de parcurs.

Scopul final al proiectului Gutenberg este într-adevăr să simplifice utilizarea WordPress. Și a început deja să facă asta. Gândiți-vă la acest lucru atunci când avem în sfârșit o editare la nivel de site, nu va mai trebui să învățăm oamenii cum să folosească widgeturile. Întreaga idee a widgeturilor va dispărea.

În afară de toate aceste mari evoluții, ar trebui să vă gândiți la construirea următorului dvs. proiect cu editorul de blocuri. Și dacă continuați să citiți această postare, obiectivul nostru este să fiți încântați să construiți un site cu editorul de blocuri.

Editorul de blocuri și dvs.: Editarea conținutului în WordPress

Pe măsură ce începeți să vă gândiți la actualizarea site-urilor care au conținut existent, una dintre cele mai mari preocupări poate fi modul în care noul editor vă afectează conținutul existent. Ultimul lucru pe care doriți să-l faceți este să începeți să utilizați o caracteristică de bază ca aceasta și să aveți mii de postări (de la crearea unui site de peste 10 ani), dintr-o dată pierdeți stilul sau, mai rău, conținutul în sine.

Din fericire, dezvoltatorii proiectului Gutenberg au luat în considerare această situație exactă. Conținutul dvs. existent va fi păstrat și va continua să se afișeze așa cum a făcut-o înainte. Dacă se întâmplă să utilizați un constructor de pagini sau o altă formă de editor de conținut și aspect, acesta va continua să fie afișat corect.

Practic, nimic nu se va întâmpla cu conținutul dvs. existent dacă faceți upgrade la editorul de blocuri.

De ce? WordPress este livrat cu zeci de blocuri, inclusiv un bloc clasic. În acest fel, conținutul dvs. existent va fi cuprins într-un singur bloc clasic până când îl convertiți manual în blocuri individuale.

Procesul de a converti postările WordPress existente în blocuri Gutenberg arată cam așa: blocurile individuale vor trece prin conținut și vor încerca să descopere cel mai bun bloc pentru tot conținutul din blocul clasic. Puteți converti blocul dvs. clasic în blocuri separate individuale alegând opțiunea din meniul blocului clasic.

Cum să reveniți la Editorul clasic

S-ar putea să apară momente în care să aflați că noul editor de blocuri nu este exact compatibil cu tema dvs. existentă sau cu pluginurile care rulează site-ul dvs. Dacă acesta este cazul, puteți dezactiva noul editor de blocuri instalând pluginul Editor clasic.

Pluginul Classic Editor a fost creat de echipa de dezvoltare WordPress pentru a ajuta la rezolvarea problemelor de compatibilitate cu noul editor. Există, de asemenea, pentru cei care au nevoie să își actualizeze versiunea de bază WordPress, dar nu erau gata să schimbe conținutul în noul editor de blocuri. Pluginul Classic Editor dezactivează editorul de blocuri pentru toate tipurile de postări. Este foarte mult un set totul sau nimic.

Cu toate acestea, dacă doriți cu adevărat să încercați editorul de blocuri, puteți instala un plugin numit Gutenberg Manager. Gutenberg Manager este un plugin foarte util, care vă permite să dezactivați editorul de blocuri din anumite tipuri de postări. În acest fel, dacă utilizați un generator de pagini sau aveți tipuri de postări personalizate pe care nu doriți să le utilizați încă editorul de blocuri, îl puteți dezactiva pentru acele tipuri de conținut. Vă va permite să utilizați în continuare editorul de blocuri pentru tipurile de postări pe care le alegeți.

Pentru a instala acest plugin, trebuie doar să accesați directorul de plugin-uri de la wp-admin pus la instalare sau să adăugați un nou atunci când efectuați o căutare pentru Guttenberg Manager.

Cunoașterea Editorului de blocuri și a blocurilor WordPress

Dacă ești ca mine și te frustrezi destul de ușor în timp ce încerci să actualizezi un site existent, este posibil să vrei să arunci prosopul. Cu toate acestea, să luăm în considerare mai multe opțiuni înainte să instalăm editorul clasic și să uităm de utilizarea editorului de blocuri.

Actualizați și actualizați pluginuri și teme

Primul sfat este să vă asigurați că vă actualizați sau actualizați toate pluginurile și, bineînțeles, tema. Noul editor de blocuri este în curs de dezvoltare doar în ultimii 2 ani, deci există șanse mari ca oricare dintre pluginurile pe care le utilizați să fie recent actualizate și să fie remediate pentru a funcționa cu blocurile WordPress. Același lucru este valabil și pentru teme.

De asemenea, ați putea observa că am indicat și necesitatea potențială de a vă actualiza pluginurile și tema. Nu vă pot spune de câte ori am întâlnit un site client care, dintr-un motiv sau altul, au decis să nu mai plătească abonamentul anual sau taxa anuală de reînnoire a pluginurilor sau temelor lor. Acest lucru înseamnă că este probabil să ruleze o versiune mai veche a acelui plugin sau să fie văzută și astfel trebuie să plătiți pentru a primi din nou actualizările.

Comenzi rapide de la tastatură

Un mod interesant prin care noul editor de blocuri îmbunătățește capacitatea de tastare în conținutul dvs. este prin utilizarea comenzilor rapide de la tastatură. Acest lucru reduce cantitatea de comutare a contextului între tastatură și mouse în timp ce scrieți conținut.

Dacă tastați laptopul, este posibil să nu observați nici măcar mișcarea degetului mare de pe bara de spațiu în jos pe trackpad deplasând mouse-ul și apoi înapoi.

O comandă rapidă de la tastatură care va fi cea mai utilă pentru dvs. este atunci când trebuie să aduceți blocul de inserare. Am inclus o captură de ecran a aspectului inserării blocului. dacă tastați / pe o nouă linie, va apărea comanda rapidă de bloc.

Blocul clasic

Blocul clasic este acolo pentru a vă ajuta să eliminați diferența dintre fluxul de lucru vechi în noul flux de lucru cu noul editor. Dacă dintr-un anumit motiv există ceva ce nu crezi că poți face în noul editor de blocuri, tot ce trebuie să faci este să adaugi un bloc clasic pe pagină. Puteți accesa vechea bara de instrumente și toate acele coduri scurte care vă erau disponibile în versiunile anterioare de WordPress.

Salvarea și refolosirea blocurilor în Gutenberg

Una dintre caracteristicile mele de bază preferate ale noului editor de blocuri este capacitatea de a salva și reutiliza blocuri pentru a fi utilizate pe alte bucăți de conținut, cunoscute și sub numele de blocuri reutilizabile .

Blocurile reutilizabile sunt deosebit de utile pentru bloggeri sau proprietarii de site-uri care au adesea nevoie să adauge anumite fragmente de conținut la articolele lor sau chiar mai multe pagini de pe site-ul lor.

Pentru a salva blocul ca bloc reutilizabil, faceți clic pe butonul meniu situat în colțul din dreapta al barei de instrumente blocuri. Apoi din meniul Selectare ofertă adăugați două blocuri reutilizabile și opțiuni de citat.

Vi se va cere să furnizați un nume pentru bloc. Dați un nume blocului dvs., apoi faceți clic pe butonul de salvare. Editorul de blocuri salvează acum blocul blocului reutilizabil.

Pentru a utiliza acel bloc salvat în alte postări sau pagini de pe site-ul dvs., tot ce trebuie să faceți este să afișați comanda rapidă de bloc, derulați în jos până unde scrie reutilizabil și apoi găsiți blocul salvat.

Dacă doriți să gestionați toate blocurile reutilizabile în aceeași fereastră, puteți face clic pe linkul „gestionați toate blocurile reutilizabile” . Acest lucru vă va duce la pagina managerului de blocuri. Aici puteți edita sau șterge oricare dintre blocurile dvs. reutilizabile. De asemenea, puteți exporta blocuri reutilizabile și le puteți utiliza pe orice alte site-uri WordPress pe care le doriți.

Sfaturi bonus pentru utilizarea blocurilor WordPress ca un profesionist

Vă simțiți din ce în ce mai confortabil folosind noul editor negru, s-ar putea să vă întrebați dacă veți petrece mai mult timp adăugând și reglând blocuri, apoi creând conținut real.

Vestea bună este că editorul de blocuri este incredibil de rapid. Chiar și pentru cea mai simplă utilizare, în câteva minute veți adăuga instantaneu blocuri WordPress fără să vă gândiți la asta.

În curând veți realiza cât de rapid a devenit fluxul de lucru cu noua sa abordare. Și dacă sunteți un utilizator puternic, să vorbim despre câteva sfaturi bonus pentru a vă ajuta să lucrați și mai rapid cu noul editor.

1. Mutați bara de instrumente Blocare în partea de sus

În prezent, există o bară de instrumente care apare în partea de sus a fiecărui bloc WordPress. Puteți muta această Bara de instrumente în partea de sus a celeilalte. Tot ce trebuie să faceți este să faceți clic pe butonul din colțul din dreapta sus al ecranului și apoi să selectați opțiunea din bara de instrumente de sus.

2. Trageți și plasați media pentru a crea automat blocuri media

Aceasta este o caracteristică foarte utilă și dacă veți crea o postare, veți evidenția mai multe imagini ca o galerie. Le puteți trage cu ușurință din fereastra de căutare dacă sunteți pe un Mac chiar în editorul de blocuri. Acest lucru va crea automat un bloc de galerie pentru dvs.

Puteți face același lucru cu o singură imagine sau un fișier video, iar editorul WordPress va crea blocul pentru dvs.

Cum se adaugă YouTube, Twitter, Facebook, Vimeo, alte încorporări

Gutenberg a introdus noi blocuri de încorporare în editorul de blocuri. Există un bloc WordPress pentru toate tipurile de încorporare acceptate, inclusiv YouTube, Twitter, Facebook, Vimeo, Instagram oh și multe altele.

Cu toate acestea, tot ce trebuie să faceți este să copiați și să inserați URL-ul încorporat în orice punct al editorului de blocuri și va crea automat un bloc nou pentru dvs. De exemplu, dacă ar fi să adăugați un URL Vimeo, acesta ar crea automat un bloc de încorporare Vimeo și ar afișa videoclipul.

Plugin-urile pentru blocuri WordPress merită privite

În următoarea parte a acestui ghid, vom explora marea varietate de pluginuri de bloc WordPress. Trebuie menționat faptul că termenii pluginuri de blocare și pluginuri de colectare a blocurilor sunt folosiți în mod interschimbabil în această postare. Asta pentru că multe dintre pluginurile enumerate aici conțin o serie de blocuri pe care le puteți utiliza în editorul de blocuri.

Pe măsură ce tot mai mulți oameni încep să folosească editorul de blocuri WordPress, aceste plugin-uri de colectare a blocurilor oferă un sentiment de tip WYSIWYG mai mare editorului de blocuri, permițându-vă să creați site-uri web frumoase cu doar câteva clicuri. Acestea sunt concepute pentru a vă permite să modificați setările, să adăugați / să eliminați blocuri și să încărcați propriul conținut, pentru a oferi paginii dvs. o senzație mai personală.

Ceea ce este uimitor la această comunitate este numărul de dezvoltatori care au văzut rapid o modalitate de a intra la parterul pluginurilor de blocuri. Vom arunca o privire la ceea ce sunt unele dintre aceste plugin-uri de bloc și care sunt unele dintre avantajele utilizării acestor plugin-uri de blocuri în loc doar de blocurile implicite livrate cu WordPress.

Blocuri stivuibile

Dacă sunteți în căutarea unei noi platforme pentru a îmbunătăți editorul de blocuri WordPress, trebuie să verificați Stackable. Stackable este unul dintre cele mai bune pluginuri de colectare de blocuri pe care le-am găsit pentru WordPress. Dispune de 24 de blocuri, variind de la elemente simple până la caracteristici complexe, cum ar fi anteturi și cutii de prețuri.

Toate blocurile de plugin-uri sunt concepute pentru a fi pe deplin receptive, deoarece pluginul vine atât în ​​pachet gratuit, cât și în pachet premium. Dacă sunteți în căutarea unui plugin de blocuri cuprinzător, care să vă ofere un instrument puternic pentru toate scopurile și să vă ofere funcționalități care nu sunt utile doar bloggerilor, proprietarilor de site-uri de comerț electronic și întreprinderilor mici, trebuie să aruncați o privire la stivuibil.

CoBlocks

Un plugin puternic, dar ușor, CoBlocks vă oferă funcționalități suplimentare editorului de blog WordPress, fără umflături. CoBlocks vă oferă blocuri suplimentare în construirea adevărată a rândurilor și coloanelor, oferindu-vă o adevărată experiență de constructor de pagini pentru Guttenberg. Datorită sistemului său inovator de blocuri, vă permite să creați pagini web uimitoare și chiar site-uri întregi, cu noul editor WordPress.

În centrul acesteia se află blocurile excepționale de rânduri și coloane pentru a ajuta la generarea dinamică a zonelor de conținut cu setări specifice de marjă receptivă și setări de umplere oferite de singurele CoBlocks.

Fiecare dintre blocurile WordPress din cadrul Coblocks a fost precis reglat pentru a oferi o experiență de personalizare familiară, dar puternică. Taylor fiecare bloc pe gustul dvs. folosind comenzile și setările noastre personalizate. Schimbați fonturile, setați umplutura și marginea, potriviți culorile și multe altele.

CoBlocks vă oferă o mulțime de blocuri de specialitate. De exemplu, de la blocuri sociale la restaurante sau meniuri Servicii, CoBlocks sunt create de niște blocuri cu adevărat intuitive care oferă o interfață ușor de utilizat cu blocurile rând.

Blocul care îmi place în primul rând este blocul de tabele de prețuri care facilitează crearea rapidă a tabelelor de prețuri simple, dar receptive, care sunt potrivite pentru o companie de servicii. Aceste blocuri de specialitate completează chiar temele receptive pentru mobil și ajută la crearea obiectelor de aspect care par să fi fost construite mai întâi pe mobil.

Blocuri atomice

Atomic Blocks a fost dezvoltat inițial de Mike McAllister, dar de atunci a fost achiziționat de Studio Press și WP Engine. Dezvoltatorii WordPress Marcos Schratzenstaller și John Parris s-au alăturat și au început să contribuie la plugin. Este disponibil din directorul de pluginuri wordpress.org și poate fi instalat direct în administratorul dvs. WordPress.

Care sunt primii jucători de pe piață, Atomic Blocks a oferit o colecție de blocuri WordPress pentru noul editor de blog WordPress. au văzut nevoia de a construi rapid mai multe blocuri pentru a vă îmbunătăți aspectul și simțirea conținutului și pentru a vă oferi mai multă capacitate de a utiliza conținut interactiv.

Bonus: Tema blocului atomic

Tema Blocuri atomice este concepută pentru a vă ajuta să începeți cu pluginul Blocuri atomice și noul editor de blocuri WordPress. Se integrează perfect împreună, astfel încât să cunoașteți o combinație de opțiuni de temă și opțiuni de blocare care se potrivesc cu adevărat.

Are stiluri elegante pentru toate blocurile implicite de editor, cum ar fi fotografii, galerii, citate, coloane și multe altele. Tema acceptă stilurile de aliniere largi ale noului editor pentru conținut care se întinde pe toată lățimea paginii dvs.

Evident, este de la sine înțeles că tema Blocuri atomice se integrează cu ușurință cu pluginul Blocuri atomice care adaugă blocuri de construcție a paginilor pentru noul editor WordPress. Blocurile atomice adaugă, de asemenea, blocuri de conținut personalizabile, cum ar fi mărturie, notificare, profil, buton personalizabil, acordeon și multe altele. De asemenea, are mai multe opțiuni la îndemână, cum ar fi lățimea conținutului, selectarea fontului, dimensiunile fontului, încărcarea siglei și multe altele, pentru a vă ajuta să vă îmbunătățiți site-ul placerea ta.

Blocuri KadenceWP

Dacă ați petrecut vreodată ceva timp în editorul de blocuri, veți înțelege cât de limitat poate fi atunci când vine vorba de proiectarea machetelor. Mai ales atunci când provii de pe șantierele în care ai folosit constructori de pagini. Acesta este unul dintre lucrurile pe care le iubesc cu adevărat la Kadence WP. Blocurile Kadence oferă o serie de elemente suplimentare care vă permit să vă extindeți opțiunile pentru a crea pagini dinamice și flexibile.

Versiunea gratuită este deja puternică, vă oferă posibilitatea de a crea pagini cu aspecte complexe, vă oferă control asupra coloanelor, Rose, spațiu și multe altele. Cu toate acestea, Cadence are, de asemenea, o versiune pro a pluginului de blocare. Iar versiunea pro este cu adevărat cea pe care vrei să o obții. Cadence WP vă oferă o serie de machete pre-proiectate, dar nu numai că arată bine având în vedere unele dintre cele mai bune practici de proiectare, dar vă permit, de asemenea, să editați aproape fiecare lucru din fiecare dintre aceste machete pre-proiectate.

Puterea cadenței se află în blocul lor de aspect de rând. Blocul de dispunere a rândurilor vă oferă un control mai bun al coloanelor pentru diferite dimensiuni de ecran, plus vă oferă instrumente complete de editare a rândurilor, cum ar fi umplutura, fundaluri, ingrediente de actualizare a suprapunerilor, alinierea verticală și multe altele

Așa cum am construit site-uri cu Gutenberg, Kadence WP este probabil unul dintre un număr mic de pluginuri de bloc pe care le instalez și fiecare site unic. Blocurile profesionale din Kadence WP sunt blocul de suprapunere a imaginii, blocul post grilă / carusel, blocul de conținut divizat, blocul carusel al produsului, blocul modal, blocul pop-up video și animația de defilare.

Blocuri de vidră

Cei de la Theme Isle au creat Otter Blocks, care își propune să fie unul dintre cele mai ușoare pluginuri de blocuri disponibile. Vă oferă 12 blocuri cu care vă puteți juca și personaliza, păstrând în același timp un impact minim asupra performanței site-ului dvs.

Dacă sunteți blogger, acest pachet este cu adevărat pentru dvs. Cu toate acestea, dacă sunteți proprietarul unei companii care are nevoie de un set de funcții ușoare, cu prețuri și blocuri de servicii, puteți utiliza și acest plugin. În prezent, nu există o versiune profesională a OtterBox.

Când am încercat să creez o pagină simplă cu Otter Blocks, am găsit că îmi fac câțiva pași în plus față de unele dintre celelalte pluginuri de colectare a blocurilor pe care le-am analizat. Acestea fiind spuse, am găsit că este mai asemănător cu ceea ce aș experimenta cu constructorii de pagini, cum ar fi Beaver Builder. Mai întâi adăugați coloanele și apoi adăugați blocurile pe care le doriți în ele.

În alte pluginuri de colectare a blocurilor, aveți setări în jurul numărului de coloane / caracteristici / servicii. Apoi aveți câteva setări în fiecare dintre blocuri. Unele dintre plugin-urile de colectare a blocurilor încearcă să ajute la economisirea timpului, dar de multe ori acest lucru m-a dus la frustrare, deoarece nu am putut obține designul dorit.

Gutenberg avansat

Advanced Gutenberg are 16 blocuri și este unul dintre cele mai bune pluginuri de blocuri pentru WordPress, deoarece îmbunătățește modul în care funcționează editorul de blocuri.

Advanced Gutenberg vă permite să filtrați blocurile disponibile pe baza rolului utilizatorului și include noi opțiuni de personalizare pentru unele dintre blocurile WordPress existente. Asta înseamnă că nu trebuie să instalați o grămadă de blocuri noi și să nu utilizați blocurile existente.

Acest plugin începe cu adevărat să depășească limitele designului de conținut. Oferă versiuni avansate ale mai multor blocuri WordPress mai fundamentale, oferindu-vă opțiuni suplimentare de configurare și stil. În plus, adaugă noi setări la unele funcții existente ale editorilor de blocuri.

Cel mai bun lucru care îmi place la acest lucru este că au propria pagină de setări care vă permite să dezactivați (dezactivați) blocurile pe care nu doriți să le utilizați. În aceleași pagini de setări aveți posibilitatea de a modifica setările implicite ale fiecărui bloc. Acest lucru este incredibil de util pentru constructorii de site-uri și freelanceri care construiesc site-uri pentru clienți.

Qubely

Qubely se consideră nu doar un plugin Gutenberg obișnuit. În schimb, se vorbește despre preluarea cu adevărat a controlului editorului WordPress Gutenberg și posibilitatea de a vă bucura de tone de opțiuni de stil de top.

Dispune de un constructor de layout împreună cu tipografia și stilul și chiar și un control receptiv care face cu adevărat editorul de blocuri Gutenberg o briză.

Quebly oferă o mulțime de secțiuni gata personalizate pe care le puteți importa și utiliza cu editorul de blocuri Gutenberg. Acest lucru vă permite să economisiți timp în timp ce vă dezvoltați site-urile web frumoase și prietenoase cu conversia. Îți dă cu adevărat ideea că editorul de blocuri Gutenberg este într-adevăr doar un constructor de pagini.

În plus, există o serie de blocuri exclusive care îmbunătățesc capacitatea editorului Gutenberg. Cu colecția lor imensă de blocuri exclusive, ușor de personalizat și de utilizat ca începători, nu este de mirare că unul dintre pluginurile de blocuri cu cea mai rapidă creștere este Quebly.

Vine rapid cu 32 de blocuri personalizate Gutenberg puternice, care vă permit să proiectați orice pagină dintr-un lucru la fel de simplu ca o pagină de destinație a paginii de destinație, cu câteva imagini și un text, poate un buton sau două, pentru ceva mai complex, cum ar fi un meniu sau un produs complet de restaurant pagină.

Suplimente finale pentru Gutenberg

Dacă provii de la un constructor de pagini, în special Elementor sau Beaver Builder, un nume cu care probabil vei fi cunoscut este Brain Force sau Astra. Completele finale pentru Gutenberg vă oferă cea mai bună bibliotecă de suplimente disponibile pentru blocuri.

În prezent, există 20 dintre cele mai bune programe de completare care au fost convertite în blocuri WordPress și sunt în prezent gratuite, acolo unde nu necesită să plătiți pentru ele, astfel încât este extrem de la îndemână să utilizați unele dintre blocurile lor ca clădire Site-ul tău.

Dacă folosiți Astra ca temă WordPress, care este una dintre echipele mele preferate și despre care am vorbit pe iThemes Training, veți avea o anumită familiaritate cu complementele finale pentru Guttenberg.

În calitate de utilizator de lungă durată al Gravity Forms, unul dintre suplimentele mele preferate vă oferă posibilitatea de a vă forma formularele de gravitate. Așadar, suplimentele finale vă oferă un stil sau un bloc Gravity Forms. Vă permite să stilizați câmpurile, alte opțiuni de culoare, incluzând chiar aspectul butonului și stilul, și în cele din urmă gestionarea mesajelor. Dacă nu sunteți un utilizator Gravity Forms, dar poate un utilizator Contact Forms 7, puteți avea posibilitatea de a utiliza Formularul de contact 7 cu blocul Ultimate Add-on.

GhostKit

GhostKit este o colecție și extensie de blocuri Gutenberg. În prezent, aveți la dispoziție 21 de blocuri cu acest plugin. În cea mai mare parte, veți vedea blocuri WordPress foarte asemănătoare cu cele pe care le veți găsi în alte pluginuri.

Cu toate acestea, GhostKit adoptă o abordare de a adăuga ceea ce numesc extensii de bloc . Extensiile de blocuri sunt în esență funcționalități suplimentare puse la dispoziția blocurilor Gutenberg care sunt înregistrate la editorul de blocuri. În multe cazuri, acest lucru este valabil pentru blocurile Gost Kit și blocurile de bază. Este posibil să întâmpinați probleme atunci când încercați să vedeți dacă aceste extensii sunt disponibile cu alte pluginuri de bloc.

Ultimate Blocks - Gutenberg Blocks Plugin

Reclamat ca pluginul Gutenberg blocuri pentru bloggeri și specialiștii în marketing, pluginul Ultimate Blocks - Gutenberg Blocks are scopul de a vă facilita în mod incredibil crearea de conținut mai bun și mai captivant cu Gutenberg.

Ultimate Blocks are în prezent 19 blocuri în colecția lor. Unul dintre blocurile mele preferate din această colecție este blocul de filtrare a conținutului. Permite utilizatorilor să filtreze conținutul pe baza mai multor selecții. Sunt încă destul de noi, fiind doar la o versiune 2.x.

Blocare Gutenberg pentru constructor de pagini - Blocuri Kioken

Cu Kioken Blocks for Gutenberg, experiența dvs. de creare a paginilor cu noul editor este maximizată. Kioken Blocks are blocuri unice și creative care vă vor ajuta să creați și să proiectați pagini și postări rapid, frumos, ca un profesionist.

Colecția Gutenberg Blocks - qodeblock

Qodeblocks este o colecție de blocuri de construire a paginilor pentru noul editor de blocuri Gutenberg. Versiunea actuală vine la setul de 14 blocuri cu un grad diferit de opțiuni de stil pe bloc. Aceste blocuri sunt frumoase.

Qodeblocks este încă în curs de dezvoltare, deoarece au publicat doar recent o versiune 1.0. Sunt încântat să văd ce au în magazin și le voi verifica dacă vor continua să se dezvolte.

Blocuri ușoare - Gutenberg Blocks Page Builder

Indiferent ce tip de site sau pagină de destinație doriți să creați, Easy Blocks este soluția perfectă. Blocurile lor WordPress pentru marketing, cum ar fi call action, butoane, mărturii, contorizare, logo-uri. Blocurile lor pentru servicii, cum ar fi o casetă de caracteristici, o grilă de funcții, un tabel de prețuri sau sociale, cum ar fi o cotă socială, o grilă Instagram. Există chiar și un antet personalizabil, un aspect de conținut și multe altele.

It also features the ability to have multiple columns with multiple styles to help you design any kind of landing page or product or service page from scratch. Easy Blocks comes with 20 blocks that will enhance your Gutenberg editor experience. There are a number of additional blocks they are developing and will be released in time.

Blocks Kit – Gutenberg Blocks for Freelancers

Blocks Kit is another set of Gutenberg blocks with the idea that they're aimed at editors content writers and Freelancers. It currently has 10 blocks available but they're looking at continuing to add more as they continue to develop the plugin.

One thing I found interesting about this set of plugins is that they did a ton of research to determine what type of blocks would actually be needed for any type of website development. It then created a list of options based on those selected blocks that they were thinking about to design and provide for free to anyone that wanted to use the plugin. This made it possible for any beginner to a freelancer to really use this plugin.

While Blocks Kit is simple in nature, I found that it was easy to use all of their blocks and it didn't seem to put a lot of additional page weight or have any performance issues on my test site. A paragraph if you're looking for a small set of additional blocks that you want to have available to you on your site you should definitely check this one out.

Final Thoughts on Block Plugins

There's a number of unknowns we're seeing in the WordPress theme space as we enter the world of the new WordPress editor. When we think about the changes that will likely come through in the coming months, it's hard to know where to spend your time as a block developer.

If you are still wanting to play it safe with your site, I think Otter Blocks is a good choice for those that want to live in the CSS world.

WordPress Block Extras

There are a number of additional WordPress block plugins that work to provide you with overall functionality changes to the block editor, so it's fitting to include them in this section. It's all about adding value to everything Gutenberg or block editor.

Gutenberg (The Project) Plugin

As mentioned earlier in the post, the Gutenberg plugin is still a very active project and thus still has a separate plugin that you can install to take advantage of releases prior to them being included in WordPress core. If you'd like to check out some of those new features ahead of WordPress being updated to include the newest version of Gutenberg, you can install this plugin and have those features be available to you immediately.

Blocks Animation: CSS Animations for Gutenberg Blocks

This blocks animation plugin adds an animation setting to each block but is registered with the block editor. This means that you can add any type of CSS animation that's available to you to any block inside of Guttenberg. there are three settings to get added to the block settings window. The first of the animation the second is delay and the third is speed. Each one has a drop down with a few different options that you can select.

Extra Block Design, Style, CSS for ANY Gutenberg Blocks

This plugin allows you to customize any element created in the Gutenberg block editor with 60 + options. It works with all Gutenberg blocks so that means if you have a plugin that has a block or you have a plugin that has multiple blocks registered with the block editor, these will all be editable with this plugin.

În acest fel, puteți extinde blocurile dvs. esențiale Gutenberg cu mai multe opțiuni de proiectare fără a atinge nicio linie de cod. Au adăugat chiar și un editor CSS care permite utilizatorilor care doresc să își modifice blocurile Gutenberg folosind codul CSS.

Ca bonus suplimentar, Stylist va lucra cu anumiți constructori de pagini:

• Elementor
• Beaver Builder
• Compozitor vizual
• Compozitor live
• KingComposer
• Fusion Page Builder
• Sandwich-ul constructor de pagini
• BoldGrid

De asemenea, puteți utiliza acest plugin pentru a personaliza stilurile de formulare create cu următoarele pluginuri de formulare:

• Forme Ninja
• Formularul de contact 7
• Formular de contact de către WPForms
• Forme de calderă
• Formulare ușoare pentru Mailchimp
• Formule formidabile

Dezactivați Gutenberg Blocks - Block Manager

Am analizat o serie de pluginuri pentru blocuri Gutenberg și probabil că ați instalat mai multe în acest moment. Problema este că, dacă adăugați câteva pluginuri de colecții de blocuri, editorul de blocuri poate deveni rapid aglomerat.

Din acest motiv, a fost creat pluginul Disable Gutenberg Blocks. Acest plugin vă permite să dezactivați blocurile de care nu aveți nevoie sau clienții dvs. Acest lucru poate fi extrem de util dacă spuneți că vă place un bloc de prețuri dintr-o colecție, iar alte colecții includ, de asemenea, o cutie de prețuri oh, le puteți elimina pe celelalte.

Pentru a utiliza acest plugin, tot ce trebuie să faceți este să mergeți la wp-admin, apoi să accesați setările și apoi să dezactivați blocurile acolo, vă va oferi o listă de blocuri înregistrate și puteți începe să le dezactivați pe cele pe care nu le mai doriți pentru a apărea în interiorul blocului Gutenberg.

Probabil că este de la sine înțeles, dar o voi spune oricum, dacă descoperiți că eliminați toate blocurile dintr-o colecție specifică, probabil că ar trebui să scăpați de întregul plugin.

Crearea blocurilor WordPress personalizate

Înainte de blocurile WordPress, dacă sunteți un dezvoltator care a dorit să adauge un anumit cod în editorul de conținut, ar trebui să îl inserați direct în editorul clasic. Sau ar trebui să mergeți pe ruta codurilor scurte WordPress. Un cod scurt este ceva pe care l-ați putea adăuga cu ușurință în conținutul dvs. S-a deschis cu o paranteză pătrată și s-a închis cu o paranteză pătrată.

Cu toate acestea, cu noul editor de blocuri, utilizarea codurilor scurte va deveni probabil un lucru din trecut. Dacă utilizați un plugin existent care are un scurtcod pentru a încorpora acea parte a conținutului sau acel lucru în postarea dvs., trebuie să aveți o soluție vizuală, astfel încât să puteți vedea cum arată pe pagină.

Când priviți ce blocuri WordPress sunt în editor, vedeți cu adevărat că este doar o grămadă de câmpuri personalizate. Acum sunt salvate într-un loc diferit din baza de date decât în ​​trecut. Aceasta înseamnă că există mai multe pluginuri care pot crea funcționalități suplimentare pentru a vă permite să creați blocuri foarte ușor cu multe dintre aceleași caracteristici folosind câmpuri personalizate.

Dacă doriți mai mult control asupra unui bloc sau doriți să construiți funcționalități din pluginul dvs. într-un bloc WordPress, următoarele două instrumente vă vor ajuta să începeți.

Block Lab

Să ne gândim la asta un minut. Dacă vă gândiți la blocurile WordPress la cel mai rudimentar nivel, toate blocurile sunt câmpuri personalizate. Diferența este însă câmpurile și tipurile de valori pe care le utilizați pentru fiecare bloc. Cu Block Lab, puteți adăuga blocuri noi editorului și le puteți atribui o categorie.

Pentru fiecare bloc, puteți adăuga aproape cât mai multe câmpuri personalizate pe care doriți să le alegeți dintr-o gamă largă de presetări. Cu toate acestea, va trebui să știți cum să creați șabloane HTML simple pentru a personaliza fiecare aspect de bloc. Aici vă pot ajuta să conturați procesul, astfel încât să aveți o idee la ce să vă așteptați.

Câmpuri personalizate avansate

Advanced Custom Fields este probabil cel mai utilizat plugin pentru oricine lucrează cu câmpuri personalizate. A fost construit destul de mult timp de mulți ani de activitate, așa că nu este de mirare că și ei ar construi funcționalități pentru a construi și a înregistra blocuri WordPress cu noul editor.

ACF vă permite să creați blocuri personalizate în câteva minute în loc de ore. Cel mai bun dintre toate, dacă știți deja să scrieți PHP și HTML simple, puteți face acest lucru și lăsați ACF Pro să facă tot eforturile pentru a crea în blocul dvs.

ACF pro a simplificat procesul până la doar trei pași.

1. Înregistrați un bloc

Dacă sunteți familiarizat cu înregistrarea unui tip de postare în WP, veți putea înregistra un bloc cu ACF Pro. Funcția utilizează un format foarte similar cu înregistrarea unui tip de postare, dar în acest caz ajungem să înregistrăm un bloc.

2. Creați un grup de câmp

Odată ce v-ați înregistrat blocul Pasul următor pe care trebuie să-l faceți este să creați un câmp Grup. un lucru pe care ar trebui să-l știm aici este că oricare și toate câmpurile ACF pot fi utilizate în blocul dvs., astfel încât să nu aveți limitări ale ceea ce sunteți blocat poate sau nu poate face.

Odată ce ați creat grupul de câmpuri, trebuie să configurați locația. utilizați regula de blocare pentru a selecta tipul de bloc nou înregistrat.

3. Redați blocul

În cele din urmă, ultimul pas al procesului este că trebuie să îi spuneți ACF cum să redea blocul. Acesta este în esență același proces pe care l-ați folosit pentru afișarea câmpurilor personalizate, cu toate acestea, HTML și PHP vor fi înfășurate într-o funcție.

În funcția PHP de mai devreme, am menționat o setare de apelare înapoi. Aceasta este funcția PHP care vă va reda blocurile HTML. Aici veți scrie tot codul personalizat pentru blocurile dvs.

Asta este cu adevărat tot ce există. Puteți crea un bloc acești câțiva pași utilizând ACF Pro.

Domeniul de aplicare al blocurilor ACF

Când utilizați un bloc scris cu ACF, acesta va salva datele în cadrul valorii conținutului de subliniere a postului în loc de tabelul wp_postmeta , așa cum fac casetele meta atunci când utilizați editorul clasic.

Aceasta este o schimbare minoră în gândirea dvs. atunci când ați utilizat pluginul ACF Pro pentru locul în care datele dvs. vor fi salvate în baza de date. Indiferent dacă îl iubești sau îl urăști, modul în care Gutenberg își stochează datele permite multă flexibilitate. Blocurile ACF pot fi inserate de mai multe ori în cadrul aceluiași post, pot fi reordonate, editate și șterse fără nicio umflare în meta tabelul postului.

O modalitate mai bună de a construi blocuri WordPress

În timp ce v-am oferit două moduri în care ați putea folosi pluginuri pentru a construi blocuri, oh, acesta nu este modul oficial în care sunt construite blocurile. Editorul de blocuri introduce o dependență mult mai grea pentru ca un dezvoltator să știe și să înțeleagă cum să scrie JavaScript.

Din punct de vedere istoric, WordPress a fost construit în principal folosind PHP, pe care mulți dezvoltatori l-au învățat de-a lungul anilor. Aceasta înseamnă că ar putea exista o curbă de învățare pentru dezvoltatorii care nu și-au luat timp să învețe JavaScript.

Blocurile Gutenberg sunt create în principal folosind cadrul JavaScript REACT. Dacă doriți să adoptați o abordare mai nativă a construirii blocurilor WordPress, ar trebui să consultați o postare pe blog a lui Ahmad Awais, Creați setul de instrumente Guten Block: Lansare, Introducere, Filosofie și multe altele! pe măsură ce a creat un proiect Github Create Guten Block pentru a vă ajuta să creați blocuri Gutenberg puțin mai ușor.

Există multe alte tutoriale acolo pentru a afla cum să creați un bloc WordPress folosind react și JavaScript. Dacă acest lucru vă interesează și doriți să învățați cum să faceți, v-aș încuraja să faceți câteva cercetări și să găsiți acele tutoriale și chiar o cursă sau un curs care să vă ajute să începeți cu REACT și blocuri.

Încheierea: blocuri WordPress și viitorul WordPress

După cum puteți vedea, blocurile WordPress schimbă cursul WordPress. Acesta este un moment incredibil pentru a fi în comunitatea WordPress ca dezvoltator, constructor de site-uri sau creator de site-uri. Blocurile WordPress continuă să schimbe traiectoria actuală a locului în care merge WordPress. Avem acum instrumentele încorporate nativ pentru a concura cu soluții găzduite de site-uri web precum Squarespace, Wix și multe altele.

Am văzut cum deja într-un timp atât de scurt au apărut dezvoltatorii pentru a construi și a crea colecții de plugin-uri de blocuri foarte puternice care ne permit să folosim editorul de blocuri într-un mod nou. Eu

Dacă sunteți proprietar de site sau sunteți independent sau constructor de site-uri și începeți să lucrați cu construirea de site-uri noi în 2020, v-aș încuraja să încercați să construiți câteva site-uri cu editorul de blocuri. Cred că veți fi surprins de cât de mult puteți face cu editorul negru care nu necesită alte câteva pluginuri pentru a fi implementat. (Deși trebuie să instalați un număr de pluginuri de blocuri, puteți instala cu adevărat o colecție de blocuri și puteți limita resursele pe care le obțin la coadă pentru front-end.)

Din punct de vedere al performanței, văd editorul de blocuri și pluginurile de blocare ca o modalitate mai ușoară de a vă menține performanța foarte rapidă și ușoară. Anterior, înainte de a utiliza editorul de blocuri, este posibil să aveți pluginuri care se încarcă pe fiecare pagină, indiferent dacă acel plugin este chiar necesar pe o pagină sau nu.

În cele din urmă, trecerea la editorul de blocuri și blocurile WordPress îi ajută pe dezvoltatori să scrie un cod mai bun și mai eficient. Ne permite, în calitate de constructori de site-uri și proprietari de site-uri, să creăm site-uri care funcționează bine din cutie, deoarece instrumentele potrivite sunt acum utilizate.

AJ Morris

AJ aduce peste două decenii de experiență lucrând și dezvoltând site-uri de membru cu o gamă largă de clienți.