Cum să creezi o temă bloc WordPress (în 3 pași)

Publicat: 2022-10-13

În calitate de începător cu WordPress, este posibil să fi evitat să construiți teme personalizate în trecutul recent, crezând că necesită un proces de codare complicat. Acum vă puteți personaliza întregul site web cu Editarea completă a site-ului (FSE), dar există încă problema exportului modelelor dvs. personalizate.

Din fericire, puteți crea cu ușurință o temă de bloc cu pluginul Create Block Theme. După ce vă personalizați tema cu Editorul site-ului, o puteți exporta ca temă de blocare personalizată. Apoi, îl puteți instala pe alte site-uri web în loc să trebuiască să vă reconstruiți designul de la zero.

În această postare, vom explica ce este o temă bloc și cum puteți utiliza instrumentul Creare temă bloc pentru a crea una. Apoi, vă vom arăta cum să faceți acest lucru în trei pași simpli. Să începem!

Ce este o temă bloc WordPress?

Când Gutenberg a fost lansat ca parte a WordPress 5.0, a transformat complet experiența de creare de conținut. Acest lucru se datorează faptului că noul său Editor de blocuri v-a permis să personalizați postările și paginile adăugând diferite blocuri de conținut:

Editor de blocuri WordPress

În 2021, WordPress a extins această caracteristică și mai mult. Actualizarea 5.8 a lansat Editarea completă a site-ului, permițându-vă să vă creați întregul site web folosind un sistem bazat pe blocuri. Cu Editorul de site, puteți adăuga blocuri tematice pe site-ul dvs., puteți crea șabloane de bloc și multe altele:

Editor complet de site WordPress

Pentru a începe să utilizați Editarea completă a site-ului, totuși, va trebui să instalați o temă de blocare. Mai simplu spus, acestea sunt teme care sunt construite cu blocuri Gutenberg.

Iată câteva dintre funcționalitățile pe care le veți obține atunci când instalați o temă de blocare WordPress:

  • Editați orice parte a site-ului dvs. fără cod
  • Personalizați culorile și tipografia cu Global Styles
  • Îmbunătățiți viteza site-ului încărcând doar stiluri pentru blocurile redate pe pagină
  • Adăugați funcții de accesibilitate, cum ar fi un buton Salt la conținut și navigare de la tastatură

Folosind o temă de blocuri, puteți avea control complet asupra designului site-ului dvs. Anterior, ar fi fost dificil să editați fișierele cu teme fără abilități de codare. Cu toate acestea, acum oricine poate personaliza un site web prin simpla construire și editare a machetelor de bloc.

O introducere în pluginul Create Block Theme

În multe cazuri, proprietarii și dezvoltatorii de site-uri web creează teme secundare personalizate pentru a-i ajuta să personalizeze un site web. O temă copil este pur și simplu o temă care moștenește aspectul și funcționalitatea temei sale părinte. Folosind o temă copil, puteți edita în siguranță o temă de blocare fără a pierde modificările cu noile actualizări de software.

Puteți crea o temă secundară creând un nou folder de temă și o foaie de stil cu codarea temei părinte. Sună destul de simplu, dar adesea implică utilizarea unor tehnici complicate care pot fi dificile pentru începători.

Din fericire, dezvoltatorii de la WordPress au creat pluginul Create Block Theme pentru a rezolva această problemă. Datorită acestui nou instrument, puteți exporta cu ușurință tema de blocare editată:

Creați pluginul Block Theme

Aceasta înseamnă că puteți crea teme de blocare personalizate și apoi le puteți utiliza pe alte site-uri web. După ce faceți modificări cu Editorul site-ului, puteți descărca noul design ca temă secundară, clonă sau variație de stil a temei părinte. Acest lucru poate simplifica designul site-ului web și îl poate face mai accesibil pentru utilizatorii de toate nivelurile.

Cum să creezi o temă bloc WordPress (în 3 pași)

Acum că sunteți conștient de temele de bloc și de avantajele acestora, să discutăm cum să creați una în WordPress. În acest fel, nu va trebui să editați fișierele cu temă de fiecare dată când trebuie să construiți o nouă temă de bloc.

Pasul 1: Instalați o temă WordPress Block

Pentru a crea prima temă de blocare, va trebui să începeți cu o temă de blocare părinte. Folosind Directorul de teme WordPress, puteți alege dintre peste o sută de opțiuni diferite. Aici, pur și simplu faceți clic pe fila Blocare teme pentru a adăuga un filtru de editare completă a site -ului:

Teme de blocare WordPress

