Șabloanele gratuite de site-uri PSD sunt utile pentru crearea de afaceri, portofoliu și alte tipuri de site-uri web. Ele pot fi găsite peste tot pe Internet. Ca să nu spun că majoritatea sunt urâte, dar rareori vei găsi ceva care să-ți depășească standardele. Din moment ce Adobe Photoshop este unul dintre acele programe „ușor de utilizat, greu de stăpânit”, mulți începători și profesioniști aleg să meargă cu șabloane PSD pentru primul lor site web. Asta pentru că șabloanele web PSD sunt ușor de configurat, editat și utilizat. Cu toate acestea, trebuie să obțineți acele șabloane web din surse de încredere. Este ușor să te îndrăgostești de un design șablon web, să-l descarci cu entuziasm și să-l despachetezi pe Photoshop, doar pentru a realiza că este o mizerie totală și că nu poți să-ți găsești calea.

Șabloanele web bune sunt plăcute din punct de vedere estetic, liniștitoare pentru ochi. Șabloanele web grozave, pe de altă parte, combină acest tip de frumusețe cu capacitatea de utilizare pentru a crea cele mai bune șabloane atrăgătoare și ușor de utilizat.

Indiferent dacă doriți un șablon web de portofoliu, un șablon de blog personal, un șablon de comerț electronic sau un șablon de restaurant, veți găsi această listă cu cele mai bune șabloane PSD gratuite.

DESCĂRCĂRI NELIMITATE: Peste 500.000 de șabloane de site și elemente de design

Toate șabloanele de site web de care aveți nevoie și multe alte elemente de design sunt disponibile pentru un abonament lunar la Envato Elements. Abonamentul costă 29 USD pe lună și vă va oferi acces nelimitat la o bibliotecă masivă și în creștere de 500,000+ articole care pot fi descărcate ori de câte ori este nevoie (de asemenea, fotografii de stoc)!

DESCARCĂ ACUM

Când aveți designul gata, vine momentul să îl prezentați într-un mod care să inspire pe toată lumea. Deși puteți utiliza o captură de ecran simplă, puteți, de asemenea, să duceți lucrurile într-un grad complet nou cu un șablon de site web PSD. Acest pachet special include șapte stiluri diferite pe care le puteți folosi în beneficiul dumneavoastră. De la iMac, Macbook și o singură pagină la două iPhone-uri și Macbook decupat, opțiunile sunt acolo, la îndemâna ta. De asemenea, puteți edita fundalul păstrându-l transparent sau adăugați culoare sau chiar imagine. Faceți lucrurile așa cum vă place și prezentați-vă lucrările în cea mai bună lumină posibilă.

Modele de dispozitiv super minimale, curate și uimitoare pe care le puteți folosi pentru a afișa flexibilitatea site-ului dvs. În kit, există douăsprezece variante diferite, fiecare originală, creativă și care atrage atenția. Mai mult, puteți alege între Macbook, iPad și iPhone. Pur și simplu trageți și plasați reclamele și lăsați șablonul dorit să le afișeze instantaneu. Alte bunătăți includ unsprezece suprapuneri de umbre, fundal personalizabil și șase opțiuni principale de culoare. Acum aveți o soluție completă pentru a face o prezentare care va învârti capetele. Dacă păstrarea lucrurilor simple și minime este ceașca ta de ceai, acest pachet model este perfect pentru tine.

Un șablon de model de site web uimitor, modern și ușor de utilizat, cu șase vizualizări izometrice diferite. În cazul în care acesta este stilul de prezentare pe care ați dori să-l practicați pentru prezența dvs. online, faceți-l să se întâmple în cel mai scurt timp. Nu este nevoie să-ți petreci nenumărate ore pe modul în care ai dori să-ți arăți munca când un șablon o poate face să se întâmple într-o clipă de deget. Glisați în desenele dvs. și cam asta este. Puteți adăuga mai multe aspecte de pagină pentru a vă prezenta întregul site web, precum și să editați fundalul. Pe scurt, produsul final va fi o adevărată capodoperă, ajutându-vă să câștigați noi clienți.

O colecție completă de diverse modele de site-uri web, cu diferite dispozitive. Acum puteți crește flexibilitatea paginii dvs. pe iPhone, iMac, Macbook și iPad. De asemenea, veți găsi paisprezece scene PSD diferite de 4000 x 2500 px. Le puteți folosi pentru tot felul de prezentări diferite, care merg dincolo de prezentarea designului site-ului web. Alte caracteristici includ reglarea umbrelor și luminii, obiecte inteligente (doar trageți și plasați), zoom 50% și multe altele. De asemenea, puteți schimba culoarea de fundal și vă puteți bucura de personalizare foarte detaliată. Cu editarea și îmbunătățirea super rapidă, puteți avea mai multe prezentări diferite disponibile în câteva minute.

O altă alternativă fantastică la toate celelalte șabloane de machetă de site-uri web, în ​​care cauți un dispozitiv pentru a-ți afișa designul. În acest caz, primești douăsprezece fișiere PSD diferite incluse în kit, dimensiuni 4000 x 2500 px. Obiectele și umbrele sunt separate pentru o editare impecabilă. Țineți cont de faptul că acest pachet de machete vine cu instrucțiuni care vă vor ajuta în călătoria dvs. spre realizarea afișării uimitoare și foto-realiste a designului paginii dvs. Datorită straturilor de obiecte inteligente, nu trebuie să investiți mult timp și energie în activarea acestor machete. Doar glisați în imaginea dvs. și vedeți-o în acțiune într-o clipă.

Avire

Avir este un șablon de o pagină extrem de personalizabil, care prezintă un design în stil plat. Este simplu de utilizat și modificat pentru a se potrivi nevoilor dumneavoastră. Cu câteva modificări ici și colo, poate satisface cu siguranță toate cerințele dumneavoastră.

Hexal

Hexal este un șablon unic de portofoliu care este garantat să lase impresii de durată vizitatorilor site-ului dvs. Este cu siguranță perfect pentru designeri web, designeri grafici și oricine are o minte creativă.

Design texturat

Puteți folosi acest fișier PSD gratuit atât în ​​scopuri personale, cât și în scopuri comerciale. Este un șablon web de portofoliu de o pagină care se adresează oamenilor creativi.

Comutator

Switch este un șablon web multifuncțional 3D bootstrap, ceea ce înseamnă că poate deveni orice doriți să fie! Acesta servește ca un șablon grozav de o pagină, care oferă diverse soluții pentru toate nevoile dvs.

Kappe

