Cum să creezi o temă WordPress personalizată de la zero (2022)

Doriți să creați o temă WordPress personalizată pentru a oferi site-ului dvs. un aspect unic?

Construirea unei teme WordPress era imposibilă fără dezvoltatori scumpi sau fără cunoștințe de codificare. Dar astăzi, unele plugin-uri WordPress vă oferă posibilitatea de a vă crea propria temă personalizată folosind funcționalitatea simplă de glisare și plasare.

În acest articol, vă vom arăta cum să vă creați propria temă personalizată WordPress fără a scrie cod.

Pentru a trece la o anumită secțiune a tutorialului, puteți folosi linkurile rapide înainte:

1. Instalați pluginul SeedProd
2. Selectați un șablon de temă
3. Personalizați-vă părțile tematice WordPress
4. Conectați-vă cu un serviciu de corespondență
5. Publicați tema WordPress personalizată

Cum poți crea o temă WordPress de la zero?

Temele WordPress sunt create folosind o combinație de PHP, CSS, JavaScript și HTML. Acestea sunt limbaje de codare care necesită multă pregătire pentru a învăța. Așa că, dacă nu erai tu însuți un dezvoltator, singura ta opțiune era să angajezi agenții de dezvoltare pentru a construi teme pentru tine, ceea ce poate fi foarte costisitor.

Dar datorită SeedProd, acum vă puteți crea propria temă personalizată WordPress fără codare. Vine cu o interfață simplă de glisare și plasare pe care oricine o poate folosi și vă permite să personalizați cu ușurință fiecare aspect al designului temei.

De ce SeedProd?

SeedProd este cel mai ușor de utilizat plugin pentru crearea paginilor de destinație pentru WordPress.

Oferă un nivel ridicat de personalizare și vine cu o mare varietate de caracteristici suplimentare, inclusiv:

• Creator de teme
• Peste 150 de șabloane de pagini de destinație
• Trageți și plasați generatorul
• Integrari de email marketing
• 2 milioane de fotografii de stoc
• și altele.

Cu aceste funcții, puteți construi rapid pagini de destinație pe site-ul dvs. în cadrul unei teme WordPress existente. Dar acum, SeedProd a adăugat o nouă caracteristică care vă permite să vă creați propria temă personalizată WordPress folosind același design drag and drop pentru o ușurință maximă de utilizare.

Să vedem cum poți crea o temă WordPress folosind SeedProd.

Cum se creează o temă WordPress personalizată folosind SeedProd

Vom presupune că aveți deja un site web WordPress găzduit pe un domeniu pentru acest tutorial. Dacă nu, puteți consulta acest ghid despre crearea unui site web WordPress.

Dacă doriți să înlocuiți tema WordPress existentă cu cea pe care o veți crea, vă recomandăm să utilizați un site de dezvoltare de testare pentru aceasta. În acest fel, nu riscați să provocați accidental erori pe site-ul dvs. principal. Servicii de găzduire WordPress de top, cum ar fi Bluehost, oferă medii de dezvoltare pentru WordPress.

În cele din urmă, asigurați-vă că ați făcut backup site-ului înainte de a vă crea tema. Acest lucru vă asigură că vă puteți restabili întotdeauna site-ul la o stare stabilă dacă ceva nu merge bine. Puteți găsi diverse opțiuni în această listă de pluginuri de backup WordPress.

După ce ați făcut aceste pregătiri, este timpul să începeți să creați o temă WordPress personalizată fără cod!

Pasul 1. Instalați pluginul SeedProd

În primul rând, instalați pluginul SeedProd pe site-ul dvs. WordPress. Puteți vedea instrucțiunile pentru instalarea pluginurilor WordPress dacă nu ați instalat niciodată un plugin înainte.

Veți avea nevoie de cel puțin licența SeedProd Pro pentru a debloca funcția de creare a temei. Pentru a activa licența Pro, deschideți zona de cont SeedProd și faceți clic pe fila Descărcări . Derulați în jos pentru a găsi cheia de licență și copiați-o.

Apoi, deschideți zona de administrare WordPress și accesați SeedProd » Setări. Apoi introduceți cheia pe care ați copiat-o în câmpul Cheie de licență și apăsați pe Verificare .

Acum, mergeți la SeedProd » Theme Builder. Acesta este tabloul de bord în care vor trăi toate elementele tematice diferite.

Acum, există două moduri prin care puteți să vă creați tema cu SeedProd: creați singur fiecare parte a temei sau utilizați un șablon prestabilit și editați părțile care nu vă plac.

Fiecare temă WordPress constă din diferite părți, inclusiv:

• Antet
• Subsol
• Pagina principala
• Postare unică
• Pagina singura
• Arhivă sau pagină de blog
• Bara laterală

