Creați un șablon de pagină WordPress separat. Cum să creezi un șablon de pagină WordPress

Uneori este nevoie de a crea pagina noua site cu funcții noi. De exemplu, pentru a crea un serviciu pentru verificarea site-urilor TCI și PR, a cărui instalare și funcționare au fost descrise în articolul „”. Capabilitati standard Pagini WordPress nu sunt nelimitate, iar executarea scripturilor pe ele nu este furnizată, motiv pentru care programatorii inteligenți au venit cu o astfel de mișcare - pentru a crea șablon nou o pagină care va fi „cauciuc”, adică va avea posibilitatea să o umple cu orice funcționalitate.

Crearea unui șablon de temă nou nu este o sarcină mare, dar pentru cei care se confruntă cu el pentru prima dată, acest proces poate prezenta unele dificultăți. Deci de unde să încep? Totul este în ordine - toate fișierele dvs. de teme se află în directorul wp-content/themes/site theme/. Toate procedurile pot fi efectuate prin panoul de administrare și un editor de text, de exemplu, Notepad sau Notepad+. Selectați page.php pentru a crea un șablon de pagină nou - acesta este un exemplu al dvs pagina standard Subiecte.

ÎN editor de text crea fișier nou, care va fi noul șablon de pagină - de exemplu, nov.php și copiați întregul conținut al fișierului temă page.php în el - acesta va fi scheletul noii pagini. Apoi îl putem umple așa cum ne dorim.

Fișierul de pagină standard conține un apel către antetul site-ului, subsolul, bara laterală sau mai multe (dacă șablonul de temă are mai multe dintre ele) și conținutul paginii în sine, precum și rezultatul comentariilor și alte lucruri utile. Dar pentru a organiza un nou șablon, trebuie să specificați următorul cod în partea de sus a paginii nov.php:

Numele nu trebuie scris cu litere mari. Apoi, dacă decideți că nu aveți nevoie de unele elemente ale paginii (de exemplu, linii, , ), pot fi eliminate. Dar acest lucru se aplică deja pentru formarea designului paginii. Acum facem treabă murdară. Adică, folosind linii de apeluri către anumite funcții, puteți schimba șablonul de pagină principală dincolo de recunoaștere.

Dar cum pot face această pagină să facă anumite lucruri? functii secundare, adică pentru ea - principalele? Este necesar să specificați acțiunea pe care o va efectua această pagină, adică redirecționarea funcției către pagina șablon care este responsabilă de executarea scriptului. În limbajul de programare, aceasta se numește „include”. Pentru noi aceasta va fi linia, unde calea TEMPLATEPATH.”/mmouse-whois.php indică calea către fișierul care reprezintă serviciu whois– verificarea numelor de domenii. Puteți organiza orice execuție de scripturi - sondaje, contoare etc.

În cazul meu, pagina nov.php îndeplinește două funcții. Adică, dacă luăm un exemplu, fișierul mmouse-whois.php verifică domeniul după adresa resursei, iar fișierul pagenavi.php verifică ocuparea domeniului după adresa IP a clientului. Adică pe pagina nov.php sunt executate două funcții simultan. Dar pentru ca acest lucru să funcționeze, noua ta pagină necesită prezența unor astfel de fișiere în directorul de teme, adică trebuie să le încarci acolo.

După finalizarea tuturor acestor sarcini, reveniți la consola site-ului dvs. și creați o pagină nouă așa cum ați făcut înainte. Dar acum vei avea ocazia să alegi nu șablon de bază pagină, dar una nouă, tocmai creată. Iată cum va arăta:

Acum a fost creat noul dvs. șablon de temă. Îl puteți modifica după cum doriți - eliminați sau adăugați o bară laterală, instalați un nou fișier de antet temă sau transformați subsolul fișierului. Dar acesta este un subiect pentru alt articol. Și pentru exemplul de mai sus, o pagină existentă și de lucru și de lucru arată astfel:

Sistemul WordPress vă permite să vă creați cu ușurință propriul șablon de pagină modificând ușor oricare dintre șabloanele standard.

De exemplu, acum vreau să fac un șablon dintr-o temă cu trei coloane, în care va exista o singură bară laterală - trebuie să-l fac lat câmpuri de text pentru paginile albumului foto.