Kppe este un șablon web creativ multifuncțional. Cu designul său bazat pe grilă, vă puteți converti într-un blog personal sau într-o pagină web de afaceri cu câteva clicuri de mouse.

Notifică

Notify este cea mai bună pagină de destinație a aplicației de pe web. Designul său elegant și modern se va asigura că mesajul dvs. este transmis așa cum v-ați imaginat.

Bună ziua, astăzi am decis să public un articol despre crearea unui aspect pentru site-ul web, pe care îl vom pune apoi pe plan și pe care îl vom folosi motor wordpress. Prin urmare, dacă nu doriți să ratați lansarea acestor articole, atunci asigurați-vă că vă abonați la actualizările blogului și după publicarea articolului veți afla imediat despre el. Crearea unui aspect al site-ului PSD și crearea unui șablon wordpress este de fapt un proces foarte simplu și sunt sigur că veți putea să urmați instrucțiunile mele și să vă obțineți un șablon complet unic.

Pentru a crea un șablon, nu avem nevoie de multe cunoștințe, cunoștințe despre HTMLŞi CSS, citește doar articolele din subiectele de pe acest blog. O atenție deosebită trebuie acordată utilizării etichetelor DIV și etichetelor SPAN.

Acum să ne dăm seama de ce avem nevoie pentru a crea un aspect PSD și, ulterior, să proiectăm acest șablon pentru site. De fapt, nu aveți nevoie de multe pentru asta, un program Photoshop care poate fi descărcat de pe Internet, sper că aceasta nu va fi o problemă pentru dvs. și descărcați materialele sursă pentru aceasta.

De asemenea, voi publica în curând articole în care voi vorbi despre cum să creez texturi și fundaluri pentru site, așa că abonați-vă la actualizările blogului.

Crearea unui document.

Acum să începem să creăm aspectul și să creăm document nou. Selectați fișierul - creați. Selectați dimensiunile pentru document 960 pe 1600 pixeli.

Desenăm două ghidaje, stânga și dreapta. Pentru a face acest lucru, pur și simplu faceți clic pe rigle și trageți linii.

Acum trebuie să redimensionăm pânza. Pentru asta alegem Dimensiunea imaginii pânză și selectați o dimensiune a pânzei de 1200 x 1600 pixeli. După aceea, umpleți această zonă cu alb folosind instrumentul Paint Fill.

Grupuri pentru șablon.

Acum să creăm grupuri pentru site. Să creăm grupuri standard ca pe toate șabloanele și acestea sunt: ​​antet, meniu, conținut, coloana laterală și subsolul site-ului. Acest lucru este foarte ușor de făcut în meniul de straturi, faceți clic pe imaginea folderului pentru a redenumi grupul creat, trebuie doar să faceți dublu clic pe nume și să introduceți numele dorit.

Antetul site-ului.

Acum să începem prin a crea un antet pentru site. Primul lucru pe care trebuie să-l faceți este să deschideți textura cu numele „Textura 1”. Și acum trebuie să decupăm fundalul negru, acest lucru este foarte ușor de făcut, selectați instrumentul « baghetă» și faceți clic pe fundalul negru, acum faceți clic dreapta pe zona de lumină și selectați „Inversați zona selectată”.

Următorul pas este să ne ajustam limitele, să selectați butonul din dreapta al mouse-ului și să selectați Rafinați marginea. Și setați toate setările așa cum se arată în imagine.

Acum selectați „ straturi – nou – copiați în strat nou" Acum luăm stratul cu mouse-ul și îl tragem pe desenul nostru.

Următorul pas este să răsturnați desenul. Pentru a face acest lucru, selectați Editare-Transformare-Rotire 90 de grade în sens invers acelor de ceasornic. După aceasta, apăsând butonul stâng al mouse-ului, va trebui să vă mutați stratul, așa cum se arată în figura de mai jos.

Acum trebuie să creștem saturația imaginii noastre și pentru aceasta mergem la fila Imagini - Ajustări - Nuanță/Saturație. Acum trebuie să reducem luminozitatea imaginii la -100. Și asta ar trebui să obținem:

Acum să scriem logo-ul site-ului nostru. Pentru a face acest lucru, trebuie să instalăm un font nou. Cred că ați descărcat deja fișierul material sursă și există și un fișier cu font în arhivă. Primul lucru pe care trebuie să-l faceți este să dezarhivați fontul. Acum trebuie să mergem la folder (cel mai adesea acesta este Drive C:/windows - Fonturi).
Și copiați toate fișierele cu fonturi acolo. Acum reporniți programul și acest font va fi disponibil pentru dvs.
Acum selectați instrumentul Text și selectați fontul nostru, colorați alb și creați un logo lângă ghidul din stânga. Iată ce am primit.

Acum să creăm un meniu în partea dreaptă. Acesta va consta din trei puncte principale și acestea sunt Acasă, Contacte și despre autor. Selectați din nou instrumentul Text și faceți clic pe el în locul dorit. Culoarea este albă, fontul este Wide Latin și dimensiunea este de 18 pixeli.

Creați un nou strat. Acum luați instrumentul lasso drept și selectați butonul din jurul uneia dintre etichete.

Și umpleți zona selectată cu culoarea 2A2A2A. Acum schimbăm ordinea straturilor, mutând stratul cu inscripția deasupra stratului cu umplere.

Conținutul principal al site-ului.

Și acum avem un buton de meniu după ce a fost făcut clic pe acesta. Acum trebuie să mergem la folderul Conținut și să creăm un nou strat în el.

Deschidere figura 3și puneți-l sub toate straturile. Folosind transformarea, mărim dimensiunea imaginii până ce umple întreg spațiul.

Acum ajustăm luminozitatea și contrastul texturii. Pentru a face acest lucru, apăsați butoanele Ctrl + Shift + U. Selectați Imagine – Corecție – Curbe.

Setăm setările ca în figură.

Să creăm un nou strat, iar acum vom selecta zona de conținut cu tine. Zona noastră de conținut va fi albă și va avea dimensiuni de 660 x 1200 pixeli. Pentru a face acest lucru, selectați instrumentul „Zona dreptunghiulară și stil - proporții date”, unde trebuie să introducem dimensiunile câmpului Și apoi trebuie să umplem câmpul cu instrumentul „Umplere”.

Acum trebuie să stabilim un accident vascular cerebral pentru domeniul nostru. Selectați stratul pe care se află imaginea noastră și faceți clic pe butonul „Adăugați stil de strat”, selectați Stroke din meniul drop-down.

Și setați următoarele setări - grosime 1 pixel și culoare c8c7c7.

