Oglas

kako kreirati widgeteMnogi će blogeri tražiti visoko i nisko za savršenim WordPress widgetom koji će učiniti upravo to oni žele, ali s malo iskustva u programiranju možda će vam biti lakše napisati svoj običaj Widget.

Ovog tjedna želim pokazati kako to točno učiniti, a widget o kojem ćemo pisati je jednostavan koji iz vašeg slučajnog slučaja odabire jedan slučajni post web mjesto, izvlači istaknutu sliku i prikazuje je na bočnoj traci - vizualni widget "provjeri ovo" koji će pomoći korisnicima da pronađu više sadržaja na vašoj stranica.

Ovo je ujedno i produžetak nastavka serije u kojem vam pokazujem kako je to lako prilagodite svoj WordPress predložak 2 nove cool Wordpress dodatke i razumijevanje strukture Wordpress temeOvaj ću tjedan pogledati superiornu alternativu često hvaljenom sveobuhvatnom SEO; dodatak koji vam daje snagu Wordpress izdavačkog sustava, ali vam omogućuje izlaz ... Čitaj više .

Također vam može biti drago što znate da smo dodali novi Kategorija Vodiči za WordPress za MakeUseOf, stoga svakako provjerite radi sve veće arhive ažurnih savjeta i vodiča do omiljene svjetske platforme za bloganje.

instagram viewer

Ključni pojmovi: WordPress upiti i petlja

Svaka stranica na vašem blogu sastoji se od upita do vaše baze podataka. Ovisno o stranici koju pregledavate, upit će se promijeniti. Na primjer, vaša početna stranica bloga može koristiti upit "dobiti najnovijih 10 postova na blogu“. Kada pregledavate arhive kategorija, upit se može promijeniti u „nabavite najnovijih 20 objava samo za kategorije obiteljskih fotografija, naručite rezultate prema datumu objavljivanja“. Svaki će upit vratiti skup rezultata, a ovisno o korištenom predlošku stranice, svaki će se rezultat voditi kroz glavnu petlju predloška.

Svaka se stranica u stvari može sastojati od više upita, a možete čak i stvoriti vlastite upite za dodavanje funkcionalnosti na raznim mjestima u vašem predlošku. Primjer toga možete vidjeti u upotrebi na dnu ovog članka - imamo nekoliko dodatnih upita koji se pokreću svaka stranica koja ima za cilj da vam pokaže povezane članke koji bi vas mogli zanimati, ili članke koji su u trendu tjedan.

Da bismo napravili svoj prilagođeni widget, jednostavno ćemo trebati stvoriti dodatni upit koji uzima X broj slučajnih postova plus njihove slike i na neki način ih prikazuje na bočnoj traci. Već sam vam pokazao prošli tjedan kod zgrabite istaknutu sliku Postavite svoj blog pomoću WordPressa: Vrhunski vodičŽelite pokrenuti vlastiti blog, ali ne znate kako? Pogledajte WordPress, najmoćniju platformu za blogiranje danas dostupnu. Čitaj više , tako da stvarno samo trebamo znati kako napraviti novi WordPress widget i smjestiti ga na bočnu traku.

Osnovni kôd widgeta

Započnite s stvaranjem nove .php datoteke u vašem wp-content / plugins imenik. Možete i slijediti udžbenik izvanmrežno, a zatim je prenijeti pomoću WordPress sučelja, ali smatram da je lakše pisati dok nastavljamo, u slučaju da trebate otkloniti pogrešku. Nazovite svoju datoteku kako god želite, ali idem i ja slučajnim nakon widget.php

Zalijepite sljedeće u datoteku i spremite. Slobodno promijenite odjeljak na vrhu s mojim imenom u njemu, ali još nemojte prilagoditi ostatak koda. To je u osnovi skelet prazan widget i možete vidjeti gdje piše // ŠIROKODNJI KOD JE OVDJE je mjesto gdje ćemo naknadno dodati svoju funkcionalnost.

