Creați bara laterală pe WordPress folosind tipuri de înregistrări personalizate

Noi folosim adesea widget-uri text pentru a adăuga conținut diferit pe site-urile panouri laterale, care sunt create în WordPress. Ele sunt ușor de utilizat, luând ca text simplu, și HTML, motiv pentru care utilizarea lor, puteți adăuga toate tipurile de conținut complet.

Cu toate acestea, în cazul în care clienții vor edita bara laterală, fără a fi familiarizat cu HTML, este ușor să conducă la defecțiuni, mai ales atunci când suntem la locul de muncă am folosit imagini sau link-uri.

Cel mai simplu mod pentru a evita - înlocuirea unor porțiuni de text utilizând codul widget în temă la un tip de postare personalizat folosind WP_Query pentru a afișa acest tip de posturi din bara laterală.

Rezultatul muncii noastre va fi ceva de genul:

Creați bara laterală pe WordPress folosind tipuri de înregistrări personalizate

Puteți face acest lucru în două etape:

  1. Înregistrează-tip post-personalizat pentru barele laterale.
  2. Creați un conținut de afișare funcție de pe panoul lateral și adăugați-l la sidebar.php fișier în temă.

Vom crea, de asemenea, barele laterale în WordPress, a se vedea ceea ce arata ca, și de a schimba ușor aspectul.

Ce veți avea nevoie

Pentru a finaliza acest tutorial veți avea nevoie de:

Pentru acest tutorial vom crea o temă filială a douăzeci Cincisprezece, dar puteți utiliza codul de probă pentru a modifica propriile teme, sau puteți utiliza un plugin pentru a înregistra un nou tip de înregistrare personalizat și o funcție, și apoi adăugați funcția la sidebar.php fișier temă .

Crearea unei teme copil

Dacă sunteți de lucru pe tema dvs., puteți sări peste această parte, dar dacă sunteți incepand de la zero, cel mai simplu mod de a înțelege această tehnică este de a crea o temă copil. Vom crea o temă filială a temei Douăzeci cincisprezece ani.

În tema folderul wp-content, creați un dosar nou. Am numit-noastra Sidebar-post-tip personalizat tutsplus.

În folderul, creați două fișiere goale style.css și functions.php. De asemenea, creați o copie a fișierului de la sidebar.php tema părinte. Le puteți edita mai târziu, și WordPress va folosi fișierul șablon pentru afișarea bara laterală a temei dvs. copil, în loc de fișier de la părintele Douăzeci și cincisprezece.

În noul style.css stylesheet, adăugați următoarele:

După aceea, puteți activa tema de pe site-ul dvs. prin intermediul meniului Aspect → Teme în consola de administrare WordPress.

Înregistrarea unui tip de postare personalizată

Următorul pas este înregistrarea unei posturi de tip personalizat la bara laterală. Puteți face acest lucru în fișierul pentru funcțiile tematice (sau, dacă utilizați plugin-ul, a crea un nou fișier în wp-content / plugins folderul).

Deschideți fișierul functions.php în tema și adăugați următorul cod:

Acest lucru se va înregistra un nou tip de mesaje personalizate sidebar_post. Vă rugăm să rețineți că l-am numit în mod deliberat sidebar_post. nu doar bara laterală. Acest lucru se datorează faptului că o mulțime de cei care folosesc deja clasa bara laterală pentru panourile lor laterale și re-utilizare a numelui poate duce la un conflict de clase O etichetă șablon post_class (). Când vom mai târziu va crea un ciclu.

Acum, dacă vă actualizați pagina dvs. de administrare, ecranul va vedea un tip post-personalizat numit Sidebar:

Creați bara laterală pe WordPress folosind tipuri de înregistrări personalizate

Acum, adăugați câteva dintre panourile laterale la fel cum s-ar adăuga un post normal. În captura de ecran, puteți vedea nostru:

Creați bara laterală pe WordPress folosind tipuri de înregistrări personalizate

Unul dintre barele laterale noastre este format doar din imagini. Acest lucru este mai ales pentru că, în viitor, vom crea o buclă, care va imprima imaginile.

Crearea unei funcții pentru a afișa bara laterală

În momentul de față, panourile laterale nu vor fi afișate pe site-ul dvs., deoarece nu le adăugați la tema. Deci, următorul pas este de a scrie o funcție care va fi folosit WP_Query. pentru a afișa posturile din bara laterală.

codul funcției

Adăugați următoarele funcții fișier cu cod:

Apoi salvați funcțiile de fișiere.