Acum deschis poza 4, folosind scalarea reducem dimensiunea, ar trebui să fie cu aproximativ zece pixeli mai mare față de câmpul alb din dreapta și din stânga. Partea de sus și de jos trebuie să fie indentată cu 50-60 de pixeli.

Acum apăsați combinațiile de butoane Ctrl + Shift + U pentru a decolora textura și pentru a ajusta luminozitatea folosind curbe. Setări ca în imagine.

Selectați stratul cu pânza noastră albă, faceți clic dreapta și selectați „ Selectați pixeli».

Acum selectați stratul gri și faceți clic selectie - modificare - comprimareși setați reducerea la trei pixeli. După care trebuie să inversăm selecția, am făcut deja acest lucru și este ușor de făcut, selectați Selectie-inversare, apăsați butonul Del. Acesta este ceea ce ar trebui să obținem:

Acum creați o mască pentru același strat gri.

Selectați un gradient alb-negru și, făcând clic stânga, trageți de la marginea mijlocie la marginea de jos a paginii și astfel ușurați tranziția.

Acum să creăm butoanele de navigare a paginii. Pentru a face acest lucru, trebuie doar să desenăm un dreptunghi negru, puteți alege dimensiunea la discreția dvs. De asemenea, trebuie să scrieți numele paginilor în fiecare buton. Folosim un font pentru inscripții Times Nou Roman și dimensiune 18 pixeli.

Acum să deschidem imaginea cu pictogramele și să le adăugăm în partea opusă a meniului principal. Acum trebuie să indentăm conținutul pe ambele părți cu douăzeci de pixeli. Acum trebuie să adăugăm un titlu la primul nostru articol, culoarea textului este neagră. Pentru data si numarul de comentarii am folosit culoarea cb8154.

Acum, pentru a separa titlul de conținutul principal al site-ului, trebuie să trasați o linie. Pentru a desena o linie dreaptă, trebuie să selectați instrumentul creion și, în timp ce apăsați tasta Shift, trageți o linie făcând clic la început și desenând până la sfârșitul liniei.

Acum trebuie să creăm un loc pentru previzualizare. Pentru a face acest lucru, creați un dreptunghi cu dimensiunile de care avem nevoie, am decis să-l fac 165 pe 165 pixeli și să-l umplem cu negru. Să-i aplicăm setările: contur și umbră.

Accident vascular cerebral.

Umbră.

Acum să adăugăm niște text personalizat. Acesta este ceea ce ar trebui să obținem:

Acum, după terminarea articolelor, trebuie să separați 30 de pixeli și culoarea gri (SSSSSS). Apoi desenați patru pătrate care măsoară 32 pe 32 de pixeli și umpleți-le cu culoarea roșie 8E0A13.

Desenați un formular de căutare.

Pentru a face acest lucru, trebuie doar să desenăm o zonă dreptunghiulară de culoare albă și să-i aplicăm o umbră interioară.

Acum desenăm un buton roșu de aceeași dimensiune 32 pe 32 și culoare roșie și scriem cuvântul „în alb” Căutare».

Meniu lateral.

Pe un nou strat, desenați un dreptunghi cu lățime de 270 de pixeli și umpleți-l cu culoarea 1F1F1F. Adăugăm și un antet cu aceeași lățime de 270 pixeli și înălțime de 25 pixeli, umplut cu negru.

Acum trebuie să scriem categorii pentru blog. Textul este în font Times New Roman și are o dimensiune de 16 pixeli. Trebuie să adăugați o imagine la fiecare element de meniu. Selectați " Figura liberă"și selectați forma punctului raster" Ornament 4„și umpleți-l cu culoarea 818181.

Subsolul site-ului.

Nu ne vom deranja prea mult cu subsolul, doar vom completa întreg câmpul cu negru și vom adăuga un meniu, font Times New Roman, dimensiune 18 pixeli și culoare E6E6E6.

Dacă doriți să descărcați șablonul rezultat, faceți clic pe butonul și un link de descărcare va fi disponibil pentru dvs. Acest articol s-a terminat și cred că acum știți că primul pas pentru a crea un șablon WordPress este crearea unui aspect al site-ului PSD.

Pentru a vă face site-ul web pe WordPress, cu siguranță va trebui să adăugați o temă. Se mai numesc si sabloane. Aceasta este baza oricărei resurse web.

Acest articol va discuta etapele creării unui șablon și va descrie aspectul fișierelor PSD.

Veți afla, de asemenea, despre cerințele tehnice de bază pentru temele WordPress, cum ar trebui să fie un șablon pentru ca acesta să funcționeze pe nucleul WordPress. Drept urmare, veți putea crea un site web cu propria temă, care va satisface exact cerințele dumneavoastră.

Vă rugăm să rețineți că acest ghid nu include descrieri pentru adăugarea unei teme gata făcute - acesta este un manual pentru generarea propriului șablon. Dacă ați descărcat o temă și nu știți cum să o instalați, atunci accesați zona de administrare WordPress, la secțiunea „Aspect” și adăugați acolo unul dintre modelele disponibile. Acum să aruncăm o privire mai atentă la ce este o temă, de ce este necesară și cum să o creați singur.

În ce scop este creată manual o temă?

O temă (șablon) este o colecție de fișiere funcționale și de stil care împreună determină designul resursei. Tema determină cum va arăta site-ul, așa că este foarte important să abordați corect procesul de creare a unui șablon. Mulți oameni își pun acum întrebarea: „De ce să vă creați propria temă dacă puteți descărca una gata făcută de pe Internet și gratuit?” Aceasta este o întrebare logică și există un răspuns complet cuprinzător la aceasta: „Pentru a crea șablonul perfect care să corespundă pe deplin cerințelor dumneavoastră.”

Când cumpărați un design sau îl descărcați dintr-un catalog șabloane gratuite WordPress, de obicei sacrifici calitatea. De regulă, astfel de șabloane nu au totul potrivit pentru tine. Dar te smeri, cred că una sau două nuanțe nu sunt întregul tablou și că mai târziu vei edita subiectul. Dar, în realitate, se dovedește că site-ul rămâne cu o temă neterminată care nu vă place. Prin urmare, este mai bine să vă faceți pe cont propriu imediat. Și, deși aspectul poate părea complicat la început, atunci, atunci când înveți, poți chiar să creezi șabloane personalizate.

În plus, după ce ai creat un șablon, te vei simți ca un „medic” WordPress - vei ști ce se află în interiorul site-ului. Înțelegeți ce elemente sunt responsabile pentru ce. Apoi site-ul și vei vorbi în Tine. Familiarizați-vă cu etichetele, structura și buclele WordPress. Sau poate că veți dori să faceți acest lucru profesional și să începeți să creați șabloane pentru a vă câștiga.