Cum să faci un singur șablon de pagină WordPress

Întregul proces de creare a unui șablon special pentru o pagină web specială constă în câțiva pași:

1. Creați un fișier php pentru un șablon nefinalizat bazat pe cel standard.

2. Setări șablon pentru un tip special de pagină de site pe WordPress (puteți face acest lucru pe computer sau direct în panoul de administrare a site-ului).

3. Când creați o pagină nouă sau editați una existentă, selectați șablonul rezultat pentru aceasta.

Crearephp pentru șablonul de pagină

Descarca fisierul page.php din folderul temei instalat pe site. Situat la:

/wp-content/themes/theme_name/page.php

Deschideți, de exemplu, în Notepad++.

La inceput, inainte de, introduceți codul pentru numele noului șablon de pagină:

Nume șablon: Album

Setări pentru șablonul de pagină de siteWordPress

Aici puteți edita un șablon nou fie pe computer, fie în panoul de administrare. Prefer a doua opțiune, astfel încât să pot vedea imediat ce se întâmplă (deși aceasta este o scuză - nu trebuie să o vizionați pe site...).

Deci, trebuie să încărcați fișierul album.php în același folder în care se află pagina implicită page.php a temei WordPress.

După descărcarea fișierului, accesați panoul de administrare din meniu „Aspect” - „Editor” iar în dreapta selectați un fișier nou din șabloane.

În fereastra de editare puteți vedea codul paginii, la începutul căruia se află codul nostru pentru definirea numelui șablonului de pagină „Album”.

Tot ce rămâne este să editați șablonul după bunul plac. De exemplu, trebuie să elimin bara laterală din dreapta. Și apoi, totuși, va trebui să adaug noi stiluri, astfel încât coloana centrală a site-ului să devină mai lată decât în ​​șablonul de pagină standard (cu lățimea barei laterale la distanță).

Dacă totul este simplu cu bara laterală (trebuie să-i ștergi codul și gata)...

...atunci cu stiluri totul este un pic mai complicat. Nu voi inventa sau nu voi deranja să creez noi clase. Voi avea doar câteva pagini - late - pentru albume foto, așa că voi scrie stilurile direct în fișierul șablon pentru noua pagină album.php.

Apropo, asta s-a întâmplat după eliminarea codului din bara laterală din dreapta (spațiul a fost eliberat, dar câmpul central nu s-a extins, deoarece are o lățime fixă).

În Google Chrome este convenabil să te uiți la codul unui element de pagină, așa că constat rapid că un bloc cu un câmp central are ID postcont(în șablonul meu). Și blocul cu textul paginii în sine este conținut.

Trebuie să le adăugați noi stiluri, adică să măriți lățimea (dimensiune = lățimea paginii – lățimea barei laterale din stânga).

Iată-le, dragii mei, în codul fișierului șablon al paginii album.php:

Și

Nu am avut nevoie de stilul de conținut pentru că nu are deloc o lățime specificată, este doar un bloc imbricat în postcont.

! important– un parametru obligatoriu în astfel de cazuri, pentru că nu m-am uitat și nu știu ce scrie acolo în stiluri, iar noile mele stiluri ar trebui să aibă prioritate.

În principiu, totul este deja gata. Acum pagina din noul șablon arată astfel:

În partea dreaptă, câmpul de text este „lipit” de chenarul din dreapta și se întinde până la lățimea barei laterale din dreapta. Nu este foarte vizibil aici, pentru că mai sunt spații pentru fotografii vechi, mici, dar când îl înlocuiesc, voi adăuga aspectul aici.

Actualizare din 20.10.14: Adaug, așa cum am promis la începutul anului, o captură de ecran a paginii cu fotografii. Da, s-au întâmplat atât de multe de atunci. 17 februarie este ultima zi pașnică înainte de evenimentele rapid diferite care au urmat...

Și în sfârșit etapa finală (pe care am arătat-o ​​deja puțin în capturile de ecran de mai sus).

Setările șablonului pentru paginile site-uluiWordPress

Când creați o pagină sau editați una care există deja pe site, puteți selecta un șablon personalizat în partea dreaptă.

Selectați meniul „Pagini” și „Adăugați nou” sau faceți clic pe cel pe care doriți să îl schimbați.