PHP. /* Naziv dodatka: Slučajni dodatak posta. URI dodatka: http://jamesbruce.me/ Opis: Random Post Widget hvata slučajni post i pridružene sličice za prikaz na vašoj bočnoj traci. Autor: James Bruce. Verzija: 1. URI autora: http://jamesbruce.me/ * / class RandomPostWidget proširuje WP_Widget. {funkcija RandomPostWidget () {$ widget_ops = array ('classname' => 'RandomPostWidget', 'description' => 'Prikazuje slučajni post sa sličicom'); $ this-> WP_Widget ('RandomPostWidget', 'Slučajna objava i umanjena sličica', $ widget_ops); } obrazac funkcije ($ instanca) {$ instance = wp_parse_args ((niz) $ instanca, array ('naslov' => '')); $ title = $ instance ['title'];

php} ažuriranje funkcija ($ new_instanca, $ old_instanca) {$ instance = $ old_instanca; $ instance ['title'] = $ new_instance ['title']; vratiti $ instancu; } funkcijski widget ($ args, $ instance) {ekstrakt ($ args, EXTR_SKIP); echo $ before_widget; $ title = prazno ($ instance ['title'])? '': apply_filters ('widget_title', $ instance ['title']); ako (! prazno ($ naslov)) odjekuje $ before_title. $ Title. $ After_title;; // ŠIFRA WIDGETA OVDJE odjekuje "

Ovo je moj novi widget!

"; echo $ after_widget; } } dodavanje ('widgets_init', create_function ('', 'return register_widget ("RandomPostWidget");'));

Kao što je to, dodatak nema puno osim što ispisuje veliki naslov s riječima "Ovo je moj novi widget!“.

kako kreirati widgete

No ipak vam daje mogućnost promjene naslova, što je od ključne važnosti za bilo koji widget. Dodavanje drugih opcija malo je izvan okvira ovog članka, tako da za sada prelazimo na stvarnu svrhu.

napišite svoj widget

Novi upit i petlja

Da biste uputili novi upit u bazu podataka svog bloga, morate upotrijebiti query_posts () funkcioniraju zajedno s nekoliko parametara, a zatim prođite kroz izlaz koristeći petlju. Pokušajmo ovo - vrlo osnovni upit i petlja za demonstriranje. Zamijenite redak koda koji kaže:

sa sljedećim:


// ŠIROKODNJI KOD JE OVDJE. query_posts ( ''); if (have_posts ()): while (have_posts ()): the_post (); Naslov(); endwhile; završi ako; wp_reset_query (); 

Ovo je apsolutno osnovni upit koristeći zadane opcije i nulti format rezultata. Ovisno o tome kako je vaš blog postavljen, zadana postavka će najvjerojatnije biti ugrađena u 10 najnovijih postova - tada je sve gore navedeno kod ispisivanje naslova svakog posta. Prilično je ružno, ali djeluje:

napišite svoj widget

To možemo učiniti malo bolje odmah dodavanjem nekog HTML oblikovanja u izlaz s JEKA naredbu i stvaranje veze do posta pomoću get_the_permalink () funkcija:

 query_posts ( ''); if (have_posts ()): odjek "
    • “; while (have_posts ()): the_post (); jeka "
    • „.Get_the_title ()”.

“; endwhile; jeka "

“; završi ako; wp_reset_query ();

napišite svoj widget

Već to izgleda puno bolje. Ali želimo samo jedan post, nasumično izabran. Da bismo to učinili, u upitu navodimo neke parametre:

 query_posts ( 'posts_per_page = 1 orderby = RAND'); 

Naravno, možete ga promijeniti u bilo koji broj postova - u stvari, postoji cijeli niz dodatnih bita koje možete prenijeti u upit kako bismo ograničili, proširili ili promijenili redoslijed rezultata, ali neka se zadrži toga za sada. Ako osvježite, trebali biste vidjeti samo jedan post koji je nasumičan svaki put kad osvježite.

Sada za istaknute sličice. Zamijenite kôd s ovim, nadamo se da možete vidjeti gdje mi hvatamo sličicu i prikazujemo je:


query_posts ( 'posts_per_page = 1 orderby = RAND'); if (have_posts ()): odjek "
    • “; while (have_posts ()): the_post (); jeka "
    • „.Get_the_title (); echo the_post_thumbnail (niz (220.200)); jeka "

“; endwhile; jeka "

“; završi ako; wp_reset_query ();

Gotove rezultate možete ponovo vidjeti na mom razvojnom blogu Samoostvarivanje, iako sam možda premještao stvari do trenutka kada ovo pročitate.

kako kreirati widgete

Zaključak:

Vidite kako je lako izraditi vlastiti prilagođeni widget koji može raditi upravo ono što želite? Čak i ako ne razumijete 90% koda koji sam vam danas pokazao, i dalje biste ga mogli donekle prilagoditi promjenom varijabli ili ispisivanjem različitih HTML-ova. Danas smo napisali cijeli widget, ali lako možete upotrijebiti samo novi upit i kod za petlju na bilo kojem od predložaka vaše stranice.

James je diplomirao iz umjetne inteligencije i certificiran je CompTIA A + i Network +. Vodeći je programer MakeUseOf-a, a svoje slobodno vrijeme provodi igrajući VR paintball i boardgames. Gradio je računala još od djeteta.