Așadar, iată principalele motive pentru care ar trebui să vă creați propriul șablon de site:

• învață totul despre HTML, CSS și ceva despre PHP;
• vei putea crea, deoarece web design-ul este și o artă;
• se va putea câștiga bani prin vânzarea de teme;
• descoperi o nouă abilitate;
• creați un design care se va potrivi 100% viitorului dvs. site web.

Ce standarde îndeplinește tema?

Când scrieți un șablon, este foarte important să respectați regulile oficiale. Încălcarea codului, inserarea unei etichete în locul greșit și omiterea acesteia poate dăuna designului și poate distruge complet aspectul acestuia. Ar trebui să vă familiarizați cu regulile de scriere a codului PHP, precum și cu HTML, dacă nu sunteți deja familiarizați cu aceste limbi. De asemenea, veți avea de-a face cu foile de stil în cascadă CSS, așa că amintiți-vă și elementele de bază - există o mulțime de informații despre asta pe Internet. Ei bine, ultima și cea mai puțin importantă cerință este să creezi un site web ca un designer, și nu ca un școlar, astfel încât să obții un proiect serios. Altfel, nu are rost să ne ocupăm de această chestiune.

Toate temele WordPress sunt găzduite în folderul wp-content/themes/. În interiorul acestui folder există și alte foldere cu teme individuale, un fișier cu funcții suplimentare (functions.php), fișiere de stil și imagini. Pentru a găsi date despre un anumit subiect, trebuie să mergeți la directorul corespunzător. Deci, tema „Western” va fi plasată în folderul wp-content/themes/western/.

Înainte de a începe, ar trebui să aruncați măcar câteva priviri asupra structurii temelor prefabricate. Site-ul WordPress implicit vine cu două șabloane standard pe care le puteți răsfoi. Acesta este șablonul implicit și clasic. Deschideți fișierele lor în directorul dorit de pe server și comparați diferențele dintre ele.

Veți observa că șablonul constă de obicei din trei formate de fișiere:

1. Style.css este un fișier de stil responsabil pentru designul extern al site-ului.
2. Functions.php – fișierul funcției, care adaugă diverse funcții paginilor.
3. Alte fișiere php care sunt responsabile pentru caracteristicile de afișare a șablonului pe site și integrarea temei cu WordPress. Aceste fișiere vă permit să convertiți aspectul PSD într-un șablon cu drepturi depline.

Să ne uităm la fiecare dintre aceste fișiere mai detaliat pentru a înțelege cum este creată tema WordPress.

Reguli pentru crearea unui fișier style.css

În primul rând, trebuie să respecte toate caracteristicile de marcare CSS. Cum va arăta site-ul dvs. depinde de acest fișier. Dar nu va funcționa dacă nu îi adăugați o descriere a șablonului creat. Aceasta este prima caracteristică a WordPress care trebuie luată în considerare atunci când transferați un aspect PSD în motorul WordPress. Va trebui să specificați următorii parametri:

1. Numele șablonului.
2. Adresa URL care duce la subiect.
3. Descriere care indică principalele caracteristici ale șablonului. Scurt.
4. Numele autorului. În acest caz, vă rugăm să includeți numele dvs.
5. Link către autor, adică către tine. Puteți furniza un link către profilul dvs. de pe rețelele sociale.
6. Numele temei părinte este opțional.
7. Versiune tematică. Dacă tocmai l-ați creat, atunci v. 1.0.
8. Descrierea completă a șablonului. Puteți scrie în detaliu.

Pentru a crea cea mai simplă temă WordPress, trebuie doar să adăugați o versiune editată cu un singur fișier style.css. În acest fișier, lângă linia „șablon”, specificați numele temei părinte. De exemplu, Classic dacă editați un șablon standard. Acum tema creată va corespunde pe deplin șablonului clasic. Prin urmare, va trebui să încărcați fișierele în directorul wp-content/themes/classic.

În acest fel, puteți crea prima temă, cea mai simplă, care va fi „descendentul” unui șablon gata făcut. Dar acesta nu va fi un design cu drepturi depline al site-ului, ci doar o încercare de a-l dispune, așa că ar trebui să continuați cercetarea.

Caracteristici ale fișierului de funcționalități suplimentare functions.php

Șabloanele nu folosesc întotdeauna un fișier functions.php, dar în majoritatea cazurilor este necesar. Trebuie plasat într-un director cu tema corespunzătoare. Vă rugăm să rețineți că, dacă acest fișier este prezent în folderul șablon, va fi luat în considerare atunci când tema este inițializată. Funcționează ca un plugin. Și va îndeplini astfel de funcții pe care i le oferiți.

Scopul principal al fișierului functions.php este de a determina funcțiile de personalizare disponibile în panoul de administrare pentru o anumită temă. Adică toate funcțiile pe care le introduceți în functions.php vor fi afișate în panoul de administrare sau pe pagina de utilizator. De obicei, aceasta înseamnă schimbarea schemei de culori pentru un site WordPress, schimbarea fontului și multe altele. Dar există multe utilizări pentru acest fișier. Cu toate acestea, aceasta este o cu totul altă poveste...

Caracteristicile fișierelor șablon php

Fișierele PHP vor fi responsabile pentru părțile individuale ale site-ului. Acestea definesc atât componentele paginii, cât și titlurile, categoriile și alte secțiuni care vor fi afișate utilizatorului. Deoarece acum sunteți creatorul temei, numai dvs. veți determina care și câte fișiere șablon să alegeți. După selectarea lor, în panoul de administrare vor apărea noi funcții. Cu cât selectați mai puține fișiere, cu atât site-ul va funcționa mai rapid, dar va avea mai puține funcționalități. Gândiți-vă bine la ce fișiere aveți nevoie și de care vă puteți descurca.

Dacă doriți să adăugați o temă minimă pe site-ul dvs. sau să testați aspectul PSD, atunci aveți nevoie doar de două fișiere în directorul șablonului:

1. Style.css.
2. Index.php.

Webmasteri cu experiență reușesc să schimbe fișierul index.php în așa fel încât să fie suficient să faci setări pentru subsol, bară laterală, căutare, arhivă, categorii, pagini etc. Dar mai bine ai încerca să faci un șablon WordPress în care fiecare fișier va îndeplini funcția corespunzătoare.