În partea dreaptă a meniului „Șablon”, schimbați „Șablonul de bază” în noul „Album” și salvați sau publicați pagina.

Acum asta e tot!

Fotografie © Nancy L Misiewicz. A Romp in the Woods

Alte postări interesante

Acest tutorial vă va arăta cum să creați un nou șablon de pagină pentru șabloanele WordPress Cherry Cadru.

    Conectați-vă la panoul de administrare WordPress.

    Deschide meniul Pagini -> Adăugați nou (Pagini -> Adăugați nou)și creați o pagină nouă cu un șablon de pagină nou.

    Introduceți un titlu pentru pagină și salvați modificările. În coloana din dreapta a panoului, puteți selecta unul dintre șabloanele de pagină utilizate în tema dvs. Trebuie să adăugați un nou șablon de pagină la această listă. Toate aceste șabloane se află într-un folder de pe serverul dvs. Dar trebuie să adăugați un nou șablon de pagină în dosar wp-content/themes/theme#####.

    Creați un fișier .php nou în orice editor precum Dreamweaver sau Notepad++ și denumiți-l așa cum ar fi: nou.php . Adăugați următorul cod la acest fișier:

    Salvați fișierul și încărcați-l în folder wp-content/themes/theme##### la serverul dvs.

    Acum reveniți la pagina pe care ați creat-o în admin Panouri WordPress. În panou Atributele paginii Puteți alege un șablon de pagină nou numit „Personalizat”.

    Deschideți din nou fișierul new.php și începeți să adăugați conținutul dvs. Fișierul poate conține orice doriți, inclusiv conținut imuabil sau elemente de aspect al paginii care vor afișa conținutul paginii.

    Puteți utiliza elemente de cod ale altor șabloane de pagină din folder wp-content/themes/CherryFramework pentru a crea o anumită pagină.

    Să adăugăm mai întâi un antet și un subsol la noul șablon de pagină:

    Dacă salvați modificările, le veți putea vedea pe pagină:

    Acum trebuie să selectați tipul de conținut pe care doriți să îl utilizați pe această pagină. Să zicem că nu ai șablon separat pagini pentru postări personalizate „Echipa noastră”. Și vă place designul șablonului de pagină Mărturii și doriți să utilizați acest design pentru postările „Echipa noastră”. Pentru a face acest lucru în meniu Design -> Editor (Aspect -> Editor) puteți găsi cu ușurință fișierul care conține codul pentru șablonul de pagină Mărturii. Numele lui pagina-testi.php.

    Deschideți acest fișier pentru editare. Copiați doar codul de conținut, deoarece ați adăugat deja antetul și subsolul (mai jos este un exemplu al acestui cod, codul dvs. poate arăta diferit):

    " data-motopress-wrapper-file="page-testi.php" data-motopress-wrapper-type="content">
    " data-motopress-type="static" data-motopress-static-file="static/static-title.php">
    " id="conținut" data-motopress-type="loop" data-motopress-loop-file="loop/loop-testi.php">
    sidebar" id="sidebar" data-motopress-type="static-sidebar" data-motopress-sidebar-file="sidebar.php">

    Lipiți codul copiat în fișierul new.php. A inlocui Nume șablon: Personalizat pe Nume șablon: Echipa

    Și înlocuiți pagina-testi.php pe nou.php în acest cod.

    Acest cod conține și un link către fișier loop/loop-testi.php. Acesta este un alt fișier pe care trebuie să îl copiați și să îl editați. Copiați fișierul loop-testi.php din folder wp-content/themes/CherryFramework/loopși inserați-l în folder wp-content/themes/theme#####/loop(dacă folderul cu tema nu are un folder buclă, ar trebui să-l creați). Redenumiți acest fișier, de exemplu, loop-new.php și deschideți-l pentru editare. Înlocuiește cuvântul „testi” pe cuvant "echipă"în toate rândurile fișierului și salvați modificările. (Puteți folosi comanda rapidă de la tastatură Control (Comandă) + F pentru a înlocui cuvinte.)

    Când dosarul loop-new.php creat și editat, deschideți din nou fișierul nou.phpși înlocuiți loop/loop-testi.php pe loop/loop-new.phpîn codul lui. Drept urmare, codul dvs. va arăta astfel:

    " data-motopress-wrapper-file="new.php" data-motopress-wrapper-type="content">
    " data-motopress-type="static" data-motopress-static-file="static/static-title.php">
    " id="conținut" data-motopress-type="loop" data-motopress-loop-file="loop/loop-new.php">
    sidebar" id="sidebar" data-motopress-type="static-sidebar" data-motopress-sidebar-file="sidebar.php">

    Salvați modificările și testați noua pagină. Acum ar trebui să conțină postări personalizate „Echipa noastră” cu designul paginii Mărturii.