După ce găsiți o temă de bloc care vă place, o puteți descărca. Apoi, accesați Aspect > Teme din tabloul de bord WordPress pentru a instala și activa noua temă. Pentru acest tutorial, vom folosi Twenty Twenty-Two:

Instalați tema blocului

Acum va trebui să selectați Plugin-uri > Adăugați nou și să căutați „Creați temă bloc”. Apoi, instalați și activați pluginul:

Instalați pluginul Creare temă bloc

Înainte de a începe editarea temei, va trebui să aveți și cea mai recentă versiune a pluginului Gutenberg. Dacă nu ați făcut-o deja, asigurați-vă că acest instrument este de asemenea instalat, activat și actualizat.

Pasul 2: Personalizați-vă tema cu Editorul site-ului

Apoi, puteți deschide Editorul site-ului și puteți modifica tema de blocare. Pentru a face acest lucru, navigați la Aspect > Editor (beta) :

Deschideți editorul site-ului

Aceasta va deschide Editorul complet de site. Aici, puteți face clic pe anumite elemente, cum ar fi antetul sau subsolul, pentru a modifica setările blocului:

Editați blocurile de site

Făcând clic pe pictograma cerc biton din colțul din dreapta sus, puteți actualiza tipografia, culorile și aspectul. Puteți chiar să alegeți una dintre combinațiile implicite de stil de teme:

Stiluri de editor de site

Dacă trebuie să adăugați blocuri noi, puteți selecta butonul +. Din această listă de opțiuni, puteți pur și simplu să glisați și să plasați elemente pe pagină:

Blocuri de editor de site

Pentru a vizualiza șabloanele de teme, faceți clic pe sigla WordPress din colțul din stânga sus. Aici, puteți selecta fie Șabloane , fie Părți șabloane :

Șabloane editor de site

În funcție de obiectivele dvs. de design, este posibil să doriți să adăugați șabloane noi. Alternativ, puteți edita opțiunile implicite disponibile:

Blocați șabloanele de teme

După ce selectați un șablon, veți deschide editorul de șabloane. Puteți edita această pagină adăugând blocuri noi, modele de blocuri sau părți de șablon:

Editarea șabloanelor

În cele din urmă, există moduri aproape nesfârșite în care vă puteți proiecta tema blocului. După ce ați făcut toate modificările necesare, salvați modificările.

Pasul 3: Exportați tema blocului dvs

Pentru a reutiliza această temă de blocare pe alte site-uri web, navigați la Aspect > Creare temă de blocare . Acest lucru vă va permite să exportați noua temă de blocare în câteva moduri diferite:

Exportați tema blocului

Dacă doriți să exportați tema cu modificările pe care tocmai le-ați făcut, selectați Export . Cu toate acestea, iată opțiunile alternative de export disponibile cu pluginul Creare temă bloc:

  • Creați o temă copil : descarcă o nouă temă copil folosind tema activată ca părinte.
  • Clonează tema curentă : clonează tema activată, inclusiv toate activele și modificările utilizatorului.
  • Suprascrie fișierele cu teme : salvează editările pe măsură ce se modifică tema, apoi șterge modificările utilizatorului.
  • Generați o temă goală : creează o temă standard în directorul de teme al site-ului dvs.
  • Creați o variație de stil : salvează modificările ca variație Global Styles a temei activate.

Dacă selectați Export sau Suprascriere , puteți descărca pur și simplu fișierele cu tema. Pentru orice altă opțiune, va trebui să furnizați un nume, o descriere, un URI al temei, un autor și un URI al autorului:

Creați o temă copil

Singura excepție este variația de stil. Aceasta necesită doar un nume de variație :

Creați o variație de stil

După ce selectați una dintre aceste opțiuni, faceți clic pe Creare temă . Aceasta vă va descărca tema de blocare personalizată ca fișier .zip, care conține toate fișierele cu tema editate. Puteți instala apoi această temă pe alte site-uri pentru a accelera procesul de dezvoltare.

Concluzie

Înainte de editarea completă a site-ului și blocarea temelor, crearea propriului design unic de site web era un proces complicat. Dacă sunteți începător cu WordPress, este posibil să nu fi avut abilitățile de codificare necesare pentru job. Cu toate acestea, acum, Editorul de site și pluginul Create Block Theme pot lucra împreună pentru a simplifica radical această sarcină anterior dificilă.

Pentru a recapitula, iată cum puteți crea o temă de blocare WordPress:

  1. Instalați o temă de blocare WordPress.
  2. Personalizați-vă tema cu Editorul site-ului.
  3. Exportați tema de blocare cu Creare temă de bloc.

Aveți întrebări despre crearea primei teme de bloc în WordPress? Spune-ne în secțiunea de comentarii de mai jos!