Chiar dacă omiteți accidental orice fișier șablon, WordPress va adăuga automat propriile setări implicite pe site. De exemplu, dacă nu adăugați fișierul responsabil pentru comentarii, motorul va găsi propriile versiuni ale acestei funcții în directoare - de exemplu, wp-comments.php. Apoi, comentariile „extraterestre” se vor prăbuși în structura site-ului dvs., care nu va îndeplini cerințele șablonului. Pentru a preveni acest lucru, trebuie să adăugați toate fișierele principale pentru a afișa diferitele componente ale paginii:

• header.php – este responsabil pentru antetul site-ului;
• sidebar.php – coloane laterale;
• footer.php – subsolul resursei (partea inferioară);
• comments.php și comments-popup.php – comentarii.

După generarea fiecăruia dintre aceste fișiere, pentru ca site-ul să înceapă să le afișeze, trebuie să introduceți date despre ele fisierul principalșablon index.php. Pentru a face acest lucru, specificați etichete în index.php care duc la fișierele numite. De exemplu:

• pentru a adăuga un fișier antet site (header.php) adăugați o etichetă

  get_header() etichetă tamplate;

• Pentru subsol este același, dar în loc de antet, specificați subsol etc.

Un exemplu de includere a unuia dintre fișierele șablon în index.php ar arăta astfel: . Va trebui să căutați fiecare dintre fișierele șablon cheie specificate pentru informații separate. Găsiți manuale pentru fiecare dintre fișiere, precum și mostre, astfel încât să înțelegeți toate funcțiile incluse în șabloane.

Selectarea funcționalității șablonului

În timp, te vei confrunta cu o dilemă - ce tip de șablon să alegi. Motorul vă oferă de ales. Fie puteți alege un șablon cu o ierarhie de șabloane conectată, fie un aspect cu etichete condiționate.

Prima variantă a fost deja luată în considerare. Toate fișierele șablon php– aceasta este Ierarhia șablonului. Adică, urmând regulile acestei ierarhii, generați treptat fișiere de aspect individuale. Astfel, veți crea un șablon cu drepturi depline dintr-un număr de componente PHP funcționale. Ierarhia în acest caz funcționează pe principiul încărcării la cerere. De exemplu, dacă aveți un fișier de categorii (category.php) și utilizatorul îl solicită, atunci această componentă specială a site-ului va fi încărcată în browser. Dacă nu este acolo, atunci va fi încărcat fişier cheieșablon index.php.

În acest fel, puteți modifica aspectul părților individuale ale site-ului folosind principiul Ierarhiei șabloane. Fiecare pagină are propriul său ID specific. Adăugați fișierul categorie-6.php în directorul de teme și când solicitați o categorie cu ID egal cu 6, acest design se va deschide. Dacă nu este acolo, atunci setările vor rămâne standard - index.php se va extinde.

Uneori, principiul Ierarhiei șablonului nu este suficient pentru a asigura cea mai confortabilă afișare a unui șablon. În acest caz, programatorii recurg la utilizarea celui de-al doilea principiu - introduc etichete condiționate. Aceste etichete verifică un site pentru a vedea dacă sunt îndeplinite anumite condiții și, dacă acele condiții nu sunt îndeplinite, schimbă modul în care arată. Adică, aceste etichete funcționează pe principiul dacă/altfel. În acest fel, nu va trebui să adăugați o mare de fișiere php cu numărul fiecărei categorii, dar veți putea specifica condițiile pentru fiecare ID o dată.

Cum se creează un aspect PSD în WordPress

Unii oameni le place să creeze mai întâi un aspect al viitorului design folosind diverse programe și abia apoi să îl transfere într-un anumit motor. Acest lucru este cu adevărat convenabil, deoarece unele aplicații vă permit să generați un design excelent fără nicio abilități. Dacă aveți deja un fișier psd și doriți să îl configurați pentru motorul WordPress fără a utiliza cod, atunci puteți folosi ajutorul unuia dintre serviciile populare.

Vă rugăm să rețineți că aceasta serviciu cu plată, așa că șablonul va fi doar jumătate al tău. Comandă un astfel de serviciu doar ca ultimă soluție, dacă aspectul ți se pare bun, dar nu mai ai puterea să îl amenajezi. Există mulți programatori care sunt gata să transfere PSD pe WordPress la un preț mic și literalmente peste noapte.

PSD este un fișier din aplicația Photoshop. Este ca imagine grafică designul tău. Pentru a o inventa, trebuie editor de text adăugați markup html. Treptat, veți schimba fiecare dintre punctele acestui marcaj, obținând rezultatul final afișat pe aspect. Indicați imediat centrarea șablonului dvs., precum și dimensiunile diferitelor părți ale acestuia.

Următorul pas este să adăugați imagini de fundal. De asemenea, le puteți face singur folosind aceeași aplicație Photoshop. Cea mai ușoară opțiune este de a crea imagini de fundal în gradient. Apoi, începeți să creați un logo. Rezolvați treptat toate întrebările care apar - ajustați antetul site-ului, subsolul, bara laterală și toate părțile sale, conform aspectului realizat. Nu uitați să adăugați fișiere șablon importante în directorul de șabloane, astfel încât site-ul să se încarce conform cerințelor dvs.

Numai în acest fel, învățând treptat elementele de bază ale diferitelor limbaje de programare, puteți învăța cum să configurați un site web pe cont propriu. Nimeni nu spune că vei reuși azi sau mâine. Este posibil să vă dureze luni pentru a înțelege toate caracteristicile procesului de aspect. Dar nu vă faceți griji - pentru unii durează ani. Acum cunoașteți procedura aproximativă pentru crearea unui șablon de la zero, precum și transferul aspectului PSD într-o temă gata făcută pentru o resursă de Internet folosind motorul WordPress.

Dacă citiți acest articol, sunt șanse să aveți un design de site foarte frumos realizat, probabil în Adobe Photoshop și salvat în format PSD, JPG, PDF, AI sau PNG. Acum doriți să convertiți acest fișier imagine într-o temă WordPress, astfel încât să îl puteți aplica pe site-ul sau blogul dvs. nou creat. S-ar putea să-ți dorești și tu Convertor PSD în WordPress -Dar dacă ai putea face singur această transformare și asta gratuit!

Mulți oameni care se pricep la design grafic ajung în acest punct de a converti PSD în teme WordPress. Și se simt blocați! Dar nu e vina lor. Crearea unui site web nu necesită doar capacitatea de a produce un design grozav, dar are nevoie și de anumite abilități de programare. Trebuie să fii un expert în cel puțin HTML, CSS, JavaScript, JQuery și Programare PHP pentru a vă transforma fișierul PSD într-o pagină web. Problema este că majoritatea oamenilor sunt fie un bun designer, fie un bun programator!