Cei care au încercat vreodată să creeze teme sau să-și schimbe codul știu că șablonul „page.php” este responsabil pentru stilul tuturor paginilor site-ului. Adesea, acest fișier afișează blocuri care sunt aceleași în înregistrări, arhive etc. WordPress vă permite să vă creați propriul dvs șabloane personalizate de pagină. Și asta, la rândul său, înseamnă că poți depăși designul standard. Voi explica. De exemplu, în șablonul de pagină creat, puteți elimina bara de site sau puteți modifica locația blocurilor, puteți crea un antet diferit sau puteți modifica întregul design. De asemenea, datorită creării propriilor șabloane, este posibil să creați o pagină (pagini de destinație).

Deci, folosind un șablon de pagină personală puteți:
- eliminați sau adăugați o bară laterală, subsol, antet;
- modificarea designului antetului, subsolului, barei laterale;
- creați o pagină de înregistrare sau un formular de contact integrat în design;
- implementarea unor scripturi (JavaScript, php și altele);
- proiectează pagini într-un mod original

Cum să-ți creezi propriul șablon de pagină pe WordPress

Metoda nr. 1

○ Creați-vă propriul șablon

Pentru a crea propriul șablon de pagină WordPress, urmați acești pași:
- deschide-ți blogul/site-ul prin FTP. Pentru a face acest lucru, utilizați programe precum sau

Deschideți fișierele teme ( wp-content/themes/Tema-ta/ )

Descărcați fișierul „page.php” și deschideți-l cu, apoi lipiți următorul cod chiar la începutul fișierului:

Desigur, numele " noua pagina pentru site » schimba-l cu al tau
Cu acest cod i-am spus WordPress să creeze un șablon personalizat numit „ noua pagina pentru site ».

De exemplu, pentru a putea vedea diferența, eliminați bara de site. Pentru a face acest lucru, găsiți și ștergeți acest lucru în cod:

Și salvați fișierul în sine ca „page-no-sidebars.php”.
Încărcați fișierul nou creat „page-no-sidebars.php” prin FTP în toate fișierele tematice.

○ Conectarea unui nou șablon la pagină

În panoul de administrare WordPress, pe orice pagină care a fost deja creată (sau pe cea pe care o veți crea), în partea dreaptă, găsiți elementul „Șablon”. Aici, în acest moment, selectați-vă numele pentru noul șablon de pagină (în cazul meu este „ noua pagina pentru site »):

Salvați și vedeți rezultatul.

Metoda nr. 2

Metoda nr. 2 diferă de metoda nr. 1 prin faptul că fișierul trebuie denumit cu un nume specific:

Page-(slug-page).php

De exemplu: page-contact.php

Pagina-(ID pagină).php

De exemplu: page-12.php

Voi explica.

Când o pagină este creată, i se atribuie automat o adresă URL. Îl puteți schimba după cum doriți, vă recomand să utilizați pluginul rustolat ():

Deci, dacă adresa URL a paginii este „proba”, atunci fișierul pe care trebuie să-l creez pentru această pagină va fi astfel:

pagină- proba.php

Dacă adresa URL a paginii ar fi „de contact”, atunci fișierul pentru pagina respectivă ar arăta astfel:

pagină- contact.php

Încărcați fișierul prin FTP în toate fișierele tematice. Verificați, totul ar trebui să funcționeze.

Dezavantajul metodei nr. 2 este că fișierul este creat doar pentru o pagină, toate celelalte vor fi standard.

Asta este tot! Acum puteți crea un design unic pentru orice pagină.

În acest articol, voi vorbi despre modalități de a crea șabloane pentru paginile persistente WordPress. Fiecare metodă are avantajele și dezavantajele sale. Dar înainte de a începe, puțin despre ce sunt paginile și cum diferă acestea de postări.

