Jeste li ikad naišli na web stranicu koja svoje članke drugačije objavljuje na blogu?
Na nekim su web mjestima istaknuti članci istaknuti prilagođenom pozadinom, dok drugi mogu imati postove svake kategorije s jedinstvenim izgledom. Ako ste oduvijek željeli naučiti kako prilagoditi svaki WordPress post, došli ste na pravo mjesto.
U ovom ćemo vam vodiču pokazati kako različito oblikovati svaki WordPress članak.
Ali, ako nikad niste instalirali WordPress, otkrijte Kako instalirati 7 korake WordPress blog et Kako pronaći, instalirati i aktivirati WordPress temu na svoj blog
Onda se vratimo zašto smo ovdje.
Bilješka: Ovaj vodič zahtijeva da dodate prilagođeni CSS na WordPress. Također ćete trebati koristiti alat Inspect. Potrebno je određeno CSS i HTML znanje.
Dajte individualni stil na WordPress članke
WordPress dodaje zadane CSS klase različitim elementima vaše web stranice. A WordPress tema standardno kompatibilan mora imati kod koji zahtijeva WordPress za dodavanje CSS klasa za tijelo, postove, stranice, widgete, izbornike i više.
Otkrijte i naš vodič o Trajne: Kako prilagoditi svoj blog linkovi
Glavna funkcija WordPressa naziva " post_class () Teme se koriste da bi WordPressu rekao gdje dodati ove zadane CSS klase u članke.
Ako posjetite svoje web mjesto i upotrijebite alat Inspect u svom pregledniku, moći ćete vidjeti ove klase dodane za svaki post.
Ovdje su CSS klase dodane prema zadanim postavkama na temelju stranice koju je prikazao korisnik.
- .post id
- .poster
- .attachement
- .gluant
- .hentry
- .category ID
- .category-name
- .tag-name
- .format- {format-name}
- {.Type- nakon tipa name}
- .has post-sličice
- potreban .post-lozinkom
- .protected po-a-lozinkom
Primjer prikaza mogao bi izgledati ovako:
Svaku WordPress publikaciju možete drugačije prilagoditi pomoću odgovarajućih CSS klasa.
Pročitajte također: Kako poboljšati svoj WordPress blog ovog vikenda
Na primjer, ako želite urediti pojedinačnu publikaciju, možete koristiti klasu post-id u svom prilagođenom CSS-u.
.post-412 {pozadinska boja: #FF0303; Boja: #FFFFFF; }
Ne zaboravite promijeniti ID posta kako bi odgovarao vašem ID-u posta.
Pogledajmo još jedan primjer.
Ovaj put ćemo pokriti sve članke objavljene u određenoj kategoriji pod nazivom "vijesti".
Otkrijte naš vodič o Kako dodati prilagođeni CSS u svoj blog na WordPressu
To možemo učiniti dodavanjem sljedećeg prilagođenog CSS-a našoj temi.
.category-actualities {font-size: 18px; font-style: italic; }
Ovaj CSS utječe na sve stavke u kategoriji " aktualnost ".
Funkcija post_class ()
Programeri tema koriste funkciju post_class () kako bi WordPressu rekao gdje dodati klase postova. Obično se nalazi u oznaci "article".
Funkcija post_class () ne samo da učitava CSS klase generirane u WordPressu prema zadanim postavkama, već vam omogućuje i dodavanje vlastitih klasa.
Otkrijte također Kako bi zaštitili svoj blog sadržaja strugala
Prema vašem WordPress tema, pronaći ćete funkciju post_class() u vašoj single.php datoteci ili u datotekama predloška. Obično će kôd izgledati ovako:
" >
Možete dodati svoju prilagođenu CSS klasu s atributom poput ovog:
" >
Klasa post_class ispisat će odgovarajuće zadane CSS klase s vašom prilagođenom CSS klasom.
Ako želite dodati više CSS klasa, možete ih definirati kao niz i koristiti ih u funkciji post-klase ().
" >
Prikazajte članke različitog stila prema autorima
Zadane CSS klase generirane funkcijom posts_class ne uključuju ime autora kao CSS klasu.
Ako želite prilagoditi stil svakog posta na temelju autora, prvo morate dodati ime autora kao CSS klasu.
Za čitanje također: Kako dodati CSS animacije WordPress
To možete učiniti pomoću sljedećeg isječka:
" >
Ovaj će kôd dodati korisničko ime kao CSS klasu. Korisničko ime je naziv kompatibilan s URL-om koji koristi WordPress. Nema razmaka i svi su znakovi malim slovima, što ga čini savršenim za upotrebu kao CSS klasa.
Pogledajte i naš vodič na Kako dodati prilagođeni CSS u svoj blog na WordPressu
Gornji kôd vjerojatno će se prikazati ovako:
Sada možete koristiti ".peter" u svom prilagođenom CSS-u da biste modificirali sve postove tog određenog autora tako da izgledaju drugačije.
.peter {pozadinska boja: #EEE; granica: 1px solid #CCC; }
Prilagodite objavljivanje članaka na temelju komentara
Možda ste vidjeli web stranice sa widgetima s popularnim člancima koji se ponekad rangiraju na temelju komentara. U ovom primjeru pokazat ćemo vam kako stvoriti drugačiji stil koristeći broj komentara.
Otkrijte naše 10 premium WordPress dodataka za upravljanje komentarima
Prvo, moramo dobiti broj komentara i pridružiti razred.
Da biste dobili broj komentara, morate dodati sljedeći kod u svoje datoteke WordPress tema. Ovaj kod ide u WordPress petlju, možete ga dodati neposredno prije oznake .
odobren; if ($ my_comment_count <10) {$ my_comment_count = 'novo'; } elseif ($ my_comment_count> = 10 && $ my_comment_count <20) {$ my_comment_count = 'ermerging'; } elseif ($ my_comment_count> = 20) {$ my_comment_count = 'popularno'; }?>
Ovaj kôd provjerava broj komentara za objavljenu publikaciju i dodjeljuje im vrijednost na temelju računa. Na primjer, poruke s manje od 10 komentara dobivaju klasu pod nazivom " novi Manje od 20 poziva šmirgl ", I sve što se tiče više od 20 komentara je" popularan ".
Zatim morate dodati CSS klasu funkciji post_class.
" >
To će dodati nove, u nastajanju i popularne CSS klase u sve članke na temelju broja komentara u svakom postu.
Također vas pozivamo da pročitate naš članak o 6 WordPress plugini za potpisivanje dokumenata na mreži
Možete dodati prilagođene CSS publikacije u stilu na temelju popularnosti:
.new {border: 1px solid #FFFF00;} .emerging {border: 1px isprekidan #FF9933;} .popular {border: 1px isprekidan #CC0000;}
Mi samo dodamo obrube, ali možete dodati sva CSS pravila koja želite.
Otkrijte i neke premium WordPress dodatke
Možete koristiti druge WordPress plugins dati moderan izgled i optimizirati vezu s vašim blogom ili web stranicom.
Ovdje vam nudimo nekoliko premium WordPress dodataka koji će vam pomoći u tome.
1. Ultimate članstvo Pro
Ultimate Membership Pro je izvrstan WordPress plugin premija za pretplatu i ograničenje sadržaja. Omogućuje upravljanje korisnicima u skladu s njihovim paketom (besplatnim ili plaćenim) stvaranjem ekskluzivnih razina pristupa.
Stoga će to biti moguće zaštitite sav sadržaj vaše web stranice, ili samo njegov dio. To će biti na primjer tečaj, lekcija, stranica, proizvod, kategorija, slika itd.
Pročitajte i naš članak o 4 premium WordPress dodataka za stvaranje sličica
Njegove su glavne funkcije između ostalog: zaštita sadržaja, višestruki nivo pristupa, podrška za višestruke pristupnike - PayPal, Autorize.net, Pruga, 2CheckOut, bankovni prijenos-, djelomična zaštita sadržaja, I mnogo više…
Preuzmite | demo | Web hosting
2. Kako klizač za Facebook
Kako klizač za Facebook je WordPress plugin premium koji posjetiteljima nudi mogućnost ostavljanja komentara na vašoj web stranici. S ovim modernim i nenametljivim okvirom za komentare, ovo WordPress plugin pruža značajku Like Box i Fan Page Wall koja će proširiti integraciju vaše web stranice s društvenom mrežom Facebook.
Dodatak također nudi različite funkcionalnosti za proširivanje kapaciteta vaše web stranice: Primjerice odjeljak Like ("Like Box") ili stranicu posvećenu obožavateljima ("Wall Page Wall").
Otkrijte i vi Kako postupno učitavati komentare na Facebooku i Disqusu
Ne trebate ugrađivati gumbe "Sviđa mi se" i "Dijeli" na postove ili stranice, jer ih klizač za komentare na Facebooku već ima i mogu se pojaviti na bilo kojem postu ili stranici. Posjetitelji će pronaći gumb "Sviđa mi se", gumb "Dijeli" i Facebook klizač okvir za komentare. Očito će koristiti njihove Facebook račune.
Osim toga, možete uključiti, isključiti i postaviti vrijeme efekta tresenja.
Preuzmite | demo | Web hosting
3. Prijava Ninja
Ovaj premium WordPress dodatak omogućuje vam prilagodbu stranice za prijavu. To je više od samog prilagođavanja vaš obrazac za prijavu, Možete prilagoditi cijelu stranicu promjenom boje stranice, dodavanjem pozadinske slike, dodavanjem logotipa i još mnogo toga.
Ostale značajke su: zaštita obrazaca za prijavu i registraciju captchaom, automatsko i ručno zabranjivanje IP-ova koji vas napadaju silom, detaljan zapisnik o svim aktivnostima povezivanja, preusmjeravanje korisnika na temelju uloga i korisničkih imena, primanje obavijesti putem e-pošte za sve događaje povezivanja, grafičko sučelje koje se lako koristi, detaljna dokumentacija i još mnogo toga.
Preuzmite | demo | Web hosting
Preporučeni resursi
Saznajte više o drugim preporučenim resursima koji će vam pomoći u izgradnji i upravljanju web mjesta.
- 9 WordPress dodataka za upravljanje PayPal plaćanja na njegov blog
- 10 osnovnih WordPress dodataka za instaliranje na vaš blog
- 10 WordPress dodataka za upravljanje oglašavanjem
- 10 WordPress dodataka za stvaranje atributa za svoje promjenjive proizvode
Zaključak
Ovdje je ! To je sve za ovaj tutorial, nadam se da će vam to omogućiti da prilagodite prikaz članaka na svom WordPress blogu. Ako imate bilo kakvih nedoumica ili prijedloga u ovom području, pronađite se odjeljak komentara za raspravu.
Međutim, također ćete moći konzultirati naše sredstva, ako vam treba više elemenata za provođenje projekata kreiranja internetskih stranica, savjetujući se s našim vodičem na internetu Izrada bloga WordPress ili onaj koji je uključen Divi: najbolja WordPress tema svih vremena.
Ali u međuvremenu, ovaj članak podijelite na svojim različitim društvenim mrežama.
...