Cu toate acestea, nu vă faceți griji. Nu este chiar atât de dificil să convertiți PSD în tema WordPress. Tot ce trebuie să știi sunt pașii potriviți de urmat. În acest articol vă voi spune același lucru! Să începem să învățăm.

Ce este un fișier PSD?

Cei care nu stiu PSD înseamnă Document Photoshop. Acesta este formatul de fișier în care Adobe Photoshop salvează fișierele executabile. Puteți deschide fișiere PSD în Photoshop și puteți face modificări suplimentare în design după cum doriți. Astfel, fișierele PSD sunt uneori numite deschide fișiere (referindu-se la faptul că aceste fișiere pot fi editate).

Dacă doriți să faceți designul site-ului web de vis, atunci probabil că veți alege Photoshop pentru a-l materializa. Photoshop este, fără îndoială, cel mai bun și mai popular instrument de design grafic.

Ce este WordPress?

WordPress este în esență o platformă de blogging gratuită. Este deschis cod sursă programul a permis chiar și non-programatorilor să-și creeze cu ușurință site-urile sau blogurile. WordPress este fiabil și scalabil și este scris în limbaj PHP.

Designul site-ului web bazat pe WordPress se numește subiect(și uneori, eşantion).

Convertiți PSD în temă WordPress

Pasul 1: Tăiați fișierul PSD

Odată ce fișierul PSD este gata, primul lucru pe care trebuie să-l faceți este să îl împărțiți în bucăți. Pentru ce? Ei bine, pentru că o imagine va avea dimensiuni mari și va dura mai mult pentru încărcare. În plus, va trebui să asociați diferite comportamente cu diferite segmente ale imaginii. Așa că trebuie să o tăiați.

Dar asta nu înseamnă că poți decupa o imagine la întâmplare. Trebuie să faci lucrurile într-un mod logic. De exemplu, antetul poate deveni dintr-o singură bucată, subsolul ar trebui să fie separat... apoi puteți tăia fundalul, butonul și meniul etc.

Adobe Photoshop vă permite să utilizați straturi. Are o facilitate încorporată pentru a tăia PSD și a salva segmentele rezultate ca fișiere imagine separate. Puteți salva aceste imagini în formate JPG sau PNG. Dacă aveți nevoie de transparență pentru a funcționa în oricare dintre aceste segmente, atunci trebuie să o salvați ca PNG, deoarece JPG nu acceptă transparență.

Când tăiați o imagine, trebuie să fiți precis. Chiar și o singură eroare de pixel poate face două părți inutilizabile pentru o replică.

În timp ce tăiați un PSD cu scopul de a-l transforma într-o temă WordPress, trebuie să înțelegeți că CSS este destul de puternic în zilele noastre și poate crea o serie de elemente cu doar câteva linii de cod. De exemplu, puteți crea fundaluri de culoare solidă, fundaluri gradiente, butoane diferite tipuri, linii, săgeți și caractere speciale, numai cu folosind CSS. În acest fel, nu trebuie să salvați aceste lucruri ca imagini. Mai puține imagini înseamnă că site-ul dvs. se va încărca mai repede.

Următorul videoclip YouTube arată exact cum să tăiați un fișier PSD și să îl salvați în diferite imagini:

Bine, acum că aveți diferitele elemente vizuale ale designului site-ului dvs., este timpul să treceți la pasul următor.

Pasul 2: Creați fișiere HTML și CSS

Acum începe partea principală de codificare a procesului de conversie a PSD într-un site web. Practic, trebuie să creați o pagină web și să asamblați toate imaginile tăiate astfel încât să arate exact ca PSD-ul dvs.

Mai întâi trebuie să creați un fișier HTML. Îi poți numi cum vrei, dar prin convenție să-i spunem index.htm.În acest fișier, va trebui să scrieți cod HTML sau XHTML pentru a afișa diferitele părți ale imaginii din PSD. Pentru a crea un aspect de fundație, puteți utiliza elemente DIV. Elementele DIV sunt foarte versatile. Puteți plasa elementele DIV una lângă alta, suprapuse, una peste alta. Puteți alinia centrul elementului DIV la stânga și la dreapta și, de asemenea, le puteți poziționa foarte specific la anumite coordonate de pe pagina web.

În aceste elemente DIV puteți apela imaginile salvate și le puteți afișa ca atare sau ca fundal în DIV.

După ce ați finalizat acest aspect de bază al paginii dvs. web, ar trebui stilizează-l pentru a-l face la fel ca PSD-ul tău. Pentru stil, trebuie să utilizați regulile pentru foile de stil în cascadă (CSS). Cu aceste reguli puteți utiliza diferite stiluri de font, dimensiuni, culori, umbră text, scalare de gri a imaginii, chenare etc.

Pentru a scrie reguli de stil CSS, trebuie să creați un alt fișier numit stiluri.cssși apoi apelați acest fișier CSS la fișier index.htm. Stiluri prezente în stiluri.css se va aplica diferitelor elemente din fișierele dvs. HTML.

Bine, așteaptă! Dacă nu știți nimic despre codarea HTML sau CSS, nu vă faceți griji! Acestea sunt limbaje de scripting foarte simple și le puteți învăța cu ușurință online. Mai jos sunt câteva dintre resursele online în care puteți învăța CSS și HTML:

Tutoriale HTML

1. Tutorial HTML W3Schools
2. TutorialsPoint HTML Tutorial
3. HTML.net
4. Câine HTML

Tutoriale CSS

1. Tutorial CSS
2. Tutorial CSS W3Schools
3. TutsPlus
4. Bazele CSS

Pasul 3: Spargeți fișierul HTML în fișierele cu teme WordPress

În acest moment al procesului de conversie a PSD în tema WordPress, veți avea un fișier HTML (index.htm)și un fișier CSS (stiluri.css).În al treilea pas, va trebui să împărțiți fișierul HTML în funcție de Tema structurii WordPress. Confuz? Ei bine, WordPress are un set predefinit de fișiere care sunt chemate împreună pentru a crea o pagină web. De exemplu, atunci când afișează o postare, WordPress necesită conținutul unui fișier antet, un fișier post, un fișier cu bară laterală și un fișier subsol, printre altele. Dar aveți tot codul într-un singur fișier - index.htm. Deci va trebui să distribuiți codul index.htmîn diferite fișiere WP. Practic este o treabă de tăiere și lipire! Iată o listă cu câteva dintre fișierele de teme importante pentru WordPress:

• arhiva.php
• categorie.php
• comentarii.php
• footer.php
• header.php
• index.php
• pagina.php
• căutare.php
• sidebar.php
• singur.php
• stil.css
• 404.php