Adăugarea de caracteristici pentru fișierul șablon bara laterală

Funcția pe care tocmai ați scris, nu atașat la WordPress, astfel încât în ​​acest moment este imposibil de a rula. Pentru a face acest lucru, trebuie să-l apelați în fișierul sidebar.php.

Sidebar.php deschide fișierul în tema. Dacă lucrați cu o temă filială a douăzeci și Cincisprezece, utilizați copia pe care l-ați creat anterior.

Dacă doriți să aveți în bara laterală sunt numai posturi, fără widget-uri, ștergeți codul pentru a afișa widget-ul. Dacă doriți ca widget-urile prezente, apoi se lasă.

În cazul nostru, vom elimina widget-uri din fișierul Douăzeci și cincisprezece la bara laterală, așa că am elimina următoarele linii de cod:

Acum, adăugați o funcție pentru a afișa bara laterală. Douăzeci Cincisprezece vom adauga la fișierul final sidebar.php. line endif după;. În subiect, o puteți insera oriunde:

După aceea ne putem uita la site-ul nostru, pe care panourile laterale trebuie să fie eliminate:

Creați bara laterală pe WordPress folosind tipuri de înregistrări personalizate

Încă mai trebuie să se pregătească toate același stil, dar vom începe acest lucru după „curăța“ zona de widget-uri.

Anularea unei zone widget

Dacă lucrați cu o temă filială și nu doriți să utilizați widget-uri în bara laterală, pentru a evita confuzia, ștergeți întreaga suprafață a widgeturile din subiectul filialei. Acest lucru înseamnă că, pe pagina Administrator din meniul Appearance → Widgets, acestea nu vor mai apărea. Dacă nu, utilizatorii vor putea adăuga widget-uri, iar ei se vor întreba de ce nu sunt afișate.

Dacă lucrați cu propria temă, tot ce trebuie - este de a elimina codul care înregistrează aceste widget-uri (sau pentru a începe, pur și simplu nu adăuga orice widget-uri). Dacă utilizați un subiect filială, nu puteți schimba un părinte, deci nebhodimo utilizați unregister_sidebar funcția () pentru a elimina widget-ul pentru a bara laterală.

Adăugați la functions.php fișierul temei dvs. copil, după cum urmează:

Acest lucru va anula înregistrarea widget-1 bara laterală. ID-ul pe care am eliminat în fișierul sidebar.php. Rețineți că, atunci când conectarea să funcționeze widgets_init acțiune. Am stabilit priorități 15. pentru a se asigura că această funcție va începe după bara laterală de înregistrare, care a stabilit o prioritate de 10 în mod implicit.

Acum, în Administratorul nu sunt afișate widget-uri fereastra:

Creați bara laterală pe WordPress folosind tipuri de înregistrări personalizate

Efectuarea panourile laterale

În această etapă de panourile laterale noastre nu sunt același stil ca și alt conținut care a fost creat folosind un tabel de douăzeci de cincisprezece stiluri. Dacă utilizați propria temă, este posibil să nu fie o astfel de problemă, sau invers, pot exista și alte probleme cu privire la înregistrare, care vor trebui să fie corectate.

Pentru a scăpa de această problemă în cele douăzeci de cincisprezece ani, trebuie doar să adăugați o linie de CSS. Deschideți foaia de stil style.css de tema copilului și adăugați următorul cod:

Creați bara laterală pe WordPress folosind tipuri de înregistrări personalizate

Deci, mult mai bine! Acum, toate panourile laterale sunt afișate în stilul potrivit.

concluzie

Opțional, folosind această tehnică, puteți adăuga elemente suplimentare la WP_Query. Poate că ați putea crea, de asemenea, o clasificare pentru pozițiile de pe panoul lateral și-l utilizați în ieșire. Sau puteți afișa conținut diferit (de exemplu, inclusiv sau omițând titlul postului sau a imaginii), în funcție de clasificarea (sau mai bine încă, afișare metadate). Puteți adăuga, de asemenea, argumente pentru a sorta posturile folosind menu_order și l utilizați în timpul posturilor de înregistrare.

Sursa: code.tutsplus.com

Nu există nici o îndoială multe WordPress Blog bara laterală, de asemenea, am urmărit acest bloguri de la wpcafe.org este într-adevăr foarte frumos pentru a afla mai multe despre multe WordPress Sidebar aici.

De asemenea, a verifica afară: - thehtmlcoder.com

aherenet. Am citit de trei ori, dar nu au înțeles. Este scris în mod clar nu pentru incepatori ca role de terminologie profesională.