Stilul unic al fiecărei postări WordPress este o modalitate inteligentă de a face site-ul dvs. să iasă în evidență. Vă permite să evidențiați conținutul specific și să potriviți designul cu vibrația mărcii dvs.
Unele site-uri folosesc fundaluri personalizate pentru postările lipicioase sau oferă fiecărei categorii propriul stil. Aceste mici ajustări ajută conținutul dvs. să pară mai organizat și mai atrăgător vizual.
Dar acest lucru poate fi dificil. Fără instrumentele și pașii potriviți, ați putea pierde ore întregi încercând și erorând — sau mai rău, ați putea rupe accidental aspectul site-ului dvs.
Am făcut cercetarea pentru dumneavoastră și am găsit câteva metode simple pentru a stiliza postările diferit.
Folosind WPCode, cel mai bun plugin pentru fragmente de cod pentru WordPress, puteți adăuga cu ușurință stiluri personalizate postărilor dvs. și puteți crea un aspect unic pentru fiecare – fără efort.
Notă: Acest tutorial necesită să adăugați CSS personalizat în WordPress. De asemenea, va trebui să puteți utiliza instrumentul Inspect și să aveți cunoștințe de bază de CSS, deci s-ar putea să nu fie potrivit pentru începători complet.
Avantaje și dezavantaje ale stilizării fiecărui post WordPress diferit
Dacă aveți un blog WordPress, stilizarea fiecărei postări diferit poate crea o experiență vizuală unică, unde culori diferite sunt asociate cu diferite categorii sau tipuri de conținut.
De exemplu, ați putea folosi o culoare de fundal diferită pentru listele, postările de blog și tutorialele de pe site-ul dvs. Acest lucru poate atrage instantaneu atenția utilizatorilor și poate crește implicarea.
Rețineți că acest lucru poate avea și câteva dezavantaje majore. De exemplu, va trebui să întrețineți în mod regulat designul fiecărei postări WordPress, ceea ce poate consuma mult timp.
În plus, poate oferi o experiență inconsistentă utilizatorului și nu va ajuta la identitatea brandului tău. Principalul motiv este că trebuie să folosești aceleași culori pe tot site-ul tău pentru a stabili imaginea afacerii tale.
Dacă ești începător, adăugarea de CSS personalizat pentru a stiliza fiecare postare poate fi, de asemenea, dificilă. Acestea fiind spuse, îți vom arăta cum să stilizezi cu ușurință fiecare postare WordPress în mod diferit.
Iată o prezentare rapidă a tuturor subiectelor pe care le vom aborda în acest ghid:
- Cum să stilizezi postările individuale în WordPress
- Cum să stilizezi postările dintr-o anumită categorie
- Cum să stilizezi postările diferit în funcție de autor
- Cum să stilizezi postările în funcție de popularitate folosind numărul de comentarii
- Bonus: Afișați o bară laterală diferită pentru fiecare postare în WordPress
Să începem.
Cum să stilizezi postările individuale în WordPress
WordPress adaugă clase CSS implicite la diverse elemente de pe site-ul tău. Teme folosesc o funcție WordPress de bază numită post_class() pentru a spune WordPress unde să adauge acele clase CSS implicite pentru postări.
Dacă vizitați site-ul dvs. web și utilizați instrumentul Inspect în browserul dvs., veți putea vedea acele clase adăugate pentru fiecare postare.
Următoarele sunt clasele CSS adăugate implicit, în funcție de pagina pe care o vizualizează un utilizator:
- .post-id
- .post
- .attachment
- .sticky
- .hentry (pagini cu microformat hAtom)
- .category-ID
- .nume-categorie
- .tag-name
- .format-{format-name}
- .type-{nume-tip-postare}
- .has-post-thumbnail
Un exemplu de ieșire ar arăta astfel:
<article id="post-412" class="post-412 post type-post status-publish format-standard hentry category-news">
Puteți stiliza fiecare postare WordPress diferit folosind clasele sau ID-urile CSS respective. Pentru a face acest lucru, va trebui mai întâi să găsești ID-ul postării pentru o postare individuală.
Pentru aceasta, trebuie să vizitați pagina Postări » Toate postările din tabloul de bord WordPress și să treceți cursorul mouse-ului peste o postare.
O adresă URL de editare a postării va apărea acum în colțul din stânga jos al ecranului. Aici, poți găsi ID-ul postării uitându-te la numărul dintre 'post=' și '&action.'
În exemplul de mai jos, ID-ul postării este 25.
Odată ce ați făcut acest lucru, trebuie să adăugați clasa CSS împreună cu codul personalizat în fișierele temei sau în personalizatorul temei. Cu toate acestea, acest lucru poate fi riscant și vă poate defecta site-ul cu o singură eroare.
Acesta este motivul pentru care recomandăm să folosiți WPCode în schimb.
După testare amănunțită, am constatat că este cea mai ușoară și sigură modalitate de a adăuga cod personalizat pe site-ul dvs. Pentru a afla mai multe despre experiența noastră cu pluginul, consultați recenzia noastră despre WPCode.
Mai întâi, trebuie să instalați și să activați pluginul gratuit WPCode. Pentru detalii, consultați ghidul nostru pentru începători despre cum să instalați un plugin WordPress.
Notă: Dacă vă place versiunea gratuită, actualizarea la WPCode Pro ar putea duce experiența dumneavoastră la nivelul următor. Versiunea premium deblochează accesul la peste 100 de fragmente de cod verificate de experți, logică condițională inteligentă, modificări de cod programate și multe altele.
După activare, vizitați pagina Code Snippets » + Add Snippet din tabloul de bord WordPress. Aici, faceți clic pe butonul ‘Use Snippet’ sub opțiunea ‘Add Your Custom Code (New Snippet)’.
Aceasta vă va duce la pagina „Creare fragment personalizat”, unde puteți începe prin a adăuga un nume pentru fragmentul dvs. de cod. După aceea, să selectăm „Fragment CSS” ca tip de cod din meniul derulant din dreapta.
Apoi, trebuie să adăugați clasa CSS și ID-ul postării dvs. individuale în caseta „Previzualizare cod” astfel:
.post-13 { }
După aceea, puteți adăuga orice fel de cod CSS personalizat între paranteze pentru a vă stiliza postarea.
De exemplu, dacă doriți să schimbați culoarea de fundal a unei postări individuale, puteți adăuga următorul cod CSS personalizat. Rețineți că trebuie să înlocuiți ID-ul postării din acest cod cu propriul ID. Unde acesta este .post-13, al dumneavoastră ar putea fi .post-23873.
Puteți schimba, de asemenea, codul hexazecimal pentru culoarea de fundal la orice culoare doriți:
.post-13 {
background-color: #FF0303;
color:#FFFFFF;
}
Apoi, comutați comutatorul „Inactive” din partea de sus la „Active” și faceți clic pe butonul „Save Snippet” pentru a salva setările.
Codul CSS personalizat va fi acum executat automat pe postarea dvs. individuală la activarea fragmentului.
Accesează-ți postarea de pe blogul WordPress pentru a vedea modificările în timp real.
Puteți, de asemenea, să adăugați alte fragmente de cod CSS personalizate în caseta „Previzualizare cod” pentru a schimba culoarea selecției textului, culoarea textului, culoarea linkurilor interne și multe altele.
Pentru mai multe informații, puteți consulta ghidul nostru pentru începători despre cum să personalizați culorile în WordPress.
Cum să stilizezi postările dintr-o anumită categorie
Dacă doriți să stilizați toate postările care aparțin unei anumite categorii, puteți face acest lucru și cu WPCode.
Trebuie să vizitați pagina Fragment de cod » + Adăugare fragment și să selectați opțiunea „Adăugați codul dvs. personalizat (Fragment nou)”.
Apoi, adăugați un nume de fragment de cod pe noua pagină și alegeți „Fragment CSS” ca tip de cod. După aceea, introduceți clasa CSS a unei categorii specifice în caseta de previzualizare a codului, astfel, folosind permalink slug-ul categoriei după cratimă:
.category-books { }
Odată ce ați făcut acest lucru, puteți adăuga orice fragment CSS personalizat în casetă și îl puteți aplica tuturor postărilor din diferite categorii.
De exemplu, dacă doriți să modificați dimensiunea și stilul fontului pentru toate postările dintr-o anumită categorie, puteți utiliza următorul fragment de cod. Nu uitați să înlocuiți numele categoriei conform site-ului dvs. web.
category-books {
font-size: 18px;
font-style: italic;
}
Apoi, va trebui să comutați comutatorul „Inactiv” la „Activ” din partea de sus.
După aceea, faceți clic pe butonul „Salvează fragmentul” pentru a vă stoca setările.
Acum puteți vizita toate postările dintr-o anumită categorie pentru a vedea modificările aplicate cu codul CSS.
Așa arăta pe site-ul nostru de demonstrație:
Cum să stilizezi postările diferit în funcție de autor
Clasele CSS implicite generate de funcția the_posts() nu includ numele autorului ca clasă CSS.
Dacă dorești să personalizezi stilul fiecărei postări în funcție de autor, atunci mai întâi va trebui să adaugi numele autorului ca clasă CSS.
Pentru a face acest lucru cu WPCode, puteți selecta opțiunea „Adăugați codul dvs. personalizat (Snippet nou)”.
Acest lucru vă va duce la pagina „Creare fragment personalizat”, unde trebuie să adăugați un nume pentru fragmentul de cod și să selectați „Fragment PHP” ca tip de cod.
După aceea, pur și simplu adăugați următorul cod personalizat în caseta „Previzualizare cod” și înlocuiți „user_nicename” cu numele autorului.
$author = get_the_author_meta('user_nicename'); ?>
<article id="post-<?php the_ID(); ?>" <?php post_class( $author );
În cele din urmă, puteți comuta comutatorul „Inactiv” la „Activ” și să dați clic pe butonul „Salvează fragmentul” pentru a stoca setările dvs.
Ar trebui să arate așa:
Acest cod va adăuga acum nicename-ul utilizatorului ca o clasă CSS. Nicename este un nume prietenos pentru URL utilizat de WordPress. Nu are spații, iar toate caracterele sunt minuscule, ceea ce îl face perfect pentru a fi utilizat ca o clasă CSS.
Acum trebuie să vizitați din nou pagina Code Snippets » + Add Snippet și să alegeți opțiunea ‘Add Your Custom Code (New Snippet)’.
Pe ecranul următor, veți dori să adăugați un nume pentru codul dvs. personalizat și să alegeți „Fragment CSS” ca tip de cod din meniul derulant din dreapta.
Puteți apoi adăuga numele specific al autorului în caseta ‘Code Preview’ astfel:
.sarahclare
Următorul pas este să adăugați codul CSS personalizat pentru a schimba culoarea de fundal, dimensiunea bordurii, culoarea textului și multe altele.
Puteți folosi codul de mai jos pentru a schimba culoarea de fundal a postărilor unui autor și pentru a adăuga o bordură zonei de conținut.
.sarahclare {
background-color:#EEE;
border:1px solid #CCC;
}
Odată ce ați terminat, faceți clic pe butonul „Salvează fragmentul” din partea de sus.
Apoi, nu uitați să comutați comutatorul „Inactiv” la „Activ”.
Fragmentul de cod personalizat va fi executat automat la activare.
Acum puteți vizita postul unui anumit autor pentru a vedea modificările.
Cum să stilizezi postările în funcție de popularitate folosind numărul de comentarii
Ați văzut probabil site-uri cu widget-uri pentru postări populare, care uneori se bazează pe numărul de comentarii. În acest exemplu, vă vom arăta cum să stilizați postările diferit folosind numărul de comentarii.
Mai întâi, trebuie să obținem numărul de comentarii și să asociem o clasă cu acesta.
Pentru a obține numărul de comentarii, va trebui să adăugați următorul cod în fișierele temei dvs., sau puteți utiliza un plugin de fragmente de cod precum WPCode.
Pur și simplu alegeți opțiunea „Adăugați codul dvs. personalizat (Snippet nou)” pentru a lansa pagina „Creați un snippet personalizat” în WPCode.
Aici, veți dori să selectați „Snippet PHP” ca „Tip de cod” și apoi să copiați și să lipiți următorul cod în caseta „Previzualizare cod”:
<?php
$postid = get_the_ID();
$total_comment_count = wp_count_comments($postid);
$my_comment_count = $total_comment_count->approved;
if ($my_comment_count <10) {
$my_comment_count = 'new';
} elseif ($my_comment_count >= 10 && $my_comment_count <20) {
$my_comment_count = 'emerging';
} elseif ($my_comment_count >= 20) {
$my_comment_count = 'popular';
}
?>
După aceea, să dăm clic pe butonul „Salvează fragmentul” și să comutăm comutatorul „Inactiv” la „Activ” pentru a stoca setările dvs.
Acest cod verifică numărul de comentarii pentru postarea afișată și le atribuie o valoare pe baza numărului.
De exemplu, postările cu mai puțin de 10 comentarii primesc o clasă numită new, mai puțin de 20 sunt denumite emerging, iar orice peste 20 de comentarii este popular.
Acum, trebuie să adăugați numărul de comentarii ca o clasă CSS la funcția post_class. Pentru a face acest lucru, trebuie să deschideți din nou pagina „Create Custom Snippet” și să selectați opțiunea „PHP Snippet” din meniul derulant.
Apoi, puteți adăuga următorul cod personalizat în caseta de previzualizare:
<article id="post-<?php the_ID(); ?>" <?php post_class( $my_comment_count ); ?>>
După aceea, pur și simplu faceți clic pe butonul „Salvare fragment”.
Apoi, puteți comuta comutatorul ‘Inactive’ la ‘Active’.
Aceasta va adăuga clase CSS new, emerging și popular tuturor postărilor, în funcție de numărul de comentarii pe care le are fiecare postare. Acum puteți adăuga CSS personalizat pentru a stiliza fiecare postare în funcție de popularitatea sa.
De exemplu, puteți utiliza următorul cod pentru a adăuga culori diferite la chenarul postărilor, în funcție de numărul de comentarii postate pe acestea:
.new {border: 1px solid #FFFF00;}
.emerging {border: 1px dashed #FF9933;}
.popular {border: 1px dashed #CC0000;}
Când ați terminat, nu uitați să faceți clic pe butonul „Salvare fragment” pentru a vă stoca setările.
Bonus: Afișați o bară laterală diferită pentru fiecare postare în WordPress
După ce ați stilizat fiecare postare diferit, este posibil să doriți să adăugați o bară laterală unică pentru fiecare postare. Acest lucru vă va permite să prezentați conținut specific legat de acel articol care ar putea interesa utilizatorii.
De exemplu, dacă aveți un blog de călătorii și ați publicat o postare despre locuri de vizitat în Florida, atunci puteți crea o bară laterală specifică ce afișează pachete de călătorie în Florida. Alternativ, ați putea afișa un formular de înregistrare pentru o călătorie în Florida pe care o organizați.
Puteți folosi SeedProd, cel mai bun plugin constructor de pagini pentru WordPress, pentru a afișa o bară laterală diferită pentru fiecare postare.
Are o interfață drag-and-drop, peste 320 de șabloane predefinite și integrări cu servicii de marketing prin email, ceea ce îl face o alegere excelentă.
La activarea pluginului, puteți selecta o pagină personalizată ca design al paginii de destinație și apoi un aspect cu o bară laterală.
După aceea, puteți trage și plasa cu ușurință blocuri la alegere din coloana din stânga, inclusiv formulare de contact, arhive, concursuri, câmpuri de căutare, comentarii și multe altele.
Odată ce ați terminat, faceți clic pe butoanele „Salvează” și „Publică” din meniul derulant din partea de sus.
Acum ați proiectat cu succes o bară laterală specifică pentru o postare sau pagină WordPress.
Pentru mai multe detalii, consultați tutorialul nostru despre cum să afișați o bară laterală diferită pentru fiecare postare și pagină în WordPress.
Sperăm că acest articol v-a ajutat să învățați cum să stilizați fiecare postare WordPress diferit. De asemenea, ați putea dori să consultați ghidurile noastre pentru începători despre cum să adăugați o pictogramă favicon și cum să adăugați fulgi de zăpadă care cad pe blogul dvs. WordPress.
Dacă ți-a plăcut acest articol, te rugăm să te abonezi la canalul nostru de YouTube pentru tutoriale video WordPress. Ne poți găsi, de asemenea, pe Twitter și Facebook.
Rafael
Articol frumos. Presupun că aș putea folosi ceva de genul acesta pentru a verifica categoria unui post și a plasa un CSS personalizat pentru a schimba stilul unei părți a site-ului în funcție de categorie, corect?
Doresc să setez culori diferite doar pentru fundalul Titlului Postării pentru fiecare Categorie dintr-un Blog.
Kany
Salut, articol grozav. Cum să stilizez cu CSS personalizat cele mai recente știri de pe blog? Doar cea mai recentă, ai vreo idee? Mulțumesc.
Suport WPBeginner
Tema dumneavoastră ar trebui să adauge ceva ce poate fi țintit de CSS; în prezent nu avem o metodă recomandată pentru a adăuga acest lucru.
Admin
Les
Articol excelent. Am vrut să setez dimensiunea implicită a fontului pe categorie și am urmat instrucțiunile adăugând codul în fișierul Style.css, dar când am adăugat o postare nouă, fontul avea dimensiunea veche. Vedeți codul? Ce îmi lipsește?
/* Început stiluri CSS suplimentare */
.art-blockheader .t, .art-vmenublockheader .t {white-space: nowrap;}
.desktop .art-nav-inner{width: 1200px!important;}
.category-firstg {
font-size: 18px;
font-style: bold;
}
/* Sfârșit stiluri CSS suplimentare */
William D
Articol grozav, mulțumesc mult. Ar putea fi schimbată și culoarea butonului „citește mai mult”/culoarea textului într-un mod similar? Ceva (probabil am făcut eu) mi-a schimbat butoanele într-un mod foarte neplăcut și îmi ia mult timp să-mi dau seama cum să le fac din nou plăcute.
Mulțumesc anticipat pentru orice ajutor pe care îl puteți oferi!
Matus
Tutorial grozav. Explicație simplă și clară.
Neon Emmanuel
Salut, dacă includ asta în single.php, afișează titlul postării curente, dar funcționează bine în index.php, ai vreo sugestie?
MayMyatKhine
Salut, te rog trimite-mi noul eveniment pentru a folosi wordpress.
marisa
Acesta este un articol grozav, dar am probleme cu plasarea
ID, ‘post-class’); ?>
Unde exact în buclă să o pun? Folosesc underscore.me cu foundation 5 și noua mea clasă nu apare.
Alberto Hartzet
Perfect!, mersi. Ce zici de prima și „ultima” postare? Ai vreo idee?
Nadeem
Mulțumesc mult frate..e foarte util
RW
încă un marcaj! articol grozav! mulțumesc...
Payal
Foarte informativ, mulțumesc. Am salvat această pagină.
Am și eu o întrebare: Ce se întâmplă dacă aș vrea să stilizez primul (cel mai recent) post diferit — astfel încât postarea afișată în partea de sus a paginii mele de index să apară diferit?
James
Salut, mă chinui cu asta momentan..
Bucla mea de postări nu pare să aibă o funcție post_class, așa că nu pot să-mi dau seama unde să plasez codul de mai sus…
Acesta este bucla pe care o folosesc pentru postări, unde aș plasa codul de mai sus? Sau cum aș putea face ca câmpurile personalizate să funcționeze folosind acest lucru?
Personal editorial
Trebuie să adăugați ceva de genul acesta în bucla postărilor dvs.:
1-click Use in WordPress
Admin
Jon Fuller
Bună ziua, sunt destul de nou în crearea de teme WordPress și caut o modalitate de a afișa fiecare postare într-o casetă proprie, separată printr-o margine sus și jos. Vă rog să explicați cum este posibil acest lucru.
Mulțumesc
Personal editorial
În mod implicit, fiecare postare este în propriul său element div. Trebuie doar să folosiți CSS pentru a adăuga margini sus și jos.
Admin
Shaun
Curios, cum s-ar putea aplica acest lucru la adăugarea unei clase CSS doar postărilor care au aceeași „valoare meta” sau „număr de valoare meta”?
Mulțumesc pentru tutorialul grozav, apropo!
Cele mai bune
Personal editorial
Am arătat cum se face cu câmpuri personalizate, dar asta se face pe cheie. Dar dacă aveți aceeași cheie cu mai multe valori, atunci ar trebui să folosiți funcția get_post_custom_values.
Admin
Em
Tocmai am găsit această postare și este grozavă, clară, concisă și la obiect, mulțumesc mult
Jim
Aș dori să fac ceva de genul ca postarea unu să primească clasa „1”, postarea doi să primească „2”, postarea trei să primească „3”, iar apoi să se repete această ordine, astfel încât postarea patru să primească din nou „1”.
Aveți sfaturi? se repetă doar trei clase diferite la fiecare trei postări.
Personal editorial
Ar trebui să folosiți opțiunea super loop.
Admin
Brit
Ceea ce încerc să fac în mod specific este doar să fac ca atunci când cineva ajunge pe blogul meu, miniatura (care este doar un cerc cu titlul postării) să aibă o culoare diferită DOAR pentru cea mai recentă postare. Nu știu cum să fac asta să se întâmple. Tot ce am găsit este specific categoriei sau ordinii. Păreri?
Personal editorial
Brit, ar trebui să folosești ultima metodă „Super Loop”. Aceasta este probabil singura modalitate de a face acest lucru, deoarece tot ce ai face este ca la prima postare, să adaugi o clasă unică precum „first-post” și apoi să o stilizezi folosind fișierul tău CSS.
Admin
Jayaseelan Arumugam
Este un post foarte frumos și util. Îmi place în special modul de stilizare a postărilor pe baza câmpurilor personalizate. Mulțumesc.
Kathleen
Thanks for this great article! It’s exactly what I searched for and so much helpful!
dina
Cum adaug o clasă unică la a 3-a, a 6-a, a 9-a și a 12-a postare într-un super loop. Mulțumesc!
vajrasar
Ei bine, acesta este un articol foarte bun. Am înțeles ce ați spus, dar puteți clarifica cum voi implementa acest lucru pe tema mea Genesis News Child, deoarece ar trebui să fac totul cu function.php
Aș dori să stilizez postările specifice categoriei diferit. Mulțumesc mult pentru această piesă. Foarte informativ.
Personal editorial
Deci, dacă folosiți doar metoda post class, atunci Genesis are câmpul sub setările de Layout pentru fiecare postare. Puteți introduce o clasă personalizată și o puteți stiliza în acest fel. Restul poate deveni destul de complicat, în funcție de toate hook-urile și altele. Nu facem neapărat articole specifice Genesis aici.
Admin
jim
Ce vreți să spuneți index.php în buclă. care index.php. Al meu nu are nimic asemănător cu al dvs. Acesta este al 10-lea post pe care îl citesc unde nimeni nu a explicat corect acest concept de bază. Și ce se întâmplă cu CSS-ul. Ultimele 10 postări nu au explicat nici asta. Internetul devine din ce în ce mai rău.
Personal editorial
Salut Jim,
Fiecare temă WordPress face lucrurile diferit. Conceptul de buclă este destul de bine explicat în WordPress Codex. Necesită o simplă căutare pe Google: Loop WordPress, care vă va duce la: http://codex.wordpress.org/The_Loop
Deoarece fiecare temă variază, unele utilizează un fișier loop.php separat, altele sunt teme copil care nici măcar nu au fișiere index.php. Este foarte greu de explicat toate aceste concepte. Când plasăm tutoriale într-o categorie de teme, ne așteptăm ca utilizatorii să aibă o cunoaștere corectă a modului în care funcționează temele WordPress (chiar dacă nu cunoașteți PHP).
Admin
Haider E Karrar
Cred că ar trebui să folosiți filtre în loc, în combinație cu etichetele de șablon aici http://codex.wordpress.org/Conditional_Tags
De exemplu
function my_post_css_filters($content) { if(is_category(…)) return ” $content “; else if (something else) ….
}
add_filter(‘the_content’, ‘my_post_css_filters’, 1) — (prioritate 1, nu sunt sigur ce altceva ar putea afecta).
Hossein
Salut..
Cum pot încadra fiecare 4 postări într-un div?
gashface
Lasă-mă, am rezolvat asta, dar ACUM nu stilizează fiecare postare diferit, ci le stilizează pe toate conform primului autor de postare pe care îl găsește?
gashface
Există o modalitate de a specifica o etichetă precum H2 este stilizată de autor? Încerc .username h2{} de exemplu, dar nu funcționează?
gashface
Acest lucru nu arată autorul cu mine, doar un spațiu gol, am lipit codul dvs. exact, aveți vreo idee? postări făcute de administrator și sunt private, face asta vreo diferență?
wpbeginner
@gashface nu, nu face nicio diferență dacă postarea este privată sau publică… Dacă returnează o pagină albă, atunci lipiți codul într-un loc greșit.
gashface
Mi-am dat seama că era pentru că puneam codul înainte de apelul la buclă, am crezut că vă referiți înainte de if have posts etc. când ar trebui să fie după asta, mulțumesc pentru avertisment
KimeeDoherty
This was a little helpful, but I am still lost
Not sure how to include the loop file in order to override the template. You started the <div> tag but not ended them, what’s inside the div? I’m lost 
kristelvdakker
Vă mulțumesc mult pentru acest articol! A fost foarte util.
Stuart
Salut, mulțumesc pentru idei – în special pentru super-buclă – mă bucur că a funcționat pe site-ul meu.
Dar mă întreb, sunt un începător complet în php, așa că există o modalitate de a adapta codul astfel încât fiecare pagină ulterioară de postări să nu primească stilul pe care postările 1, 2, 3 și 4 îl primesc pe prima pagină.
Cu alte cuvinte, vreau ca doar primele patru postări de pe prima pagină să arate diferit față de restul.
Noroc,
Stu
Personal editorial
Da. Puteți utiliza eticheta condițională is_paged(), astfel încât să apară doar pe prima pagină, dar nu și pe celelalte. Puteți utiliza, de asemenea, is_home() ... astfel încât să apară doar pe pagina principală.
Admin
Stuart
Super – mulțumesc. Se pare că is_paged() este cel potrivit pentru mine – dar, din păcate, abilitățile mele de începător înseamnă că mă lupt să-mi dau seama cum să-l integrez în cod.
Stuart
Am reușit în cele din urmă…
Michael
Dacă ați dori să utilizați această abordare pentru a separa vizual postările în funcție de data publicării. Cum ați proceda? De exemplu: stilizați cele 5 postări publicate pe 1 cu un fundal negru, apoi stilizați postările publicate pe 2 cu un fundal roșu? Mulțumesc anticipat!
Personal editorial
Cea mai bună modalitate de a face acest lucru este folosind metoda superloop. Unde folosiți variabila contor pentru a seta valorile clasei postării.
Admin
Dale
Încerc să stilizez numele fiecărui autor cu o culoare diferită pe site-ul nostru WordPress și am urmat codul dvs. de mai jos:
Deși acest cod funcționează oarecum pe tema mea de WordPress, el pune ghilimele de închidere după class-2, dar înainte de numele autorului, astfel încât clasa este închisă fără numele în ea. Am descoperit acest lucru doar punând acel php în corpul unde puteți vedea șirul complet.
Are cineva vreo idee de ce se întâmplă asta?
Dale
Îmi pare rău că a șters codul php pe care l-am postat, dar iată ieșirea clasei pentru stilizarea postărilor mele după numele autorului. Autorul aici se numește admin, iar după cum puteți vedea, tag-ul de închidere este înainte de numele autorului admin.
"post-395 post type-post hentry category-uncategorized class-1 class-2" admin
Bec
Postare grozavă! Acele informații sunt uimitoare pentru a adăuga acele caracteristici personalizate speciale la designul dvs.
Adam W. Warner
Într-adevăr un post grozav, felicitări! Cu toate acestea, nu m-am putut abține să nu mă gândesc la momentul în care va fi necesar să actualizați tema la care faceți toate aceste modificări personalizate. Încerc să folosesc fișierul functions ori de câte ori este posibil pentru a evita suprascrierile.
M-aș gândi că ar fi mai bine să integrăm aceste modificări ale buclei într-o funcție. Știu că, cu temele părinte precum Thematic, Hybrid, Genesis etc., este posibil (și recomandat) să filtrați bucla și, prin urmare, să adăugați aceste modificări.
@Ken – Poate pluginul tău ar elimina necesitatea oricăror funcții?
Oricum, doar părerea mea și felicitări Syed și echipei pentru excelența continuă pe acest site!
Azad Shaikh
Postare foarte utilă într-adevăr. De ce nu publicați câteva teme wordpress cu ideile și funcționalitatea dvs. uimitoare. Ar fi un mare succes.
Mulțumesc!
Ken
Articolul tău mi-a dat câteva idei despre cum să-mi îmbunătățesc plugin-ul, mulțumesc pentru asta!
Am scris un plugin (Scripts n Styles) pentru a adăuga CSS direct în elementul head din ecranul de editare al postării/paginii. (Doar utilizatorii admin pot face asta, totuși.) Nu este la fel de robust (sau mai degrabă, nu abordează același lucru) ca soluția dvs., deoarece CSS-ul apare doar în vizualizarea unică, nu în liste (arhive).
Mă gândesc să adaug funcționalitatea de a include un nume de clasă în post_class, dar printr-o casetă meta pe ecranul de administrare. Apoi, administratorul ar trebui doar să adauge codul CSS în tema sa. (Sau, poate un ecran de setări pentru a facilita acest lucru?)
Oricum, Bucla Super pare utilă pentru teme în general, va trebui să o includ în următoarea mea!
Connor Crosby
Wow, that is a great post! Perfect timing since I am making a new Wordpress theme