Share
Acum ne-am ocupat de meniuri personalizate, să ne concentrăm asupra barelor laterale dinamice și asupra modului în care pot fi utilizate într-o temă.
Ce este exact o bară laterală dinamică? Există 3 părți ale denumirii pe care trebuie să o rezolvăm în ceea ce privește acest subiect.
În primul rând, "dinamic". Dinamic se referă la faptul că zona laterală a buclei poate fi controlată din interiorul tabloului de bord de administrare și poate fi ușor schimbată. În plus, conținutul său poate fi tras din informații WordPress actualizate în mod constant, cum ar fi mesajele, comentariile și alte tipuri de conținut actualizate în mod regulat, astfel încât de fiecare dată când se adaugă o nouă postare, acesta poate fi tras într-un bloc de conținut recent sau un widget cu termenul de widget într-un pic.).
În al doilea rând, "Bara laterală" se referă la o zonă de conținut, care nu trebuie neapărat să fie localizată în partea laterală a aspectului (știu ciudat). Termenul a fost moștenit încă din primele zile ale layout-urilor stil blog, unde widget-urile erau aproape întotdeauna poziționate în partea laterală. Bara laterală conține blocuri de conținut suplimentare sau date generate de pluginuri, care apare sub formă de "widget-uri", de obicei în lateral, în antetul sau în subsolul temelor WordPress, dar pot fi de asemenea poziționate în orice mod dorit în aspectul temei.
Un widget este un bloc de conținut mic, care conține, în general, link-uri sau conținuturi asociate paginilor sau posturilor. Acestea ar putea include liste de postări, comentarii, etichete, categorii și o întreagă gamă de alte colecții de conținut unele încorporate și unele generate de pluginuri suplimentare.
Widgeturile pot fi adăugate la teme "widget ready" prin intermediul Aspect -> Widgeturi din tabloul de bord de administrare utilizând zona de gestionare widget drag & drop built-in. Temele nu acceptă widget-uri în mod automat și trebuie să fie pregătite widget-ul prin înregistrarea unei funcții speciale, în mod similar cu care am înregistrat meniurile personalizate.
Înainte de a înregistra bara laterală în orice temă WordPress, când vizitați Aspect -> Widgeturi, vedem următoarele.
Similar cu meniurile personalizate din lecția noastră anterioară, pentru ca funcția bara laterală dinamică să funcționeze în tema dvs., tema dvs. are nevoie de un fișier functions.php care înregistrează barele laterale. Fișierul functions.php simplu trebuie să conțină următorul cod:
Acordați o atenție deosebită, așa cum sa menționat anterior, pentru a nu lăsa spații goale după codul din fișierul cu funcții, deoarece acest lucru cauzează uneori probleme care pot avea ca rezultat ecrane albe atunci când vă vedeți tema pe front.
Singurul aspect al acestui cod care ar fi necesar să se editeze la început ar fi suma zonelor binare dinamice care se vor înregistra în "register_sidebars (1);". Ne vom ocupa cu barele laterale numite într-un pic. Deocamdată, codul nostru de mai sus a înregistrat 2 bare laterale identificate doar prin numărul lor.
Dacă doriți să aveți 5 zone din bara laterală dinamică în tema dvs., numărul se va schimba la 5 - "register_sidebars (5);"În acest caz, ați avea 5 zone din bara laterală dinamică numerotate de la 1 la 5.
Funcția are o declarație "if" sau un argument condițional care verifică dacă funcția register_sidebars există în această versiune de WordPress. Dacă răspunsul se întoarce cu da, atunci funcția register_sidebars este executată. Având în vedere că lateralele au fost susținute de versiunea 2.2 a WordPress, probabil că nu este necesar să vă faceți griji cu privire la acest aspect al codului.
Odată ce fișierul de funcții este gata, puteți continua să inserați widget-uri în noile zone ale barei laterale pe care le-am creat.
Acum puteți să accesați widget-urile din zona "Widgets Available" din partea stângă și să le aruncați în bara laterală 1 sau 2 în partea dreaptă.
Odată ce fișierul cu funcții este gata, puteți continua să inserați codul dinamic al barei laterale în zonele temei în care doriți să adăugați dinamic widget-uri WordPress. Codul de mai jos este forma cea mai de bază a codului de plasare a barei laterale. Singurul aspect care trebuie modificat este numărul pentru a reflecta bara laterală numerotată pe care doriți să o plasați în locația respectivă.
Vom plasa acest cod în bara laterală stângă
Codul de mai sus ar trebui să fie suficient pentru a permite bara laterală înregistrată să afișeze conținutul widgetului în cadrul temei. Așa că vom merge mai departe și vom adăuga câteva widget-uri.
Care are ca rezultat:
A trebuit să adaug suplimentar CSS pentru a lua în considerare widget-urile nou adăugate. În esență, am adăugat în CSS widget-ul CSS din tema Twenty Eleven. Este posibil să aveți nevoie să scrieți CSS personalizat pentru propriile teme, astfel încât să se potrivească cu aspectul, stylingul și colorarea pentru tema dvs. Voi posta CSS la sfârșitul lecției.
Pentru a ne asigura că bara noastră laterală afișează încă ceva în cazurile în care widgeturile nu au fost încă adăugate sau în cazul în care barele laterale nu s-au înregistrat (sperăm că nimeni nu rulează versiunea 2 WordPress), trebuie să extindem codul de plasare cu ca urmare a. Înștiințare dynamic_sidebar (1) este încă în prima linie de cod!
Ce face codul de mai sus?
Linia 1 din verificările de cod pentru a vedea dacă ați înregistrat barele laterale din fișierul functions.php și, dacă da, care este bara laterală care trebuie inserată în această locație.
Randul 2 acționează ca widget implicit care afișează o listă a categoriilor de postări ale site-ului dvs. dacă nu au fost adăugate widget-uri dinamice. Odată ce un widget dinamic este adăugat în bara laterală din tabloul de bord, widgetul prestabilit va fi înlocuit de cel dinamic.
Linia 3 termină argumentul if a început linia 1. În argumentele PHP, cum ar fi, care este o afirmație condiționată, trebuie să se termine și argumentul nu afectează nici un cod php care urmează. Nu se închide dacă cu endif; va rupe tema!
Singura parte a celor 3 linii din codul dinamic al barei laterale care trebuie într-adevăr să fie editate este numărul, pentru a indica ce bara laterală numerică specifică este inserată în această locație.
Din documentația WordPress (Codul) acestea sunt câteva dintre funcțiile care pot fi folosite pentru a "codifica" obiectele widget în zonele laterale și pentru a include ca widget-uri implicite în codul de plasare a barei laterale.
wp_list_authors () - Afișează o listă a autorilor (utilizatorilor) site-urilor și, dacă utilizatorul a scris orice post, numele autorului este afișat ca un link către postările lor.
wp_list_categories () - Afișează o listă de categorii ca link-uri. Atunci când se face clic pe o legătură de categorie, se afișează toate postările din categoria respectivă
wp_dropdown_categories () - Afișați sau preluați lista verticală HTML a categoriilor.
wp_tag_cloud () - Afișează o listă de etichete în ceea ce se numește "cloud tag", unde dimensiunea fiecărei etichete este determinată de câte ori acea etichetă a fost atribuită postărilor.
wp_list_pages () - Afișează o listă de pagini WordPress ca link-uri.
wp_list_bookmarks () - Afișează marcajele găsite în panoul Administration -> Links.
get_comments () - Lista comentariilor bazate pe număr, ordine și alți parametri.
wp_get_archives () - Această funcție afișează o listă de arhive bazată pe date.
Aceste funcții pot fi utilizate oriunde în temă pentru a genera liste de conținut variat de pe site pentru a ajuta utilizatorii să găsească mai ușor conținutul.
Apoi am putea folosi această convenție pentru codul de plasare pentru a plasa numărul 2 al barei laterale în zona din partea dreaptă a temei noastre.
Categorii
Am putea include și orice alt conținut HTML ca conținut widget implicit, care ar trebui afișat înainte ca widgeturile dinamice să fie adăugate prin intermediul administratorului widget-urilor. Aceasta poate include un mesaj care să reamintească proprietarilor de site-uri să adauge fizic widget-uri odată ce au activat noua temă.
Nu au fost adăugate widgeturi
Conectați-vă și adăugați unele widget-uri în această bara laterală
După cum vedem mai jos, am introdus codul de plasare a barei laterale în conținutul implicit, fie din widget-uri, așa cum este ilustrat în bara laterală din stânga sau în alt conținut HTML așa cum este ilustrat în bara laterală dreaptă. Acest lucru va apărea atâta timp cât nu se adaugă widgeturi dinamice prin tabloul de bord pentru widgeturi. După ce se adaugă widget-uri dinamice, acestea vor înlocui automat conținutul implicit.
Acum, pentru a testa câteva widget-uri dinamice, am adăugat următoarele două widget-uri dinamice:
Care sunt rezultatele în următoarea apariție.
În prezent, avem 2 coduri de plasare cu conținut diferit implicit, dar trăgând aceeași zonă a barei laterale în partea stângă și dreaptă a temei noastre. Pentru a remedia acest lucru, vom schimba codul de plasare a barei laterale în bara laterală dreaptă pentru a plasa numărul 2 al barei laterale în locul barei laterale 1 după cum urmează. După cum puteți vedea, trebuie doar să modificăm numărul la bara laterală numerică pe care dorim să o plasăm.
Nu au fost adăugate widgeturi
Conectați-vă și adăugați unele widget-uri în această bara laterală
Acum putem gestiona barele laterale stângi și drepte în mod independent.
Odată ce ați adăugat o anumită cantitate de bare laterale pe tema dvs., veți realiza rapid necesitatea de a avea nume în locul numerelor. Acest lucru vă va ajuta să vă amintiți care regiuni ale paginii dvs. sau șabloanele bara laterală specifică sunt plasate.
Pentru a înregistra barele laterale numite codul următor trebuie să fie folosit pentru a înregistra barele laterale în fișierul functions.php:
Singura diferență în ceea ce privește înregistrarea aici este în prezent numele barei laterale. Un număr de parametri există pentru personalizarea în continuare a ieșirii HTML a widget-urilor cu bare laterale după cum urmează:
Sursă: register_sidebar
Utilizarea unora dintre acestea în formatul matricei are ca rezultat următoarea structură a codului.
'Stânga', 'before_widget' => '',' după_widget '=>'',' anterior_title '=>'',' după_title '=>'
',)); ?>
Acest lucru va duce la următoarea ieșire HTML.
Putem schimba pachetele HTML pentru containerul widget și titlul cu orice alte coduri HTML, clase, coduri de identitate etc.
În plus, pentru a înregistra mai mult de o zonă dinamică din bara laterală, duplicăm register_sidebar zona codului împreună cu multitudinea de parametri de câte ori este necesar pentru a înregistra bare laterale suplimentare.
'Stânga', 'before_widget' => '',' după_widget '=>'',' anterior_title '=>'',' după_title '=>'
',));
register_sidebar (array ('name' => 'Dreapta', 'before_widget' => '',' după_widget '=>'',' anterior_title '=>'',' după_title '=>'
',)); ?>
Cu ajutorul acestor parametri suplimentari putem controla mai ușor ieșirea HTML, astfel încât să putem corespunde structurii de care avem nevoie pentru stilul pe care încercăm să-l realizăm. Vom folosi codul de mai sus pentru a înlocui barele laterale numerotate cu cele numite.
Este important să rețineți că atunci când modificați înregistrările în bara laterală așa cum am procedat deja sau când adăugați bare laterale suplimentare, în special pentru teme care rulează pe site-uri live, widget-urile ar putea fi atribuite incorect de WordPress
WordPress încearcă, în general, să păstreze widget-urile în barele laterale pe baza comenzii lor, astfel încât dacă o zonă laterală este eliminată sau adăugată, WordPress vă poate re-aloca widget-urile existente în zonele laterale care corespund comenzii din bara laterală anterioară. În cazul nostru, acum nu este o problemă pentru că avem încă doar 2 bare laterale, astfel încât widgeturile noastre să rămână acolo unde s-au aflat.
În momentul în care ați schimbat numele în codul nostru de înregistrare, pentru că avem o configurație simplă de 2 barebare, WordPress este în continuare capabil să plaseze barele noastre sidebare pe tema noastră pe baza comenzii lor. Cu toate acestea, trebuie să modificăm codul de plasare al barei laterale pentru a reflecta numele create de noi pentru a evita posibilele probleme în viitor.
Plasarea barelor laterale numite necesită, în esență, schimbarea numărului, în codul nostru de plasare, la numele barei laterale. Deci, folosind primul cod de plasare, am început cu asta, fiind cel mai simplu:
Numele pe care îl folosim trebuie să fie identic cu numele pe care ni-l dă bara laterală în codul nostru de înregistrare.
În ceea ce privește codul de plasare mai extins pe care l-am utilizat pentru barele laterale numerotate:
Nu au fost adăugate widgeturi
Conectați-vă și adăugați unele widget-uri în această bara laterală
Folosind ieșirea HTML generată de codul de înregistrare, putem acum personaliza elementele barei laterale în conținutul inimii noastre.
Linkul de mai jos prezintă unele elemente elementare ale barei laterale / widget CSS pe care trebuie să le luăm în considerare atunci când pregătim teme pentru publicare. Acest lucru este astfel încât utilizatorii care adaugă widget-uri cele mai comune vor avea pre-stil pentru a se potrivi aspectul și aspectul temei.
WordPress Default CSS Stiluri - Jeff Star, DigWP
Acum mergeți și vă rotiți!
Accentsconagua