Share
Lucrul cu BuddyPress pe WordPress este un lucru extraordinar, adaugă o nouă dimensiune platformei și demonstrează cu adevărat un potențial imens.
BuddyPress ca și alte pluginuri se extinde pe funcționalitatea pe care o oferă WordPress. Deși este important ca un freelancer sau o companie să recunoască că BuddyPress, spre deosebire de alte pluginuri, adaugă funcționalitate de proporții epice.
Acest tutorial are scopul de a vă arăta cum să demonstrați o dovadă a conceptului rapid și funcțional, fără a face nici o pildă de bună practică a păcatelor cardinale.
În cursul acestui tutorial vom folosi o combinație de funcții PHP, jQuery și WordPress pentru a extinde BuddyPress suficient de departe pentru a demonstra un concept.
Utilizând profilurile membrilor, vom adăuga fără nici un recurs un link care permite utilizatorilor să viziteze o zonă de marcaje membru.
Zona de marcaje va fi populate cu o listă de marcaje pe care un membru a decis să le salveze în timp ce navighează pe orice site activat de BuddyPress.
Domeniul de aplicare a marcajelor care pot fi salvate va fi aplicat doar pentru posturile WordPress pentru moment, cu toate acestea, puteți căuta să construiți în continuare acest lucru și să îl aplicați în alte domenii ale unui site web powered by WordPress care produce un permalink.
Vom construi pe BP-default tema de azi și a crea propria temă a copilului. Mai jos este structura pe care ar fi trebuit să o creați.
style.css - În style.css avem nevoie de o cantitate minimă de cod care să permită selectarea temelor prin wp-admin. Să facem asta acum.
/ * Tema Nume: Temă marcator Descriere: Temă copil de la bp-default cu suport adăugat pentru marcajele membre. Versiune: 1.0 Autor: WPTuts Autor URI: http://wp.tutsplus.org Etichete: buddypress Format: bp-default * /
Tag-uri: buddypress va notifica BuddyPress că folosim o temă activată de BP.
Format: bp-default va instrui BuddyPress că atunci când această temă este activă pentru a moșteni funcționalitatea sa de la BP-default dacă tema nu a fost modificată.
În sidebar.php trebuie să încărcăm widget.php.
Accentsconagua
locate_template (array ('members / single / bookmarks / widget.php'), adevărat); Să mergem mai departe și să înregistrăm bookmarks.js fișier, va fi necesar pe fiecare pagină de aici de pe afară. În functions.php adăugați următoarele.
funcția px_bookmark_scripts () if (! is_admin ()) wp_enqueue_script ('px-scripts -functions', get_stylesheet_directory_uri () ./_inc/js/bookmarks.js ', array ); add_action ('wp_enqueue_scripts', 'px_bookmark_scripts'); wp_enqueue_script acceptă 5 parametri.
wp_head. Dacă este setat la true, se va încărca cu wp_footer.
Browserele site-ului nostru vor putea să adauge sau să elimine o postare WordPress în marcaje făcând clic pe o ancora care citește "Adăugați la marcaje" sau "Eliminați din marcaje" situate în partea de jos a fiecărei postări.
Când se face clic pe o ancora, vom folosi AJAX și vom face o cerere într-un script PHP. Odată executat, vom actualiza widgetul lateral al barei.
În cazul în care browserul este conectat ca membru al site-ului, acesta poate salva eventual orice "Liste de marcaje" care sunt stocate în cadrul sesiunii și afișate în widget.
functions.php...
funcția px_bookmark_link () postare globală $; dacă: @in_array ($ post-> ID, $ _SESSION ['bookmarks'])): $ content = = ID. "date- post-name =". altul: $ content = 'ID.' "data-post-name =" '. get_the_title (). "" Adaugă în marcaje "; endif; returnați conținut $; add_filter ('the_tags', 'px_bookmark_link'); Această funcție se numește la fiecare iterație a "buclă" prin utilizarea add_filter și the_tags ca cârligul nostru.
Am lăsat WordPress să știe că în cadrul acestei funcții dorim accesul la elementele din interiorul $ wp_query si in consecinta $ postare. Acest lucru ne va permite să recuperăm the_id, titlul și the_permalink.
Se aplică o anumită logică atunci când acest cod se execută pentru a determina ce link să fie afișat. Dacă utilizatorul are deja elementul în cadrul sesiunii curente, vom afișa o ancora "Eliminați din marcaje" și viceversa. in_array () ne permite să verificăm acest lucru.
in_array () va anunța notificările dacă raportarea erorii are această directivă, folosim @ simbol pentru a suprima aceste avertismente (hacky).
Utilizarea datelor returnate în $ postare noi formăm două ancore pentru adăugarea și eliminarea marcajelor (toate date atribute importante aici) pentru a fi utilizate ulterior cu apelurile noastre AJAX bookmarks.js.
Pentru o referință completă a filtrelor disponibile, accesați codul.
Acum avem legătura noastră în loc să creăm widget-ul care va apărea în bara laterală în orice moment și va fi populat sau golit la cerere.
Imaginea de mai sus reflectă stările finale ale widget-ului în 3 scenarii.
Următorul bloc de cod este plasat înăuntru widget.php și embedded în HTML markup.
dacă $ _ SESSION ['bookmarks']): foreach ($ _ SESSION ['bookmarks'] ca $ key => $ value): $ chei [] = $ cheie; $ start_count = min (chei $); endforeach; endif; pentru ($ i = $ start_count; $ i < $start_count + count($_SESSION['bookmarks']); $i++) : if($_SESSION['bookmarks'][$i]) : $bookmark = get_post($_SESSION['bookmarks'][$i]); echo '
La construirea acestui proiect a existat o problemă cu datele sesiunii care au continuat să se ridice la ieșire. Unele valori au fost eliminate, dar cheia a persistat. Setarea a $ START_COUNT ulterior pentru a fi utilizat la tipărirea datelor din sesiune a rezolvat această problemă.
Cel mai important lucru pe care trebuie să-l rețineți este cum să preluați elemente de la $ _SESSION [ ''] semne de carte care va fi creat în etapa următoare.
La fiecare iterație pe care o folosim get_post () să interogați baza de date WordPress cu valorile întregi stocate în $ _SESSION [ ''] semne de carte. Care va returna toate datele citibile de la oameni de care avem nevoie.
dacă (is_user_logged_in ()): // Afișează butonul SAVE altceva: // Afișează mesajul "LOGIN TO SAVE". endif; dacă ($ _ SESSION ['bookmarks']): // Afișați butonul CLEAR endif;
Această ultimă bucată de logică widget.php determină ce butoane și text să fie afișate alături de widget, în funcție de starea sesiunii curente și
de asemenea, dacă utilizatorul este conectat sau dezactivat.
jQuery este minunat, aici vom folosi delega și ascultați clicurile pe ancorele noastre importante. Vom verifica dacă au fost selectate următoarele elemente.
adaugă semn de carte șterge-marcaj clare-semne de carte Utilizarea hasClass putem testa ce element a fost făcut clic în cadrul metodei delegate și a servi la doritul AJAX apel.
Dacă construiți acest lucru într-un proiect mai amplu, vă rugăm să luați în considerare utilizarea a PubSub model.
$ bookmark_widget = $ ("# px-bookmarks"), $ empty_widget = $ ('# px px-bookmarks'), $ bookmark_form = $ (' '# px-bookmarks p'), $ widget_buttons = $ ('px px-bookmarks) butoane, $ login_notify = $ reflectă domeniul dvs. $ ajax_path = 'http://yoursite.com/wp-content/themes/bookmark-theme/members/single/bookmarks/ajax.php'; Mai întâi înregistrați unele variabile, astfel încât să nu "stropim în jur în DOM" prea mult. Toți selectorii DOM de mai sus se află în interiorul widget.php.
$ (", add-bookmark, .delete-bookmark, .clear-bookmarks") delegate (aceasta, 'click', funcția (e) e.preventDefault ();); Spunem jQuery să asculte pentru clic pe toate clasele listate și prin intermediul funcției de apel invers va vom spune apoi ce să facem. Următoarele porțiuni de cod care vor fi adăugate vor fi plasate imediat după e.preventDefault ().
Utilizarea preventDefault () este un mod mai inteligent de anulare a acțiunii implicite atunci când este prezentă JavaScript. Iată câteva discuții înconjurătoare preventDefault () pe suprapunerile de stive.
Următoarele porțiuni de cod care vor fi adăugate vor fi plasate imediat după e.preventDefault ().
var $ post_id = $ (acest) .data ('post-id'), $ post_name = $ (this) .data ('post-name'), $ post_href = $ că = $ (acest lucru); Odată ce un utilizator a dat clic pe oricare dintre "ancorele importante" trebuie să stocăm valorile atributului de date care au fost atașate la ancore în pasul 2. Aceasta ne va permite să trimitem și să preluăm datele pe care le dorim.
Codul următor poate deveni puțin mai detaliat, deoarece vom afișa și ascunde elemente în funcție de elementul pe care a fost făcut clic, cu acel pre-cursor codul de mai jos este
minim minim care va funcționa fără a se gândi la estetică. Cu toate acestea, vă rugăm să descărcați sursa și să priviți la aceste linii.
dacă $ that.hasClass ('add-bookmark')) $ .axax (url: $ ajax_path + '? method = add', tip: 'GET', data: 'post_id = funcția (returndata) if ($ bookmark_widget_list.children () length === 0) // Afișare / ascundere $ bookmark_widget_list.prepend ('Aici folosim hasClass pentru a distinge elementul pe care a fost făcut clic cu ajutorul jQuery pentru a căuta elementul pe care l-am făcut clic.
Pe baza rezultatului pe care l-am stabilit AJAX sunați puțin diferit de fiecare dată. Cu URL-ul și date fiind solicitate și trimise de fiecare dată când se schimbă ușor.
Înștiințare ?Metoda = add anexat la $ ajax_path. Acesta este echivalentul lui http://site.com/path/to/ajax.php?method=add.
Când adăugăm un marcaj în sesiunea curentă, singurul element pe care trebuie să-l trecem la codul nostru PHP este id-ul postului care a fost stocat în $ POST_ID variabil.
Când jQuery primește un răspuns de succes, atunci adăugăm acel element la lista curentă de marcaje din zona widget ca element de listă. Utilizarea $ POST_ID, $ POST_NAME și $ post_href aici.
Când pagina este actualizată, codul a fost adăugat la widget.php la pasul 3 se va lovi cu piciorul.
Pe linia 7 a ultimei fragmente există o mică subrutină în cadrul succes care determină dacă există elemente de listă prezente în zona widget. Acesta este codul anterior menționat - ușor-verbose care nu face altceva decât să arate și să ascundă unele elemente DOM. A fost eliminat pentru citire aici pe Wptuts +. Trecând peste…
dacă $ that.hasClass ('delete-bookmark')) $ .axax (url: $ ajax_path + '? method = delete', tip: 'GET', data: 'post_id = (returndata) if ($ bookmark_widget_list.children (). lungime <= 1) // Show / hide $('#bookmark-'+ $post_id).remove(); ); Mai mult ca în cazul în care ($ that.hasClass ( 'add-marcaj')) aici verificăm pentru elementele care au făcut clic pe care au clasa șterge-marcaj.
Odată ce această subrutină a fost introdusă URL-ul în apelul AJAX este ușor modificat prin trimiterea unui șir de interogări diferit. Și anume ?Metoda = șterge.
După returnarea unui răspuns de succes, eliminăm acel element de listă din marcajele curente stocate în widget.
Aplicând o anumită logică în același mod ca și adaugă semn de carte subrutină pentru a determina dacă elementul eliminat va fi elementul final. Pe baza acestui rezultat, elementele DOM sunt afișate sau ascunse din nou.
dacă $ that.hasClass ('clear-bookmarks')) $ .axax (url: $ ajax_path + '? method = clear', succes: function (returndata) // Show / hide $. delete-bookmark ') fiecare (functie (index)) / / lista de marcaje sterse, setarea ancorelor atasate la mesajele implicite $ (this) .removeClass () addClass (' add-bookmark '). marcaje "););); Fragmentul final de cod aici este utilizat pentru a șterge toate marcajele din widget prin setarea URL-ul șirul de interogări la o altă metodă și resetarea oricăror ancore din pagină la valorile implicite "Adăugați la marcaje" pentru a reflecta o imagine goală $ _SESSION. Acest lucru se face folosind jQuery fiecare metodă pentru a găsi toate aparițiile clasei șterge-marcaj (ancora atașată la postări folosind add_filter) și revenirea la valorile impliciteadaugă semn de carte.
Acum vom crea codul PHP menționat în apelurile AJAX de mai sus, care vor fi folosite pentru a adăuga, șterge și șterge toate marcajele din sesiune.
În ajax.php vom crea următoarele 3 funcții.
adaugă semn de carte()delete_bookmark ()clear_bookmarks ()Să creați mai întâi adaugă semn de carte()
funcția add_bookmark () $ post_id = $ _GET ['post_id']; dacă @! in_array ($ post_id, $ _SESSION ['bookmarks'])): $ _SESSION ['bookmarks'] [] = $ post_id; endif;
Mai întâi păstrăm $ POST_ID anterior trecut peste bookmarks.js prin intermediul date: 'post_id =' + $ post_id.
Apoi vom folosi in_array funcția din nou pentru a determina dacă acest element trebuie adăugat la sesiunea de marcaje.
funcția delete_bookmark () $ post_id = $ _GET ['post_id']; foreach ($ _ SESSION ['bookmarks'] ca $ cheie => valoare $): $ chei [] = cheie $; endforeach; $ start_count = min (chei $); dacă (@in_array ($ post_id, $ _SESSION ['bookmarks'])): pentru ($ i = $ start_count; $ i < $start_count + count($_SESSION['bookmarks']); $i++) : if($_SESSION['bookmarks'][$i] === $post_id) : unset($_SESSION['bookmarks'][$i]); endif; endfor; endif;
În cadrul delete_bookmark () funcția pe care o stocăm din nou $ POST_ID.
Folosind aceeași tehnică pentru a ieși în marcajele noastre widget.php A $ START_COUNT este stabilit.
Apoi determinăm dacă elementul a trecut ($ POST_ID) există în cadrul sesiunii de marcaje prin intermediul in_array, și dezactivați orice valori care sunt potrivite.
funcția clear_bookmark () session_start (); session_unset (); session_destroy ();
În cele din urmă clear_bookmark () Funcția distruge toate datele sesiunii.
Vom avea nevoie de încă o bucată de cod pentru ca acest fișier să fie complet. Accesați partea de sus a fișierului și adăugați următoarele.
session_start (); $ metoda = $ _GET ['metoda']; comutare (metoda $) caz "add": add_bookmark (); pauză; cazul "delete": delete_bookmark (); pauză; cazul "clar": clear_bookmark (); pauză;
Folosim session_start () pentru a relua sesiunea curentă. Acest lucru este crucial aici.
Apoi păstrăm metoda pe care o trimitem URL-ul în a noastră $ .ajax apeluri.
Pe baza valorii curente a metoda $ numim funcția corespunzătoare.
Fișierele cu care vom avea de-a face cu restul acestui tutorial sunt enumerate mai jos.
Interior home.php vom adăuga un element de listă în lista neordonată din div cu un id de item-nav.
Utilizarea $ bp la nivel mondial putem forma rapid URL-ul necesar.
global $ bp; echo "
Aceasta este una dintre păcatele mai mici pe care le facem pe drum pentru a demonstra dovada conceptului. Cu toate acestea, pentru a re-itera dovada de concept și de dezvoltare rapidă este factorul important aici.
Dacă ne vom hotărî să extindem mai mult această caracteristică, ar trebui să ne uităm la utilizarea cârligelor BuddyPress.
dacă ($ _GET ['component'] == 'bookmarks'): locate_template (array ('members / single / bookmarks / view.php'), true); Încă înăuntru home.php verificăm împotriva șirului de interogare care ne va permite să furnizăm șabloane personalizate.
dacă ! $ _GET ['action']): locate_template (array ('members / single / bookmarks / loop.php'), true); elseif ($ _GET ['action'] == 'salvați' && is_user_logged_in () && bp_is_home ()): locate_template (array ('members / single / bookmarks / save.php'); elseif ($ _GET ['action'] == 'eliminați' && is_user_logged_in () && bp_is_home ()): locate_template (array ('members / single / bookmarks / remove.php'); endif; În view.php (încărcătorul șablonului de schimbare a mărcilor) verificăm 2 acțiuni, iar dacă nici unul nu a fost definit, afișăm lista marcajelor salvate.
Înapoi în pasul 3 a fost adăugată o anumită logică pentru a determina ancorele care trebuie afișate în cadrul widgetului în funcție de starea actuală de $ _SESSION [ ''] semne de carte și dacă utilizatorul a fost sau nu logat.
Să creăm un tabel mic în baza de date care va fi utilizat pentru a stoca o listă de marcaje care corespund fiecărui membru.
DROP TABLE Dacă există "marcaje"; CREATE TABLE '(' id 'int (11) NU NULL AUTO_INCREMENT,' user_id 'int (11) NOT NULL, data' created 'NOT NULL, textul post_ids NOT NULL text_name text NOT NULL, KEY PRIMARY ("id")) MySQL de mai sus va crea un nou tabel cu 5 câmpuri pentru a stoca datele de marcaj.
Odată creat, este timpul să ne mișcăm save.php.
În timp ce utilizatorul accesează save.php vom prezenta un formular cu o introducere de text, aici utilizatorul va trebui să dea o etichetă la lista de marcaje pe care ar dori să o salveze.
Odată ce a fost furnizată o etichetă, vom stoca fiecare listă de marcaje ca un rând în baza de date (pentru preluarea ulterioară) și vom șterge sesiunea curentă.
($ _ POST ['px-bookmark-list-name']): // Prezentul formular care cere să se citească un nume // Stage 1 elseif ($ _ POST ['px-bookmark-list-name' / Eticheta livrată la baza de date. Etapa 2 endif;
Acum în etapa 1 din save.php...
// Dacă în formularul trimis, dar nu există o etichetă, a apărut o eroare prezent dacă $ _ POST ['submit'] &&! isset ($ _ POST ['px-bookmark-list-name'])):Este necesară o etichetă.
„; endif; // Stabilirea contorului de start dacă ($ _ SESSION ['bookmarks']): foreach ($ _ SESSION ['bookmarks'] ca $ key => value $): $ keys [] = $ key; endforeach; $ start_count = min (chei $); endif; // Faceți buclă peste obiecte și păstrați-le în câmpuri de formă ascunsă. pentru ($ i = $ start_count; $ i < $start_count + count($_SESSION['bookmarks']); $i++) : if($_SESSION['bookmarks'][$i] !== NULL) : $bookmark = get_post($_SESSION['bookmarks'][$i]); echo ' "; echo" "; echo" "; echo"„; endif; endfor;
Mai întâi afișăm o eroare dacă nu a fost furnizată nici o etichetă.
Apoi vom folosi aceeași tehnică widget.php și ajax.php pentru a stabili un contor de start și pentru a repeta datele de sesiune.
În cele din urmă ieșim câmpuri de formă cu ajutorul lui get_post.
global $ bp; foreach ($ _ POST ['px-post-id'] ca valoare $): $ posts_to_save [] = $ value; endforeach; $ posts = serialize ($ posts_to_save);
În etapa a 2 a save.php avem acces la $ bp global.
Ne batem peste $ _POST datele și stocarea posturilor pentru a fi salvate ca o matrice. Acesta este apoi serializat și stocat în posturi $ variabil.
$ list_name = $ _POST ['px-bookmark-list-name']; $ query = $ wpdb-> insert ('bookmarks', array ('user_id' => $ bp-> loggedin_user-> id, 'created' => current_time ('mysql' list_name '=> $ list_name), array ('% d ', // user_id'% s ', // creat'% s ', // post_ids'% s '// list_name)); Apoi păstrăm eticheta furnizată de utilizator pentru această listă de marcaje într-o variabilă și folosită WPDB pentru a insera rândul în baza de date.
dacă ($ interogare): echo '„; echo "„; session_start (); session_unset (); session_destroy (); altceva: echo 'Listă salvată.
„; echo "„; echo "„; endif;A fost o eroare.
„; echo "
În cele din urmă, verificăm dacă interogarea a reușit și a dezactiva datele sesiunii, altfel afișând o eroare.
Amintiți-vă, în view.php atunci când nu este particular acțiune este setat vom încărca loop.php. În acest fișier $ wpdb va fi folosit pentru a prelua și a scoate orice liste de marcaje.
global $ bp; $ display_user = $ bp-> display_user-> id; $ bookmark_lists = $ wpdb-> get_results ("SELECT * FROM marcaje WHERE user_id = $ displayed_user ORDER BY id DESC"); Utilizarea $ bp la nivel global, id-ul profilului afișat este stocat în $ displayed_user variabil.
Apoi, efectuăm o interogare împotriva tabelului cu marcajele stocate $ displayed_user ca o condiție în cazul în care.
dacă ($ bookmark_lists): foreach ($ bookmark_lists ca $ bookmark_list): echo $ bookmark_list-> list_name; $ post_ids = neserializează ($ bookmark_list-> post_ids); foreach ($ post_ids ca $ post_id): $ bookmark = get_post ($ post_id); echo 'post_name.' "title =" Vizualizare marcaj ">". $ bookmark-> post_title. "; endforeach; endforeach; endif;
Atunci când rezultatele sunt returnate, acestea sunt afișate prin looparea datelor și ieșirea corespunzătoare. Aici facem uz de unserialize pentru a inversa efecteleserializa care a fost folosit pentru a stoca marcajele anterior.
Putem face încă o adăugare la blocul precedent de cod.
if (is_user_logged_in () && bp_is_home ()): echo 'display_user-> domeniu.' component = bookmarks & action = remove & id = '.
Acest lucru va adăuga o ancoră la titlul fiecărei liste, care la efectuarea clicului va trece printr-o acțiune nouă elimina împreună cu id-ul listei de marcaje.
Care ne conduce la etapa finală ... Ștergerea unei liste de marcaje. Deschide remove.php și să terminăm asta.
dacă isset ($ _GET ['action']) == 'elimina' && isset ($ _GET ['id'])): $ list_id = $ _GET ['id']; global $ bp; $ user_id = $ bp-> loggedin_user-> id; $ query = $ wpdb-> interogare ("DELETE FROM bookmarks WHERE id = $ list_id ȘI user_id = $ user_id"); dacă ($ interogare): echo '„; echo "Lista a fost ștearsă.
„; echo "„; altceva: echo '„; echo "A fost o eroare.
„; echo "„; endif; endif; Mai întâi, asigurați-vă că acțiunea este setată să se elimine și că există un id pentru a construi o interogare mică cu.
Apoi stocăm câteva date de utilizator și execută interogarea. Utilizatorii ar trebui să aibă posibilitatea de a șterge numai liste care aparțin acestora, folosind $ BP-> loggedin_user-> id ne ajută să realizăm acest lucru.
În cele din urmă, vom difuza un mesaj în funcție de rezultat.
Pe parcursul acestui tutorial au fost aplicate mai multe tehnici. Folosind jQuery, convenții brute PHP, WordPress și BuddyPress, am reușit să ilustrăm o caracteristică frumoasă care va fi adăugată site-ului dvs. de rețea socială alimentat de WordPress și BuddyPress.
Din cutie BuddyPress nu vine cu un manager de marcaje atașat la profilurile membrilor și nu există un plugin care să funcționeze exact așa.
Un manager de marcaje este un exemplu, dar acest lucru ar putea fi orice.
Scopul principal al acestui tutorial a fost să ilustreze cât de repede și eficient puteți să-l vedeți pe BuddyPress pentru a demonstra dovada conceptului.
Cu ceva know-how acest lucru ar putea fi puse împreună într-o seară cu mici probleme deloc. Angajamentul de timp este tangibil și poate fi inclus într-un contract de întreținere lunar.
Cu toate acestea, dacă un client a dorit mai multe caracteristici din managerul de marcaje, cum ar fi un widget de tabloul de bord și mai multe funcții detaliate, veți intra în domeniile unui plugin.
Datele nu au fost dezinfectate în acest tutorial, astfel vă rugăm să vă asigurați că dacă doriți să plasați acest lucru într-un mediu "real", treceți printr-un pic de validare înainte de mâna.
Sper că v-ați bucurat de acest tutorial și de eventualele discrepanțe pe care le puteți găsi vă rugăm să nu lăsați un comentariu și va face tot posibilul pentru a vă ajuta să îl faceți.