Poate fi puțin intimidant să creezi fiecare dintre aceste părți de la zero dacă este prima dată când creezi o temă. În acest caz, există o modalitate mai ușoară de a face acest lucru.

SeedProd vine cu diverse șabloane de teme pre-construite care stabilesc structura generală pentru tema dvs. completă. În acest fel, toate părțile diferite sunt adăugate automat la structură, dar puteți totuși personaliza fiecare parte după preferințele dvs.

Pentru restul tutorialului, vom folosi una dintre temele SeedProd pentru a vă arăta pașii, deoarece aceasta este metoda cea mai prietenoasă pentru începători de a crea o temă WordPress personalizată.

Pasul 2. Selectați un șablon de temă

Funcția de creare a temei are mai multe teme pre-construite modelate după site-uri web de afaceri de diferite tipuri. Pentru a vizualiza temele disponibile, faceți clic pe butonul Teme .

SeedProd vine cu șabloane pentru diferite afaceri și industrii, inclusiv agenții de marketing, restaurante, companii de îngrijire a animalelor de companie și multe altele.

Vom folosi tema Starter pentru acest exemplu. De îndată ce selectați o temă, SeedProd va crea automat toate părțile individuale ale temei.

De asemenea, puteți dezactiva diferite părți ale temei dacă nu aveți nevoie de ele pentru site-ul dvs. web. Pentru a dezactiva orice secțiune, puteți folosi butoanele de comutare de sub titlul Publicat.

Puteți modifica setările pentru fiecare parte a temei dvs. făcând clic pe butonul Editați condiții .

Aceasta va deschide un mod în care puteți schimba numele, tipul, prioritatea și configura condițiile pentru când și unde ar trebui să apară această parte pe site-ul dvs. web.

În cele mai multe cazuri, puteți lăsa aceste setări implicite și puteți trece la personalizarea fiecărei părți a temei.

Pasul 3. Personalizați-vă părțile tematice WordPress

Acum că toate componentele esențiale ale temei dvs. sunt stabilite, putem personaliza designul fiecăruia pentru a arăta exact așa cum ne dorim.

Pentru a începe editarea, mutați cursorul peste o parte a temei și faceți clic pe Editare design .

Pentru acest tutorial, vom personaliza antetul, subsolul, pagina de pornire și pagina de blog. Aceleași principii de personalizare se aplică tuturor celorlalte pagini.

Antet și subsol

Pentru a începe editarea antetului, faceți clic pe butonul Editați designul care apare când treceți cu mouse-ul peste antet. Acest lucru vă va duce la interfața de creare a temei de tip drag and drop a SeedProd. Indicați și faceți clic pe zona antetului pentru a deschide opțiunile de personalizare, care vor apărea în panoul din stânga.

În mod implicit, antetul are sigla SeedProd. Îl poți înlocui cu logo-ul afacerii tale foarte ușor. Faceți clic pe imagine pentru a o șterge sau a o înlocui prin încărcarea propriului logo.

SeedProd vă permite să vă schimbați dimensiunea și alinierea logo-ului. De asemenea, puteți adăuga un link personalizat la logo. De exemplu, este posibil să doriți să redirecționați utilizatorii către pagina de pornire atunci când aceștia dau clic pe logo.

De asemenea, puteți schimba culoarea de fundal a antetului. Pur și simplu mutați mouse-ul peste zona antetului până când vedeți un contur albastru. Faceți clic pe acesta pentru a găsi un nou meniu de opțiuni în panoul din stânga. Acum, puteți schimba culoarea antetului și puteți alege o culoare solidă sau chiar un gradient.

Acum, faceți clic pe fila Avansat pentru a accesa mai multe setări, cum ar fi umbră, spațiere, chenar, poziție și multe altele.

Când ați terminat de efectuat toate modificările, faceți clic pe butonul Salvare din colțul din dreapta sus al constructorului și faceți clic pe butonul încrucișat pentru a ieși la tabloul de bord principal al generatorului de teme.

Dacă doriți să includeți un antet în site-ul dvs., puteți repeta acești pași pentru a edita designul subsolului dvs.

În continuare, vom edita pagina de pornire.

Pagina principala

Pagina de pornire este partea din față a site-ului dvs. În mod normal, conține elemente importante care definesc cine ești, ce faci și oferă dovezi sociale prin recenzii și mărturii.

Șablonul Temă de pornire pe care îl folosim are toate secțiunile cheie pe care le veți găsi în mod normal pe pagina de pornire a unui site web de afaceri, inclusiv:

• Zona eroilor
• Secțiunea de caracteristici
• Mărturii
• Secțiunea de întrebări frecvente

Puteți schimba fiecare bloc al acestei pagini, inclusiv imaginile, textul, butoanele, culorile și aspectul.

În gif-ul de mai jos, vă vom arăta cât de ușor este să editați diferite părți ale paginii folosind acțiuni simple de glisare și plasare.

Utilizați setările și blocurile din meniul din stânga pentru a edita designul până când sunteți pe deplin mulțumit. După ce ați făcut toate modificările, asigurați-vă că verificați previzualizarea pe mobil.

Dacă vreun element al site-ului pare să se destrame în vizualizarea mobilă, puteți reveni la editare și puteți face ajustări până când arată perfect.

Când sunteți mulțumit de pagina dvs. de pornire, apăsați butonul Salvare și reveniți la tabloul de bord al generatorului de teme SeedProd.

Pagina de blog

Acum să creăm o pagină de blog personalizată pentru site-ul dvs. Pe tabloul de bord al generatorului de teme, faceți clic pe linkul Editați design din secțiunea Index blog, Arhive, Căutare pentru a începe editarea acestuia.

Aici puteți adăuga sau elimina diferite elemente, cum ar fi conținutul postării, fragmentul, biografia autorului și multe altele, folosind interfața de glisare și plasare. Faceți clic pe una dintre postările afișate pe această pagină pentru a accesa mai multe setări.

Aceste setări vă permit să schimbați tipul de interogare a postărilor, aspectul, paginarea. De asemenea, puteți modifica detaliile suplimentare de control care ar trebui să apară cu fiecare postare, cum ar fi data postării, autorul, imaginea prezentată, fragmentul și multe altele.

După ce ați personalizat pagina de blog, faceți clic pe Salvați și reveniți la tabloul de bord din nou.

CSS global

Secțiunea CSS globală configurează setările globale pentru culorile, tipografia, aspectul și stilul temei.

Din tabloul de bord Theme Builder, faceți clic pe Edit Design sub secțiunea Global CSS a temei dvs.

De exemplu, puteți alege o culoare și un font pentru buton care doriți să apară pe întregul site.

În mod similar, puteți schimba fonturile textului, fundalurile, aspectul și chiar puteți adăuga CSS personalizat la tema dvs. Aceste modificări se vor aplica pe întregul site și vor asigura coerența stilistică.

Când ați terminat de ajustat setările după cum doriți, faceți clic pe butonul Salvare .

Pasul 4. Conectați-vă cu un serviciu de corespondență

SeedProd vă permite să vă conectați cu serviciul dvs. de marketing prin e-mail, care este un pas important dacă doriți să includeți un formular de abonare sau de înscriere în tema dvs.

De fapt, dacă aveți WPForms instalat pe site-ul dvs., acesta se integrează automat cu SeedProd. Deci, puteți încorpora orice formulare pe care le-ați creat cu WPForms în orice parte a temei dvs. folosind SeedProd.

Odată ce ați creat un formular, trebuie să vă asigurați că serviciul dvs. de marketing prin e-mail este conectat la SeedProd, astfel încât să puteți trimite și primi e-mailuri legate de formular.

Pentru a vă conecta serviciul de marketing prin e-mail cu tema SeedProd, faceți clic pe fila Conectare din bara de sus a ecranului de creare a temei în timp ce editați orice parte a temei.

Faceți clic pe orice mailer din listă și urmați instrucțiunile de pe ecran pentru a finaliza integrarea cu tema dvs. SeedProd. Când ați terminat, intrările din formularul de optin vor fi adăugate automat la lista dvs. de corespondență.

Pasul 5. Publicați tema WordPress personalizată

Tema dvs. este acum gata pentru a fi implementată! Pentru a vă prezenta tema live, accesați tabloul de bord al generatorului de teme și faceți clic pe butonul de comutare Activare tema SeedProd din colțul din dreapta sus al ecranului.

Acum, să aruncăm o privire la noua noastră temă personalizată WordPress!

Aceasta este pagina de pornire a temei cu antetul:

Și iată pagina blogului.

Si asta e! Tocmai ți-ai creat prima temă personalizată WordPress fără cod!

Apoi, creați formulare de contact pentru site-ul dvs. WordPress

Acum că aveți un site WordPress nou-nouț, ar trebui să luați în considerare adăugarea de formulare de contact pentru a permite vizitatorilor să vă contacteze cu ușurință. WPForms este cel mai ușor de utilizat generator de formulare WordPress, cu peste 5 milioane de instalări active.

Nu numai că vă puteți crește lista de corespondență cu WPForms, ci și puteți efectua o serie de alte activități, cum ar fi colectarea de donații pentru organizația dvs. nonprofit.

Creați-vă formularul WordPress acum

Sunteți gata să vă construiți formularul? Începeți astăzi cu cel mai simplu plugin pentru generatorul de formulare WordPress. WPForms Pro include o mulțime de șabloane gratuite și oferă o garanție de rambursare a banilor de 14 zile.

Dacă acest articol v-a ajutat, vă rugăm să ne urmăriți pe Facebook și Twitter pentru mai multe tutoriale și ghiduri WordPress gratuite.