În WordPress puteți crea pagini (pagini) și postări (postări). Ele diferă prin faptul că postările: apar în feedul de pe pagina principală; Categoriile sunt indicate pentru intrări; postările nu pot fi arborescente, iar paginile: sunt folosite pentru conținut precum „Despre mine”, „Contacte”, „Harta site-ului”; nu au categorii, dar au o structură arborescentă. Intrările sunt de obicei destinate informațiilor cronologice (pe baza orei în care au fost adăugate), iar paginile sunt pentru o structură arborescentă care este independentă de timp. De exemplu, acest articol este publicat ca „intrare” în secțiunea „Cod”, iar linkurile din meniul antet duc la paginile: Funcții.

Paginile sunt similare cu înregistrările - sunt situate în același tabel de bază de date și datele lor sunt aproape aceleași: titlu, text, câmpuri suplimentare etc. Ambele sunt postări, dar de diferite tipuri: paginile sunt în formă de arbore și sunt organizate prin crearea de pagini părinte și copil, iar postările sunt organizate pe categorii și etichete. În WordPress puteți crea tipuri de postări suplimentare, arbore sau nu.

Crearea de pagini în WordPress

Adesea trebuie să creați un șablon de pagină separat, astfel încât informațiile afișate să difere de alte pagini. Prin crearea unui șablon de pagină în WordPress, puteți schimba complet pagina: eliminați bara laterală, subsolul, antetul, puteți schimba pagina dincolo de recunoaștere. De exemplu, pe acest site se modifică în acest fel pagina pe care sunt afișate codurile fișierelor WordPress.

Metoda 1: șablon de pagină folosind un fișier cu un nume personalizat și conectarea acestuia în panoul de administrare (metoda clasică)

Acesta este cel mai comun mod de a crea un șablon de pagină în WordPress. Pentru a face acest lucru, trebuie să creați un fișier .php, de exemplu, tpl_my-page.php în folderul cu teme și chiar la începutul fișierului scrieți o notă că fișierul creat este un șablon pentru pagini:

Acum, când creăm o pagină în panoul de administrare, în blocul „Proprietăți pagini”, putem selecta un „șablon”:

Din WordPress 4.7. Astfel de șabloane de pagină pot fi create pentru orice tip de postare, nu doar pentru pagină. Pentru a face acest lucru, completați comentariile cu rândul: Template Post Type: post, page, unde post, page sunt numele tipurilor de postare cărora le aparține șablonul.

/* Numele șablonului: șablonul paginii mele Tipul postării șablonului: post, pagină, produs */

Avantaje:

    După ce am creat un șablon, îl putem aplica convenabil pe diferite pagini. De exemplu, puteți crea un șablon fără bară laterală și îl puteți utiliza pe pagini diferite.

  • Numai înregistrările cu șablonul specificat pot fi preluate. De exemplu, puteți afișa toate paginile cu șablonul „Servicii” (fișierul servises.php). Uneori este convenabil. Numele fișierului șablon este stocat în metacâmpul _wp_page_template, așa că pentru a afișa pagini cu șablonul specificat trebuie să creați o interogare folosind metacâmpul (consultați WP_Query).

Defecte:

După ce ați creat fișierul șablon în folderul cu teme, trebuie să mergeți la panoul de administrare și să instalați șablonul pentru pagină. Acest lucru nu este întotdeauna convenabil în timpul dezvoltării. Prin urmare, dacă intenționați să utilizați șablonul pentru o singură pagină, utilizați a doua metodă.

Cum functioneaza:

Când accesați panoul de administrare pentru a edita o pagină de postare arborescentă, WordPress scanează toate fișierele șablon pentru linia:

Nume șablon: ***

Linia poate fi localizată oriunde și în orice mod în fișier.

Toate fișierele cu șiruri similare sunt colectate și afișate în selecția șablonului din blocul „Atribute pagină”.

La publicarea unei pagini, câmpul personalizat _wp_page_template este completat cu numele fișierului șablon sau implicit dacă nu este specificat niciun șablon:

Wp_page_template = implicit
_wp_page_template = tpl_my-page.php

Apoi, când utilizatorul vizitează pagina, WordPress va verifica meta câmpul _wp_page_template, dacă șablonul este instalat, atunci fișierul șablon este utilizat. În caz contrar, căutarea șablonului de pagină continuă prin ierarhie.

Metoda 2: șablon de pagină printr-un fișier cu un nume specific (ierarhia fișierelor șablon)

Când o pagină este creată, i se atribuie o etichetă (slug, nume alternativ). Este folosit în adresa URL a paginii. Și poate fi schimbat:


Pentru a crea un șablon în acest fel, trebuie să aflați pagina slug-ul și să creați un fișier în folderul cu teme. Să presupunem că slug-ul nostru, ca în imagine, este egal cu contacts, apoi vom crea un fișier page-contacts.php în temă. și completați-l cu codul necesar (puteți copia conținutul din fișierul șablon page.php și îl puteți edita după bunul plac). Asta e, acum când vizităm pagina ar trebui să vedem un nou șablon. În mod similar, puteți lua ID-ul (să fie 12) al paginii și puteți crea un fișier page-12.php .

Avantaje:

Nu este nevoie să mergeți la panoul de administrare și să instalați fișierul șablon. Șablonul începe să funcționeze imediat după crearea fișierului. Convenabil pentru dezvoltare.

Defecte:

Șablonul este creat doar pentru o anumită pagină. Depinde de slug-ul paginii; dacă se schimbă, șablonul nu va funcționa. Dacă utilizați ID, atunci dependența de slug dispare, dar devine neclar în fișierul temă căreia îi aparține șablonul (dacă există mai multe șabloane cu ID).

Aproape inutil când scriu șabloane și cu atât mai mult plugin-uri. Poate fi folosit atunci când vă editați site-ul web, în ​​care slug-ul sau ID-ul paginii este cunoscut în prealabil.

Cum functioneaza:

WordPeress selectează ce fișier să folosească în următoarea ordine (fișierele trebuie să fie în rădăcina temei):

  • (any_name).php (atunci când utilizați un șablon de pagină)
  • pagina-(post_label).php
  • pagina-(post_ID).php
  • pagina.php
  • singular.php
  • index.php

Metoda 3: șablon de pagină prin filtrul „template_include” (codare)

Aceasta este o metodă avansată, este mai complexă, dar odată cu complexitatea deschide posibilități largi. Folosind această metodă, puteți seta un șablon pentru orice pagină, postare, categorie, orice publicație de pe site sau chiar un grup de publicații. Vezi exemple cu descrieri:

// filtrul trece variabila $template - calea către fișierul șablon. // Schimbând această cale, schimbăm fișierul șablon. add_filter("template_include", "my_template"); function my_template($template) ( # similar cu cea de-a doua metodă // dacă aceasta este o pagină cu slug de portofoliu, utilizați fișierul șablon page-portfolio.php // folosiți eticheta condiționată is_page() if(is_page("portfolio") ))( if ($new_template = locate_template(array("page-portfolio.php"))) return $new_template ; ) # șablon pentru grupul de categorii // acest exemplu va folosi fișierul din folderul temă tpl_special-cats.php, // ca șablon pentru categorii cu ID 9 , titlu „Necategorizat” și slug „php” if(is_category(array(9, „Uncategorized”, „php”)))( return get_stylesheet_directory() . „/tpl_special-cats. php"; ) # șablon pentru introducerea după ID // fișierul șablon este localizat în folderul plugin /my-plugin/site-template.php global $post; if($post->ID == 12)( return wp_normalize_path( WP_PLUGIN_DIR) . "/my-plugin/site- template.php"; ) # șablon pentru pagini de tip personalizat „carte” // se presupune că fișierul șablon book-tpl.php se află în folderul temă global $post ; if($post->post_type == „carte”)( return get_stylesheet_directory() . „/book-tpl.php”; ) returneaza $template; )

Acest cod trebuie plasat în fișierul functions.php al temei sau într-un plugin, sau conectat într-un alt mod. După cum puteți vedea din exemplu, în timpul filtrului template_include, etichetele condiționate funcționează deja, variabilele globale sunt setate: $wp_query , $post , etc.

Avantaje:

    Puteți seta un șablon pentru orice pagină sau grup de pagini. Carte albă aproape completă în acțiuni.

  • Puteți crea un șablon când scrieți un plugin.

Defecte:

Necesitatea de a scrie cod și de a-l conecta separat (de exemplu, în funcțiile temei.php).