WP_Query este un instrument puternic pentru a controla ceea ce iese din bucla ta. Astăzi o să vă învăț cum să o utilizați pentru a crea o temă de ziar cu 3 coloane, care conține toate postările dvs. principale pe blog în coloana principală și o parte dintr-un set de postări cu o anumită categorie. Vom folosi 960 cadru CSS pentru aspectul de bază și resetarea temei noastre, aceasta va tăia o mulțime de muncă de pe ceea ce este necesar!
Planul nostru de atac este acela de a elimina toate postările cu o categorie atribuită în comun, și
așezați-le pe o parte separată de posturile principale. Vom analiza, de asemenea, o metodă
pentru a crea un "post recomandat" fără a utiliza jQuery sau orice JavaScript deloc! De asemenea, am aruncat împreună un .psd (folosind șabloanele pe care 960 le oferă pentru descărcare) a ceea ce
pe care vrem să o realizăm astăzi. Descărcați aplicația .psd aici.
Presupunem că aveți o instalare live WordPress, indiferent dacă este locală sau găzduită. Dacă aveți nevoie de un pic de ajutor în acest sens, merită să învățați mai întâi cum să instalați WordPress local pe Windows sau pe OS X.
În regulă. Deci, pe lângă nevoia evidentă a unei instalări WordPress, mergem
să aveți nevoie și de câteva lucruri suplimentare. Am o grămadă de fișiere de care ai nevoie
aveți în dosarul tematic.
Ai toate astea? Bun. Ar trebui să fiți pregătiți pentru restul tutorialului acum! Nu uita
pentru a activa tema în WP-admin (wp-admin / themes.php).
Nu vă voi da tot codul WordPress încă. O să vă dau
tot Codul WordPress pe care trebuie să-l excludeți din WP_Query. Vor avea un pas
a lor, pentru că ei au nevoie de explicații! Ar fi umplut și pagina
mult, așa că am inclus totul într-un .txt mai degrabă decât aici.
Descărcați-l și copiați-l în index.php. Sau tastați-l, indiferent de ce se potrivește. Tastare
vă ajută să vă amintiți ce faceți!
Este o grămadă de cod de procesat, așa că voi distruge părțile interesante
pentru voi, și le explicați.
Deci pariez că observați toate aceste clase mici "grid_5" și "container_12" și
ce naiba e asta? Permiteți-mi să vă explic. Numărul următor "grid_"
este numărul de coloane pe care dorim să le selectăm div. Pentru că vrem 12 coloane,
am înfășurat totul (folosind div # înveliș) cu clasa "container_12".
În CSS-ul de bază pe care l-am furnizat, are importurile pentru cele 3 960 de fișiere,
deci avem deja o jumătate de aspect când nu am codificat deloc CSS!
Acest lucru nu va părea prea strălucitor. Nu a fost stil și nici nu are conținut:
Aici se petrece toată magia! Noi avem Trei WP_Querys:
Deci, vrem o coloană de conținut WordPress dintr-o singură categorie. Cum facem noi
fa aia? Utilizarea vast gamă de parametri WP_Query ne oferă
cu, este ușor să faceți acest lucru. Înlocuiți comentariul lorNews în index.php cu:
interogare ( 'CATEGORY_NAMESTART_BOLDFEATURE_NAMEEND_BOLD = theirNews & showposts = 7'); în timp ce ($ theirNews-> have_posts ()): $ theirNews-> the_post (); ?>
Solicitare! Să mergem direct în ea.
Avem nevoie de un anumit cod de buclă.
Citiți articolul complet "); ?>
Pur și simplu titlul ambalat într-un h4 tag, cu conținutul înfășurat într-un div
clasificată "intrare". Grozav! Ați făcut primul dvs. WP_Query din cele 3, ar trebui
acum lista doar categorii cu numele 'theirNews'
Vrem doar să afișăm 1 post, care nu are categoria 'theirNews'. Doar 1.
Deoarece acum înțelegeți fundamentele WP_Query, vă voi da codul complet
(înlocuiți comentariul FEATURED POST cu):
interogare ( 'showposts = 1 & cat = -59'); în timp ce ($ featured-> have_posts ()): $ featured-> the_post (); ?> Postat în .
Acest este postul nostru recomandat, așa că am numit în mod corespunzător div 'featuredPost',
dar pentru că mai târziu vom dori și stiluri din posturile obișnuite, am inclus
clasa "post".
Aceeași înțelegere cu WP_Query. De data aceasta parametrii arată doar 1 posturi care nu sunt
din categoria 59. Categoria 59 este ID-ul categoriei "theirNews". am nevoie
să vă spun cum să obțineți!
Vezi cum are & Cat_ID = 59 la sfarsit? Acesta este numărul dvs. de categorie.
Mina este de 59 de ani, asigurați-vă că o schimbați la indiferent de ID-ul categoriei "lorNews"!
Diferența cu postul recomandat este în principal h2. Pentru că e vorba de
al doilea antet cel mai mare din pagină. Mergeți în secțiunea "lorNews" pe care l-am înfășurat
in a h4 element, deoarece după postările din coloana principală va fi
următorul antet al paginii. Totul pentru dragul stilului.
Ultimul nostru WP_Query. Asta va fi toate posturi cu excepția posturilor conținute
de categoria "lorNews" (Aveți nevoie de ID-ul meu a fost 59, vă puteți aminti a ta?).
Dar deoarece deja afișăm prima postare generală (caracteristica
post), nu vrem să-i arătăm din nou, nu? Așa că trebuie să compensăm postările
1 - ușor de a face cu parametrii puternici ai WP_Query.Replaceți comentariul MAIN WP QUERY
în index.php cu aceasta:
interogare ( 'posts_per_page = 5 & ofset = 1 & cat = -59'); în timp ce ($ main-> have_posts ()): $ main-> the_post (); ?>Postat în .Citiți articolul complet "); ?>
Deci, asta e tot codul HTML și WordPress de care avem nevoie. Aceasta va părea încă de bază, dar
acesta va avea aspectul general de 3 coloane pe care îl urmăm!
Acum, pentru că toate aspectul nostru este destul de mult făcut, este în principal doar stilul care este
Necesar! Descarca
toate aceste CSS, și lipiți-l în stil.css dvs. Există câteva lucruri
suprascrieți codul implicit 960. Nu trebuie să folosim !IMPORTANT deoarece
noul cod este de fapt mai mare decât scara ierarhică decât codul 960. Noi
utilizați codul 960 ca un fel de "bază" pe care o construim. Dacă decorați
fundații ale unei case, mai vedeți în continuare fundațiile brute? Această "decorare"
este în principal pe anteturi, dar un anumit stil general este folosit pentru conținutul textului etc. Unul
suprascrierea majoră este caracterele corpului. Specificăm Georgia, atunci când implicit este de fapt
Helvetica. Fonturile sunt într-adevăr în funcție de preferințele dvs., tocmai am folosit Georgia pentru a fi
diferit! După ce ați inserat și ați citit toate CSS-urile, prima pagină ar trebui să fie
arata complet!
Sunt inclusă doar această secțiune, așa că nu primesc o sumă de întrebări zilnice care să întrebe de ce individul
paginile returnează informațiile care ar trebui să fie pe pagina principală! Deci, noi index
pagina are 3 coloane - Dar ce ați umple 3 coloane cu un anumit single
pagină? Ce vrei tu! Deși aș sugera conținutul postului ... Deci mă duc
pentru a explica cum page.php și single.php muncă, în caz că tu
doriți să extindeți tema. Dacă doriți să împărțiți index.php în antet, bara laterală și
footer, fă-o acum! În caz contrar, vom continua:
Deci acum ar trebui să aveți o coloană principală goală. Vom umple acest lucru cu un
buclă regulată:
Postat în .
Naw ... Bucla obișnuită veche plictisitoare. Simțiți-vă liber să molidați această singură pagină până la orice
tu doriți ca postările dvs. unice să arate. Aceasta oferă principalele
șablon pentru WordPress pentru a afișa o singură postare.
Deci, asta e un singur post, dar avem încă legături către single pagini în
navigare și subsol. Dacă faceți clic pe ele, acestea vor reveni la fel ca și indexul.
Nu rece. Tot ce trebuie să facem este să copiați totul de la unic la altul,
și ar trebui să fie dulce. E ușor? Aceste pagini ar trebui să arate astfel:
Deci tocmai ați aruncat o privire asupra a ceea ce poate face WP_Query. Vă sugerăm să vizitați
pagina de documente Documente privind interogările, care are toți aceiași parametri ca WP_Query. Puteți să vă restrângeți buclă până la orice post specific folosind orice combinație a parametrilor separați de a
&.
Sper că voi ați avut o distracție atât de mare încât am creat o temă de ziar!
Puteți vedea produsul final aici! se bucura!