Pentru a crea o temă de bază WordPress, ați dori să creați cel puțin header.php, footer.php, sidebar.php, singur.phpŞi index.php.

Pur și simplu creați aceste fișiere PHP în orice editor de text pentru notepad și copiați codul corespunzător din index.htm la aceste fișiere. Va intra în codul pentru a crea partea antet header.php, nota de subsol la care va merge codul footer.php... așa mai departe și așa mai departe.

Dacă nu sunteți foarte familiarizat cu PHP, este posibil să aveți dificultăți la crearea corectă a acestor fișiere. Există câteva lecții online foarte bune și gratuite pentru a învăța PHP. W3Schools și PHP.net oferă ajutor PHP ușor de înțeles. Puteți parcurge aceste tutoriale pentru a vă face o idee despre PHP.

Urmând video YouTube vă va ajuta să înțelegeți cum să configurați o „temă simplă WordPress” (aceasta înseamnă, practic, o temă WodPress goală.

Pasul 4: Adăugați funcții și etichete WordPress

Acum este timpul să convertiți fișiere PHP simple în fișiere cu teme WordPress. Pentru a face acest lucru, va trebui să adăugați etichete WordPress în fișiere. Dar poți să întrebi Ce sunt mai exact etichetele WordPress?

După cum am spus mai devreme, WordPress este o platformă excelentă și de încredere. Vă oferă o cantitate imensă de funcții încorporate pe care le puteți apela cu ușurință și finaliza lucrurile.

Să ne uităm la un exemplu pentru a înțelege mai bine. Pe pagina de start (index.php), puteți afișa o listă de mesaje recente. Această listă ar trebui să schimbe automat modul și când faci o nouă postare. Îți poți scrie pe al tău Funcții PHP pentru a prelua datele de e-mail din baza de date și a le afișa pe pagina principală. Dar creatorii WordPress ți-au făcut viața mai ușoară! Nu va trebui să scrieți propriile funcții detaliate. Doar folosiți wp_get_recent_posts($args, $output) de la WordPress și vedeți afișată o listă de postări recente!

WordPress are o documentație online cuprinzătoare care vă oferă informații despre toate funcțiile și alte obiecte disponibile în WordPress. Documentația conține și multe exemple și, prin urmare, este foarte ușor de înțeles. Urmați linkurile de mai jos pentru a accesa această documentație:

• Etichete de șabloane WordPress
• Link cu funcțiile WordPress

Odată ce aceste fișiere cu teme sunt gata, ar trebui să le plasați într-un folder care ar trebui să fie același cu numele noii teme. Acest folder poate avea și alte foldere de salvat fișiere CSS, fișiere JavaScript și fișiere imagine.

De asemenea, puteți include imagini în fișierul numit screenshot.jpg sau screenshot.png. Acest fișier va fi afișat ca o imagine în miniatură a temei dvs. Este ușor să înveți cum să faci o captură de ecran.

O listă de fișiere dintr-o temă tipică WordPress ar putea arăta astfel:

Trebuie să descărcați folderul cu tema din folder / conținut WP / teme Instalări WordPress. De exemplu, dacă numiți tema Minerva - Atunci fișierele cu tema ar trebui să fie în / Conținut WP / teme / Minerva

După ce ați încărcat folderul cu tema, accesați tabloul de bord WordPress și apoi accesați Aspect > Teme. Aici, veți fi bucuroși să vedeți propria dvs. temă nouă dezvoltată printre temele disponibile pentru activare. Doar selectați o temă și activați-o.

Aruncă o privire la următorul videoclip pentru a vedea procesul ulterioar:

Pasul 5: adăugați mai multe funcționalități, cum ar fi funcțiile de căutare și de utilizator

Tema dvs. WordPress este deja finalizată și funcționează. Călătoria de la tema PSD la WordPress s-a încheiat. Dar încă mai poți adăuga funcţionalitate la subiectul dvs.

De exemplu, puteți crea căutare.php un fișier cu cod care afișează rezultatele căutării de pe site-ul dvs.

De asemenea, vă puteți crea propriile funcții PHP și le puteți utiliza în diferite alte fișiere PHP. Trebuie să creați un fișier funcții.php pentru a păstra funcțiile personalizate într-un singur loc.

Pentru a face față erorilor 404 (pagina nu a fost găsită), puteți crea un fișier 404.php. WordPress va afișa conținutul acestui fișier ori de câte ori cineva încearcă să acceseze adresa URL a site-ului dvs. care nu există.

De asemenea, puteți adăuga unele funcționalități JavaScript. JavaScript este cel mai utilizat limbaj de scripting la nivelul clientului. Puteți scrie funcții JavaScript în fișiere .jsși apelați aceste funcții în fișierele dvs. PHP. De exemplu, validarea formularelor este ceva care se face de obicei folosind JavaScript. Dacă un utilizator încearcă să găsească ceva pe site-ul ei fără a introduce cuvinte cheie în câmpul de căutare, atunci JavaScript îi spune utilizatorului că trebuie să introducă criteriile de căutare.

După acești pași, vă puteți crea cu ușurință propria temă WordPress. Acești pași vor converti fișierul PSD într-o temă funcțională WordPress. Cu toate acestea, unii oameni caută PSD gratuit pentru convertoare WordPress. Există multe companii care pretind că iau un fișier PSD și îl transformă într-o temă exactă. Dacă nu vrei să intri în bătaia de cap de a învăța programarea, poți pur și simplu să dai PSD-ul tău acestor companii. Dar, desigur, ei taxează pentru asta!

PSD gratuit pentru convertoare WordPress

am dat peste software Elemente de la DivineProjects. Puteți descărca acest program gratuit și vă va converti PSD într-o temă WordPress gata de utilizat, complet funcțională. Acest software funcționează ca un plugin Photoshop.

Sper că acest articol v-a fost de ajutor. Dacă aveți întrebări despre acest subiect, vă rugăm să nu ezitați să întrebați. Voi încerca tot posibilul să vă ajut. Vă mulțumim că folosiți TechWelkin.

Acest articol vă va arăta cum să creați cea mai simplă temă WordPress. Deși Codex oferă o documentație extinsă pe acest subiect, mi se pare un pic complex pentru un începător. Prin urmare, în acest „tutorial” vă voi spune principiile modului în care funcționează temele WordPress și vă voi arăta cum să adaptați un șablon HTML brut la acestea. În același timp, nu trebuie să cunoașteți PHP, dar este bine dacă cunoașteți Photoshop și CSS pentru a crea un design.

1. Blog Frontend

Înainte de a începe, să aruncăm o privire la o temă standard WordPress și să înțelegem în ce constă. Să marchem elementele (antet, titlul postării, formular de căutare, navigare, subsol etc.).

Prima pagină standard ( index.php)

Single standard ( singur.php)

2. Aspecte Photoshop

Bazat pe aspect temă standard, dezvoltați machete Photoshop pentru blogul dvs. De exemplu, folosesc GlossyBlue, una dintre temele mele gratuite. Descărcați demo.zip pentru a vedea fișierul Photoshop finalizat.

3. HTML și CSS

Odată ce designul PSD este gata, creați un șablon HTML+CSS pentru fiecare pagină. Urmând pașii din acest tutorial puteți folosi fișierele mele HTML GlossyBlue din demo.zip. După despachetarea arhivei, veți vedea index.html, single.htmlŞi pagina.html. În continuare le voi folosi pentru a le transforma într-un șablon.

De ce să creați mai întâi HTML static? Acest lucru se datorează în principal faptului că va simplifica foarte mult procesul de dezvoltare. De obicei creez un fișier HTML pentru fiecare șablon, verific valabilitatea acestora (marcaj HTML și CSS) în toate browserele. După aceea, tot ce mai rămâne este să tăiați și să lipiți codul WordPress. Deci nu mai trebuie să vă faceți griji cu privire la erorile din HTML sau CSS.

4. Cum funcționează o temă WordPress?

Dacă mergeți la folderul de teme implicit ( wp-content/teme/implicit), veți vedea multe fișiere php (numite fișiere șablon) și un fișier stil.css. A forma Pagini WordPress utilizează de obicei mai multe fișiere șablon ( index.php , header.php, sidebar.php,Şi footer.php).

Mai multe detalii în Codex: „Arhitectura site-ului” și „Ierarhia șabloanelor”.

5. Fișiere șablon duplicat

Copiați folderul HTML din GlossyBlue în folder wp-conținut/teme. După aceea, mergeți la directorul de teme implicit, copiați comentarii.phpŞi searchform.phpîntr-un folder albastru lucios.

6. Stil.css

Accesați folderul tema implicit, deschideți fișierul stil.css. Copiați textul comentat la începutul fișierului și inserați-l în stil.css Teme GlossyBlue. Dacă doriți, puteți modifica titlul și informațiile despre autor.

7. Separarea fișierelor

Acum trebuie să ne dăm seama unde să împărțim fișierele HTML în părți: header.php , sidebar.php și footer.php. Captura de ecran de mai jos arată o versiune simplificată a fișierului meu index, precum și principiul împărțirii acestuia.

8.Header.php

Deschide index.html. Trebuie să tăiați secțiunea de sus până unde se termină, să o lipiți într-un fișier php nou și să salvați ca header.php.
Accesați folderul de teme implicit, deschideți un nou header.php. Copiați și înlocuiți etichetele acolo unde codul php o cere: titlu, link, foi de stil, h1 și div class=description.

Meniul de navigare (wp_list_pages) Înlocuiți etichetele li V ul id=nav pe ;

9. Sidebar.php

Întoarce-te la index.html, tăiați codul de unde începe form id=form de căutareși până când eticheta se închide div id=bara laterală, puneți-l într-un fișier php nou și salvați ca sidebar.php.

• Înlocui form id=form de căutare cu tot conținutul pe .
• Înlocuiți etichetele li categorii prin
• Înlocuiți etichetele li arhive pe

10. Footer.php

Întoarce-te la index.html. Extrage codul de acolo div id=footer inclusiv cu tag-ul div id=footer și până la final /html apoi pune-l într-unul nou footer.php.

Postări recente Aici am folosit query_post pentru a afișa 5 ultimele intrări pe blog.

„Ultimele comentarii”„Ultimele comentarii” generate de plugin (inclus în folderul cu teme)

11. Index.php

Acum în tine index.html ar trebui doar să rămână div id=conținut. Salvați fișierul ca index.php. Introduceți rândurile: get_header, get_sidebar, Și get_footerîn ordinea în care apar în model.

12. Analizarea ciclului

Bucla afișează postări de blog secvenţial, în funcție de setările dvs. Captura de ecran de mai jos ilustrează cum funcționează. Inițial, bucla verifică prezența înregistrărilor și dacă nu găsește niciuna, afișează un mesaj "Nu a fost găsit".

13. Copierea unui ciclu

Accesați directorul de teme implicit, deschideți index.php. Copiați ciclul din cel standard index.phpîn propriul tău – între div id=conținut../div. După aceea, înlocuiți textul static cu etichete de șablon WordPress: data postării, titlul, categoria, comentariile, linkul următor și anterior.

14. Previzualizarea temei

Felicitări! Ați creat partea publică (partea principală a șablonului). Acum accesați panoul administrativ, accesați fila Proiecta, ar trebui să vedeți tema GlossyBlue. Activați-l și accesați partea publică pentru a vedea rezultatul în acțiune.

15. Single.php

Este timpul să creați un șablon singur.php. Dacă doriți, puteți repeta pașii, transferând codul din tema standard. Dar mi se pare mai ușor să-l folosesc pe cel pe care tocmai l-am creat index.php, salvându-l ca singur.php. Deschide singur.php din tema standard și copiați etichetele șablonului în locurile necesare. Apoi, conectează-te comentarii_template. Următoarea captură de ecran arată modificările pe care le-am făcut:

16.Pagina.php

Acum nou singur.php salvează cu nume pagina.php. Eliminați data intrării, formularul de comentarii, linkurile următoare/anterioare. Asta e, asta e tot - șablonul tău pagina.php gata .

17. Eliminarea fișierelor HTML

Eliminați toate fișierele HTML din folder albastru lucios(nu vom mai avea nevoie de ele). Din punct de vedere tehnic, acest lucru este suficient pentru a crea o temă de bază WordPress. Poate ați observat că tema standard are mai multe fișiere PHP. Ei bine, de fapt, nu prea ai nevoie de ele dacă vrei o temă simplă. De exemplu, dacă căutare.php sau 404.php nu va fi în folderul cu teme, WordPress va folosi automat index.php pentru a afișa pagina. Citiți Ierarhia șabloanelor pentru mai multe detalii.

18. Șablon de pagină WordPress

Acum, pentru exemplul final, vă voi arăta cum să utilizați șablon de pagină pentru a crea o pagină de arhivă care va conține o listă cu toate postările de pe blogul dvs. (utilă pentru o hartă a site-ului). Copie arhive.php din folderul cu tema standard. Eliminați codul inutil și obțineți ceva de genul acesta: