WordPress.org (Română)

Limbi: বাংলা • Engleză • Español • 日本語 한국어 • Português do Brasil • Русский • 中文 (简体) •中文 (繁體) • (Adăugați limba dvs.)

Acest articol este despre dezvoltarea temelor WordPress. Dacă doriți să aflați mai multe despre cum să instalați și să utilizați teme, consultați Utilizarea temelor. Acest subiect diferă de Utilizarea temelor deoarece discută aspectele tehnice ale scrierii codului pentru a vă crea propriile teme, mai degrabă decât modul de activare a temelor sau de unde să obțineți teme noi.

De ce temele WordPress

Temele WordPress sunt fișiere care funcționează împreună pentru a crea designul și funcționalitatea unui site WordPress. Fiecare temă poate fi diferită, oferind multe opțiuni proprietarilor de site-uri pentru a-și schimba instantaneu aspectul site-ului web.

Este posibil să doriți să dezvoltați teme WordPress pentru propria dvs. utilizare, pentru un proiect de client sau să îl trimiteți în directorul temelor WordPress. De ce altceva ar trebui să creați o temă WordPress?

  • Pentru a crea un aspect unic pentru site-ul dvs. WordPress.
  • Pentru a profita de șabloane, etichete de șabloane și bucla WordPress pentru a genera rezultate și aspecte diferite ale site-ului web.
  • Pentru a oferi șabloane alternative pentru anumite funcții ale site-ului, cum ar fi ca pagini de categorii și pagini cu rezultate ale căutării.
  • Pentru a comuta rapid între două aspecte ale site-ului sau pentru a profita de un comutator de temă sau stil pentru a permite proprietarilor de site-uri să schimbe aspectul site-ului dvs.

O temă WordPress are și multe avantaje.

  • Separează stilurile de prezentare și fișierele șablon de fișierele de sistem, astfel încât site-ul să se actualizeze fără modificări drastice la prezentarea vizuală a site-ul.
  • Permite personalizarea funcționalității site-ului unice temei respective.
  • Permite modificări rapide ale designului vizual și aspectului unui site WordPress.
  • Îndepărtează nevoia ca un proprietar tipic de site WordPress să trebuiască să învețe CSS, HTML și PHP pentru a avea un site web excelent.

De ce ar trebui să-ți construiești propria temă WordPress? Aceasta este adevărata întrebare.

  • Este o oportunitate de a afla mai multe despre CSS, HTML și PHP.
  • Este o oportunitate de a vă pune expertiza în CSS, HTML și PHP funcționează.
  • Este creativ.
  • Este distractiv (de cele mai multe ori).
  • Dacă îl eliberați publicului, vă puteți simți bine că ați distribuit și ați dat ceva înapoi Comunității WordPress (bine, drepturi de lăudare)

Standarde de dezvoltare a temelor

Temele WordPress ar trebui să fie codificat utilizând următoarele standarde:

  • Utilizați PHP bine structurat, fără erori și HTML valid. Consultați Standardele de codare WordPress.
  • Utilizați CSS curat și valid. Consultați codarea CSS Standarde.
  • Respectați instrucțiunile de proiectare din proiectarea și aspectul site-ului.

Anatomia unei teme

Temele WordPress sunt disponibile în subdirectoarele din directorul temelor WordPress. (wp-content / themes / implicit) care nu poate fi mutat direct folosind fișierul wp-config.php. Subdirectorul temei conține toate stilurile temei. fișiere eet, fișiere șablon și fișier funcțional opțional (functions.php), fișiere JavaScript și imagini. De exemplu, o temă numită „test” ar rezida în directorul wp-content / themes / test /. Evitați să folosiți numere pentru numele temei, deoarece acest lucru împiedică afișarea acestuia în lista de teme disponibile.

WordPress include o temă implicită în fiecare nouă instalare. Examinați cu atenție fișierele din tema implicită pentru a vă face o idee mai bună despre cum să vă construiți propriile fișiere tematice.

Pentru un ghid vizual, consultați acest infografic pe tema WordPress Anatomy.

WordPress Temele constau de obicei din trei tipuri principale de fișiere, pe lângă imagini și fișiere JavaScript.

  1. Foaia de stil numită style.css, care controlează prezentarea (designul vizual și aspectul) paginilor site-ului web.
  2. Fișierele șablon WordPress care controlează modul în care paginile site-ului generează informațiile din baza de date WordPress pentru a fi afișate pe site.
  3. Fișierul cu funcții opționale (functions.php) ca parte a fișierelor temei WordPress.

Să le privim în mod individual.

Teme pentru copii

Cea mai simplă temă posibilă este o temă pentru copii care include doar un stil.css fișier, plus orice imagini. Acest lucru este posibil deoarece este un copil al unei alte teme care acționează ca părinte.

Pentru un ghid detaliat al temelor copil, consultați Teme copil.

Tema Foaia de stil

În plus față de informațiile de stil CSS pentru tema dvs., style.css oferă detalii despre temă sub formă de comentarii. Foaia de stil trebuie să ofere detalii despre temă sub formă de comentarii. Nu există două teme li se permite să aibă aceleași detalii listate în anteturile de comentarii, deoarece acest lucru va duce la probleme în dialogul de selecție a temei. Dacă vă creați propria temă copiind una existentă, asigurați-vă că modificați mai întâi aceste informații.

Următorul este un exemplu al primelor câteva linii ale foii de stil, denumite antetul foii de stil, pentru tema „Douăzeci și treisprezece”:

NB: Numele folosit pentru autor este a sugerat să fie același cu numele de utilizator wordpress.org al autorului temei, deși poate fi și numele real al autorului. Alegerea este autorul temei.

Rețineți lista etichetelor utilizate pentru a descrie tema. Acestea permit utilizatorului să vă găsească tema folosind filtrul de etichete. Puteți găsi o listă completă în manualul de revizuire a temelor. .

Liniile de antet de comentarii din style.css sunt necesare pentru ca WordPress să poată identifica tema și să o afișeze în panoul de administrare sub Design > Teme ca o opțiune de temă disponibilă împreună cu orice alte teme instalate.

Instrucțiuni pentru foaia de stil

  • Respectați standardele de codare CSS atunci când creați CSS.
  • Utilizați CSS valid când posibil. Ca excepție, utilizați prefixe specifice furnizorului pentru a profita de caracteristicile CSS3.
  • Minimizați hacks CSS. Excepția evidentă este suportul specific browserelor, de obicei versiunile IE. Dacă este posibil, separați hacks CSS în secțiuni separate sau fișiere separate.
  • Toate elementele HTML posibile ar trebui să fie stilizate de tema dvs. (cu excepția cazului în care este o temă secundară), atât în conținutul postării / paginii, cât și în co conținut de menționare.
    • Tabelele, subtitrările, imaginile, listele, ghilimele de blocare și așa mai departe.
  • Este foarte recomandat să adăugați stiluri de tipărire.
    • Puteți include o foaie de stil de imprimare cu media = „print” sau adăugați într-un bloc de imprimare în foaia dvs. de stil principală.

Fișier funcții

O temă poate utiliza opțional un fișier de funcții, care se află în subdirectorul temei și se numește functions.php. Acest fișier acționează practic ca un plugin și, dacă este prezent în tema pe care o utilizați, este încărcat automat în timpul inițializării WordPress (atât pentru paginile de administrare, cât și pentru paginile externe). Utilizări sugerate pentru acest fișier:

  • Stoarceți foi de stil și scripturi de temă. Consultați wp_enqueue_scripts.
  • Activați caracteristicile temei, cum ar fi bare laterale, meniuri de navigare, afișare miniaturi, postare formate, anteturi personalizate, fundaluri personalizate și altele. temă.
  • Configurați un meniu de opțiuni, oferind proprietarilor de site-uri opțiuni pentru culori, stiluri și alte aspecte ale temei dvs.

Tema implicită WordPress conține o funcție. fișier php care definește multe dintre aceste caracteristici, deci vă recomandăm să îl folosiți ca model. Deoarece functions.php funcționează practic ca un plugin, lista Function_Reference este cel mai bun loc pentru a afla mai multe informații despre ce puteți face cu acest fișier.

Notă pentru a decide când să adăugați funcții la functions.php sau la un plugin specific: este posibil să aveți nevoie de aceeași funcție pentru a fi disponibilă pentru mai multe teme părinte. Dacă acesta este cazul, funcția ar trebui creată într-un plugin în loc de un functions.php pentru tema specifică. Aceasta poate include etichete șablon și alte funcții specifice. Funcțiile conținute în pluginuri vor fi văzute de toate temele.

Fișiere șablon

Șabloanele sunt fișiere sursă PHP utilizate pentru a genera paginile solicitate de vizitatori și sunt afișate ca HTML. Fișierele șablon sunt formate din etichete șablon HTML, PHP și WordPress.

Să vedem diversele șabloane care pot fi definite ca parte a unei Teme.

WordPress vă permite să definiți șabloane separate pentru diferitele aspecte ale site-ului dvs. Nu este Cu toate acestea, este esențial să aveți toate aceste fișiere de șabloane diferite pentru ca site-ul dvs. să funcționeze pe deplin. Șabloanele sunt alese și generate în funcție de ierarhia de șabloane, în funcție de șabloanele disponibile într-o anumită temă.

Ca temă dezvoltator, puteți alege cantitatea de personalizare pe care doriți să o implementați folosind șabloane. De exemplu, ca caz extrem, puteți utiliza un singur fișier șablon, numit index.php ca șablon pentru toate paginile generate și afișate de site. o utilizare mai obișnuită este ca diferitele fișiere șablon să genereze rezultate diferite, pentru a permite personalizarea maximă.

Lista fișierelor șablon

Iată lista fișierelor tematice recunoscute de WordPress. Tema dvs. poate conține orice alte foi de stil, imagini sau fișiere. Rețineți că următoarele au o semnificație specială pentru WordPress – consultați Ierarhia șabloanelor pentru mai multe informații.

style.css Foaia principală de stil. Aceasta trebuie să fie inclusă cu tema dvs. și trebuie să conțină antetul informațiilor pentru tema dvs. rtl.css Foaia de stil rtl. Acest lucru va fi inclus automat dacă direcția de text a site-ului web este de la dreapta la stânga. Aceasta poate fi generată folosind pluginul RTLer. Index.php Șablonul principal. Dacă Tema dvs. oferă propriile șabloane, index.php trebuie să fie prezent. comments.php Șablonul pentru comentarii. front-page.php Șablonul pentru prima pagină. home.php Șablonul pentru pagina de pornire, care este prima pagină în mod implicit.Dacă utilizați o pagină frontală statică, acesta este șablonul pentru pagina cu cele mai recente postări. single.php Șablonul single post. Se folosește atunci când se solicită o singură postare. Pentru acest și toate celelalte șabloane de interogare, index.php este utilizat dacă șablonul de interogare nu este prezent. single- {post-type} .php Șablonul single post utilizat atunci când este interogată o singură postare dintr-un tip de postare personalizată. De exemplu, single-book.php ar fi utilizat pentru afișarea postărilor individuale din tipul de postare personalizat numit „carte”. index.php este utilizat dacă șablonul de interogare pentru tipul de post personalizat nu este prezent. page.php Șablonul paginii. Folosit atunci când se solicită o pagină individuală. category.php Șablonul categoriei. Se folosește atunci când este interogată o categorie. tag.php Șablonul de etichetă. Folosit atunci când este interogată o etichetă. taxonomy.php Termenul șablon. Se folosește atunci când este interogat un termen dintr-o taxonomie personalizată. author.php Șablonul autorului. Folosit atunci când este interogat un autor. date.php Șablonul de dată / oră. Se folosește când se solicită o dată sau o oră. An, lună, zi, oră, minut, secundă. archive.php Șablonul de arhivă. Se folosește atunci când se solicită o categorie, un autor sau o dată. Rețineți că acest șablon va fi suprascris de category.php, author.php și date.php pentru tipurile lor de interogare respective. search.php Șablonul rezultatelor căutării. Folosit atunci când se efectuează o căutare. attachment.php Șablon de atașament. Folosit la vizualizarea unui singur atașament. image.php Șablon de atașament imagine. Se utilizează la vizualizarea unui singur atașament de imagine. Dacă nu este prezent, va fi utilizat attachment.php. 404.php Șablonul 404 Not Found. Folosit atunci când WordPress nu poate găsi o postare sau o pagină care să se potrivească cu interogarea.

Aceste fișiere au o semnificație specială în ceea ce privește WordPress, deoarece sunt utilizate ca înlocuitor pentru index.php, atunci când sunt disponibile, conform Ierarhiei șabloanelor și când eticheta condițională corespunzătoare revine adevărată. De exemplu, dacă este afișată doar o singură postare, funcția is_single () returnează „true” și, dacă există un fișier single.php în Tema activă, acel șablon este utilizat pentru a genera pagina.

Șabloane de bază

Cel puțin, o temă WordPress constă din două fișiere:

  • style.css
  • index.php

Ambele fișiere intră în directorul Teme. Fișierul șablon index.php este foarte flexibil. Poate fi folosit pentru a include toate referințele la antet, bara laterală, subsol, conținut, categorii, arhive, căutare, eroare și orice altă pagină creată în WordPress.

Sau, poate fi împărțit în șablon modular fișiere, fiecare preluând o parte din volumul de lucru. Dacă nu furnizați alte fișiere șablon, WordPress poate avea fișiere sau funcții implicite pentru a-și îndeplini sarcinile. De exemplu, dacă nu furnizați un fișier șablon searchform.php, WordPress are o funcție implicită pentru a afișa formularul de căutare.

Fișierele tip șablon includ:

  • comentarii. php
  • comments-popup.php
  • footer.php
  • header.php
  • sidebar.php

Utilizând aceste fișiere șablon puteți introduce etichete șablon în fișierul principal index.php pentru a include aceste alte fișiere unde doriți să apară în pagina finală generată.

Iată un exemplu de include usage:

<?php get_sidebar(); ?><?php get_footer(); ?>

Fișierele implicite pentru unele funcții șablon pot fi depreciate sau nu sunt prezente și ar trebui să furnizați aceste fișiere în tema dvs. Începând cu versiunea 3.0, fișierele implicite depreciate se află în wp-includes/theme-compat. De exemplu, ar trebui să furnizați header.php pentru ca funcția get_header () să funcționeze în siguranță și comments.php pentru funcția comments_template ().

Pentru mai multe informații despre modul în care funcționează aceste diferite șabloane și despre cum să generați diferite informațiile din ele, citiți documentația Șabloane.

Șabloane de pagină personalizate

Fișierele care definesc fiecare șablon de pagină se găsesc în directorul Teme. Pentru a crea un nou șablon de pagină personalizat pentru o pagină, trebuie să creați un fișier. Să apelăm primul nostru șablon de pagină pentru pagina noastră snarfer.php. În partea de sus a fișierului snarfer.php, puneți următoarele:

<?php/*Template Name: Snarfer*/?>

Cele de mai sus codul definește acest fișier snarfer.php ca șablonul „Snarfer”. Bineînțeles, „Snarfer” poate fi înlocuit cu majoritatea textului pentru a schimba numele șablonului de pagină. Acest nume de șablon va apărea în Editorul de teme ca link pentru editare fișier.

Fișierul poate fi numit aproape orice cu o extensie .php (consultați numele de fișiere ale temelor rezervate pentru numele de fișiere pe care nu ar trebui să le utilizați; acestea sunt nume de fișiere speciale rezervate de WordPress pentru scopuri specifice).

Ceea ce urmează celor cinci linii de cod de mai sus depinde de dvs. Restul codului pe care îl scrieți va controla modul în care vor fi afișate paginile care folosesc șablonul de pagină Snarfer. Consultați Etichetele șablonului pentru o descriere a diferitelor funcții ale șablonului WordPress. Puteți utiliza mai convenabil să copiați un alt șablon (poate page.php sau index.php) pe snarfer.php și apoi adăugați cele cinci linii de cod de mai sus la începutul fișierului.În acest fel, va trebui să modificați doar codul HTML și PHP, în loc să le creați de la zero. Exemple sunt prezentate mai jos. După ce ați creat un șablon de pagină și l-ați plasat în directorul temei dvs., acesta va fi disponibil ca opțiune atunci când creați sau editați o pagină. (Notă: când creați sau editați o pagină, opțiunea Șablon de pagină nu apare decât dacă există cel puțin un șablon definit în modul de mai sus.)

Fișiere de șabloane bazate pe interogări

WordPress poate încărca șabloane diferite pentru diferite tipuri de interogare. Există două moduri de a face acest lucru: ca parte a ierarhiei de șabloane încorporate și prin utilizarea etichetelor condiționale în bucla unui fișier de șablon.

Pentru a utiliza ierarhia de șabloane, trebuie să furnizați fișierele de șabloane cu destinație specială, care va fi folosit automat pentru a suprascrie index.php. De exemplu, dacă Tema dvs. oferă un șablon numit category.php și se solicită o categorie, category.php va fi încărcat în loc de index.php. Dacă category.php nu este prezent, index.php este folosit ca de obicei.

Puteți obține și mai multe detalii în Ierarhia șabloanelor oferind se numește, de exemplu, categoria-6.php – acest fișier va fi folosit mai degrabă decât categoria.php atunci când se generează pagina pentru categoria al cărei număr de identificare este 6. (Puteți găsi numerele de identificare a categoriei în Gestionare > Categorii dacă sunteți conectat ca administrator al site-ului în WordPress versiunea 2.3 și mai jos. În WordPress 2.5, coloana ID a fost eliminată din panourile de administrare. Puteți localiza ID-ul categoriei făcând clic pe „Editați categoria” și căutând pe bara de adrese URL valoarea cat_ID. Va arăta „… categories.php? Action = edit & cat_ID = 3” unde „3” este id-ul categoriei). Pentru o privire mai detaliată a modului în care funcționează acest proces, consultați Șabloane de categorii.

Dacă Tema dvs. trebuie să aibă și mai mult control asupra fișierelor șablon utilizate decât ceea ce este furnizat în ierarhia șablonului, puteți utiliza Conditional Etichete. Eticheta condițională verifică în principiu dacă o anumită condiție este adevărată, în bucla WordPress și apoi puteți încărca un anumit șablon sau puteți pune un anumit text pe ecran, pe baza acelei condiții.

Pentru de exemplu, pentru a genera o foaie de stil distinctă într-o postare care se găsește numai într-o anumită categorie, codul ar putea arăta astfel:

Sau, utilizând o interogare, ar putea arăta astfel:

<?php$post = $wp_query->post;if ( in_category( "9" ) ) { get_template_part( "single2" );} else { get_template_part( "single1" );}?>

În ambele cazuri, acest exemplu de cod va face să fie utilizate șabloane diferite, în funcție de categoria postării particulare afișate. Condițiile de interogare nu sunt limitate la categorii, cu toate acestea, consultați articolul Etichete condiționale pentru a vedea toate opțiunile.

Definirea șabloanelor personalizate

Este posibil să utilizați sistemul de pluginuri WordPress pentru a defini șabloane suplimentare care sunt afișate pe baza propriilor criterii personalizate. Această caracteristică avansată poate fi realizată folosind cârligul de acțiune „template_include”. Mai multe informații despre crearea pluginurilor pot fi găsite în referința API-ului Plugin.

Inclusiv fișiere șablon

Pentru a încărca un alt șablon (altul decât antetul, bara laterală, subsolul, care au predefinit comenzile incluse, cum ar fi get_header ()) într-un șablon, puteți utiliza get_template_part (). Acest lucru face ca o temă să poată refolosi secțiuni de cod cu ușurință.

Referirea fișierelor dintr-un șablon

Când faceți referire la alte fișiere din aceeași temă, evitați URI-urile și căile de fișiere codificate în mod dur. În schimb, faceți referire la URI-urile și căile de fișiere cu bloginfo (): consultați Referirea fișierelor dintr-un șablon.

Rețineți că URI-urile utilizate în foaia de stil sunt relative la foaia de stil, nu la pagina care face referire la foaia de stil. De exemplu, dacă includeți o imagine / director în Tema dvs., trebuie să specificați doar acest director relativ în CSS, astfel:

h1 { background-image: url(images/my-background.jpg);}

Hooks API pentru plugin

Atunci când dezvoltați Teme, este bine să rețineți că Tema dvs. ar trebui să fie configurată astfel încât să poată funcționa bine cu orice plugin-uri WordPress pe care utilizatorii ar putea decide să le instaleze. Pluginurile adaugă funcționalitate la WordPress prin „Acțiune” Hooks „(consultați API-ul Plugin pentru mai multe informații).

Majoritatea Action Hooks se află în codul PHP de bază al WordPress, așa că Tema dvs. nu trebuie să aibă etichete speciale pentru ca acestea să funcționeze. Dar câteva acțiuni Cârligele trebuie să fie prezente în Tema dvs., pentru ca pluginurile să afișeze informații direct în antetul, subsolul, bara laterală sau în corpul paginii. Iată o listă cu etichetele speciale de șablon de acțiune pe care trebuie să le includeți:

wp_enqueue_scripts Folosit în fișierul funcțiilor temei. Folosit pentru a încărca scripturi și foi de stil externe. wp_head () Merge în capul < id = „8f07269a7d”> element al unei teme, în header.php. Exemplu de utilizare a pluginului: adăugați cod JavaScript. wp_footer () Merge în footer.php, chiar înainte de închidere < / body >. Exemplu de utilizare a pluginului: introduceți codul PHP care trebuie să ruleze după orice altceva, în partea de jos a subsolului.Foarte frecvent utilizat pentru a insera cod de statistici web, cum ar fi Google Analytics. wp_meta () Merge de obicei în < li > Meta < / li > secțiunea din meniul sau bara laterală a unei Teme; șablonul sidebar.php. Exemplu de utilizare a pluginului: includeți o reclamă rotativă sau un nor de etichete. Comment_form () Merge în comments.php direct înainte de fișier ” eticheta de închidere (< / div >). Exemplu de utilizare a pluginului: afișați o previzualizare a comentariului.

Pentru un exemplu de utilizare din lumea reală, veți găsi aceste cârlige de pluginuri incluse în șabloanele implicite ale temei.

API de personalizare a temei

Începând cu WordPress 3.4, un nou Funcția de personalizare a temelor este disponibilă în mod implicit pentru aproape toate temele WordPress. Pagina de administrare a personalizării temei este completată automat cu opțiuni pentru care o temă declară că este compatibilă cu add_theme_support () sau folosind API-ul Setări și permite administratorilor să vadă previzualizări non-permanente ale modificărilor pe care le fac în timp real.

Dezvoltatorii de teme și pluginuri interesați să adauge noi opțiuni la pagina de personalizare a temei unei teme ar trebui să vadă documentația din API-ul de personalizare a temei. Tutoriale suplimentare despre API-ul de personalizare a temelor sunt disponibile pe site-ul web Ottopress.com.

Date de încredere

Ar trebui să scăpați de conținutul generat dinamic din Tema dvs., în special de conținutul care este trimis către atribute HTML. După cum sa menționat în WordPress Coding Standards, textul care intră în atribute ar trebui să fie rulat prin esc_attr (), astfel încât sau ghilimelele duble nu încetează valoarea atributului și invalidează XHTML și provoacă o problemă de securitate. Locurile obișnuite de verificat sunt atributele de titlu, alt și valoare.

Există puține etichete speciale de șablon pentru cazurile obișnuite unde Este necesară o ieșire sigură. Un astfel de caz implică trimiterea unui titlu de postare la un atribut title utilizând the_title_attribute () în loc de the_title () pentru a evita o vulnerabilitate de securitate. Iată un exemplu de scăpare corectă pentru atributul de titlu al unui link de titlu al postării atunci când se utilizează text traductibil:

<a href="<?php the_permalink(); ?>" title="<?php sprintf( __( "Permanent Link to %s", "theme-name" ), the_title_attribute( "echo=0" ) ); ?>"><?php the_title(); ?></a>

Suport pentru traducere / I18n

Pentru a asigura o tranziție lină pentru localizarea limbii, utilizați funcțiile i18n bazate pe gettext WordPress pentru a înfășura tot textul traductibil în fișierele șablon. Acest lucru facilitează conectarea fișierelor de traducere și traducerea etichetelor, titlurilor și a altor text șablon în limba curentă a site-ului. Vedeți mai multe la WordPress Localization și I18n pentru dezvoltatorii WordPress.

Clase de temă

Implementați următoarele etichete șablon pentru a adăuga atribute de clasă generate de WordPress la elementele de corp, postare și comentariu. Pentru clasele de postări, aplicați numai elementelor din Buclă.

  • body_class ()
  • post_class ()
  • comment_class ()

Listă de verificare a fișierelor șablon

Când dezvoltați o temă, verificați fișierele șablon cu următoarele standarde de fișiere șablon.

Cap document (header.php)

  • Utilizați DOCTYPE adecvat.
  • Eticheta de deschidere < html > trebuie să includă language_attributes ( ).
  • Elementul de set de caractere < meta > trebuie plasat înainte de orice, inclusiv < title > element.
  • Utilizați bloginfo () pentru a seta < meta > set de caractere și elemente de descriere.
  • Utilizați wp_title () pentru a seta < title > element. Vedeți de ce.
  • Utilizați legături automate de feed pentru a adăuga linkuri de feed.
  • Adăugați un apel la wp_head () înainte de închidere < / head > etichetă. Pluginurile folosesc acest cârlig de acțiune pentru a adăuga propriile scripturi, foi de stil și alte funcționalități.
  • Nu legați foile de stil ale temei în șablonul Antet. Folosiți în schimb cârligul de acțiune wp_enqueue_scripts într-o funcție tematică.

Iată un exemplu de zonă de cap compatibilă HTML5 corect formatată:

Meniuri de navigare (header.php )

  • Navigarea principală a temei ar trebui să accepte un meniu personalizat cu wp_nav_menu ().
    • Meniurile ar trebui să accepte titluri de link-uri lungi și o cantitate mare de articole din listă. Aceste elemente nu trebuie să întrerupă designul sau aspectul.
    • Elementele din submeniu trebuie să fie afișate corect. Dacă este posibil, acceptați stilurile de meniu drop-down pentru elementele din submeniu. Meniuri derulante care permit afișarea adâncimii meniului în loc să arate doar nivelul superior.

  • Tema ar trebui să fie widgetizată cât mai complet posibil. Orice zonă din aspect care funcționează ca un widget (nor de etichete, blogroll, listă de categorii) sau ar putea accepta widget-uri (bara laterală) ar trebui să permită widget-uri.
  • Conținutul care apare în zonele widget-uri în mod implicit (codat hard) în bara laterală, de exemplu) ar trebui să dispară atunci când widgeturile sunt activate din Aspect > Widgets.

Footer (footer.php)

  • Utilizați apelul wp_footer (), pentru a apărea chiar înainte de a închide eticheta corpului.
<?php wp_footer(); ?></body></html>

Index (index.php)

  • Afișați o listă de postări în extras sau într-o formă completă. Alegeți una sau alta, după caz.
  • Includeți wp_link_pages () pentru a sprijini legăturile de navigare în postări.

Arhivă (archive.php)

  • Afișați titlul arhivei (etichetă, categorie, arhivă bazată pe date sau autor).
  • Afișați o listă de postări în extras sau într-o formă completă. Alegeți una sau alta, după caz.
  • Includeți wp_link_pages () pentru a sprijini legăturile de navigare în postări.

Pagini (page.php)

  • Afișați titlul paginii și conținutul paginii.
  • Afișați lista de comentarii și formularul de comentarii (cu excepția cazului în care comentariile sunt dezactivate).
  • Includeți wp_link_pages () pentru a susține legăturile de navigare într-o pagină.
  • Metadatele, cum ar fi etichetele, categoriile, data și autorul nu trebuie afișate.
  • Afișați un link „Editați” pentru utilizatorii conectați cu permisiuni de editare.

Postare unică (single.php)

  • Includeți wp_link_pages () pentru a accepta legăturile de navigare într-o postare.
  • Afișați titlul postării și conținutul postării.
    • Titlul ar trebui să fie text simplu, în loc de un link către el însuși.
  • Afișați data postării.
    • Respectați setările formatului datei și orei. cu excepția cazului în care este important pentru proiectare. (Setările utilizatorului pentru formatul datei și orei sunt în panourile de administrare > Setări General).
    • Pentru ieșire bazată pe setarea utilizatorului, utilizați the_time (get_option („date_format”)).
  • Afișați numele autorului (dacă este cazul).
  • Afișați categoriile de postări și etichetele de postare.
  • Afișați un link „Editați” pentru utilizatorii conectați cu permisiuni de editare.
  • Afișați lista de comentarii și formularul de comentarii.
  • Afișați linkurile de navigare către postarea următoare și anterioară utilizând previous_post_link () și next_post_link ().
  • Comentariul autorului trebuie evidențiat diferit.
  • Afișați gravatare (avatare ale utilizatorului), dacă este cazul.
  • Sprijiniți comentariile cu fir.
  • Afișați trackback-urile / pingback-urile.
  • Acest fișier nu ar trebui să conțină definiții ale funcției decât dacă se verifică funcția funcție_exist () pentru a evita erorile de redeclarare. În mod ideal, toate funcțiile ar trebui să fie în functions.php.

Rezultatele căutării (search.php)

JavaScript

  • Codul JavaScript ar trebui să fie plasat în fișiere externe ori de câte ori este posibil.
  • Utilizați wp_enqueue_script () pentru a vă încărca scripturile.
  • JavaScript încărcat direct în documente HTML (fișiere șablon) ar trebui codificat CDATA pentru a preveni erorile din browserele mai vechi .
<script type="text/javascript">/* <!]> */</script>

Captură de ecran

Creați o captură de ecran pentru tema dvs. Captura de ecran trebuie să fie denumită screenshot.png și trebuie plasată în directorul de nivel superior. Captura de ecran trebuie să afișeze cu exactitate designul temei și să fie salvată în format PNG. În timp ce .jpg, .jpeg și .gif sunt, de asemenea, extensii și formate de fișiere valide pentru captura de ecran, acestea nu sunt recomandate.

Dimensiunea recomandată a imaginii este de 1200 px lățime și 900 px înălțime. Captura de ecran va fi de obicei afișată mai mică, dar imaginea supradimensionată permite vizionarea cu rezoluție înaltă pe afișajele HiDPI. Rețineți că, deoarece ecranul Gestionați temele este receptiv, este posibil ca partea de sus și de jos a imaginii capturii de ecran să nu poată fi vizualizată, așa că păstrați grafica lângă centru.

Opțiuni temă

Temele pot suporta opțional Ecran de personalizare a temei. Pentru un exemplu de cod, consultați Un exemplu de pagină de opțiuni pentru temă WordPress.

Când activați disponibilitatea ecranului de personalizare a temei pentru un rol de utilizator, utilizați capacitatea utilizatorului „edit_theme_options” în loc de funcția „switch_themes”, cu excepția cazului în care rolul utilizatorului ar trebui, de fapt, să poată schimba temele. Vedeți mai multe la Roluri și capabilități și Adăugarea meniurilor de administrare.

Dacă utilizați funcția „edit_themes” oriunde în Tema dvs. pentru a obține accesul rolului de administrator la ecranul de personalizare a temei (sau poate la unele ecrane personalizate), Rețineți că, de la versiunea 3.0, această capacitate nu a fost atribuită implicit rolului de administrator în cazul instalării WordPress Multisite. Vezi explicația. Într-un astfel de caz, utilizați funcția „edit_theme_options” dacă doriți ca administratorul să vadă meniul „Opțiuni temă”. Consultați capacitățile suplimentare ale rolului de administrator atunci când utilizați WordPress Multisite.

Procesul de testare a temei

  1. Remediați erorile PHP și WordPress. Adăugați următoarea setare de depanare în fișierul wp-config.php pentru a vedea apeluri de funcții depreciate și alte erori legate de WordPress: define („WP_DEBUG”, adevărat) ;. Consultați Cârligul funcțiilor depreciate pentru mai multe informații.
  2. Verificați fișierele șablon în comparație cu lista de verificare a fișierelor șablon (consultați mai sus). li> Validați HTML și CSS. Consultați Validarea unui site web.
  3. Căutați erori JavaScript.
  4. Testați în toate browserele vizate. De exemplu, IE9, Safari, Chrome, Opera, Firefox și Microsoft Edge.
  5. Curățați orice comentarii, setări de depanare sau elemente TODO străine.
  6. Consultați Revizuirea temei dacă sunteți public lansarea temei prin trimiterea acestuia în directorul temelor.

Resurse și referințe

Standarde de cod

  • Cunoaște-ți sursele
  • Standarde de codare WordPress
  • Standarde de codificare CSS

Proiectarea temelor

  • Proiectarea și aspectul site-ului

CSS

  • CSS
  • CSS Shorthand
  • Clase generate de WordPress

Șabloane

  • Intrarea în șabloane
  • Șabloane
  • Ierarhia șabloanelor
  • Etichetele șablonelor
  • Bucla
  • Etichete condiționate
  • Referința funcției
  • I18n pentru dezvoltatorii WordPress
  • Validarea datelor

Listarea funcțiilor

  • Referință funcție

Testare și QA

  • Unitate tematică Te st
  • Validarea unui site web
  • Fixarea CSS-urilor din browser
  • Depanarea CSS
  • modern.IE: pentru testarea IE pe diferite platforme cu deschidere -instrumente de sursă

Lansarea & Promovare

  • Procesul de revizuire a temei

Write a Comment

Adresa ta de email nu va fi publicată. Câmpurile obligatorii sunt marcate cu *