Share
Aceasta este o parte a unei serii de articole care analizează modul în care pluginul sau tema dvs. se pot integra cel mai bine în interfața de utilizare a administratorului WordPress. În această parte ne vom uita la modul în care puteți utiliza WordPress "admin pointers" în plugins.
Admin pointers a apărut pentru prima dată în 3.3, și au fost menite să evidențieze doar câteva dintre noile caracteristici care vin cu fiecare lansare majoră (de exemplu, tema customiser în 3.4).
Atunci când sunt utilizate în mod corespunzător, acestea pot fi foarte eficiente pentru a atrage atenția asupra celor mai noi caracteristici pe care le-ați adăugat.
Disclaimer: Indicatorii de administrare se află încă în primele etape ale vieții - și există posibilitatea ca aceștia să se poată schimba. Dacă core-ul WordPress dezvoltă vreodată un API public - ar trebui să o adopți.
O interfață decentă cu utilizatorul nu este o idee gimmică. De fapt, o ideal interfața utilizator nu ar avea nevoie de niciunul. Acestea sunt foarte utile pentru a scoate în evidență caracteristicile ocazionale noi, în special cele pe care utilizatorul dvs. le-ar fi ratat. În acest scop, pot îmbunătăți experiența utilizatorului, dar dacă le folosiți în orice alt scop sau pur și simplu folosiți prea multe, atunci faceți greșit. În loc să îmbunătățiți plugin-ul pentru utilizatorul final, veți sfârși prin a le frustra.
Deci, câți sunt prea mulți? Amintiți-vă că vor exista alte plugin-uri instalate, și fiecare poate folosi (sau abuzează) și acești indicatori. WordPress (evident) le folosește. Ar fi interesant de a evalua opinia oamenilor cu privire la acest lucru, dar eu însumi nu aș adăuga mai mult de două în nici o actualizare majoră (nici una minoră) și cu siguranță nu mai mult de una pe o anumită pagină.
Este important că, fără un API-cheie, nu există o modalitate de gestionare a mai multor indicatori: dacă douăzeci de indicatori sunt adăugați la o pagină, atunci douăzeci vor fi afișate. Deoarece nu știți ce alte pluginuri fac - vă rugăm să le folosiți cu ușurință.
Atunci când folosiți pointeri de administrare într-un plugin sau o temă, va fi util să puteți adăuga cu ușurință și rapid indicii suplimentari pe măsură ce plugin-ul dvs. evoluează. În acest scop, vom crea o funcție de ajutor care să se ocupe de manipularea internă a indicatorilor. Acesta va folosi WordPress "mult iubit API cârlig, și declanșa un filtru de formă:
wptuts_admin_pointers_ ecran id
Unde Ecran id este ID-ul paginii pe care o vizualizați. Pentru a adăuga un pointer la pagina de editare a postării, de exemplu, am fi atașat filtrul:
wptuts_admin_pointers_post
În acest fel, putem adăuga indicii suplimentare, cu un cod minimal. Rolul acestei funcții de ajutor va fi să creeze o serie de pointeri care vor fi tipărite pe pagina de administrare ca o serie de obiecte JavaScript - fiecare obiect care corespunde unui singur pointer. Fiecare obiect indicator conține următorii parametri:
Accentsconagua
pointer_id - un identificator unic pentru pointer. O idee bună este să includeți versiunea pentru care este relevantă. Aceasta trebuie să conțină numai litere alfanumerice, subliniere și liniuțe.ţintă - un selector pentru ținta indicatorului, adică ceea ce indică (de ex. #some_id, sau .unele clasă)Opțiuni - Aceasta este o serie de opțiuni. Putem folosi acest lucru pentru a modifica complet modul în care arată și se comportă pointerul, dar pentru scopurile noastre trebuie să luăm în considerare doar următoarele: conținutul (textul care apare în pointer) și poziția. Poziția proprietății este determinată de:
margine - care margine (stânga, dreapta, sus, jos) ar trebui să fie adiacentă la țintă.alinia - modul în care cursorul trebuie aliniat pe această margine, în raport cu țintă (sus, jos, stânga, dreapta, mijloc).Un obiect pointer tipic poate fi de forma:
pointer_id: 'xyz_v110', țintă: '#some_id', opțiuni: content: 'Caracteristică nouă: xyz
Lorem ipsum dolor stai amet ...
', poziția: margine:' stânga ', alinierea:' sus '
Odată ce obiectele pointerului sunt tipărite în pagina de administrare, putem folosi widgetul indicatorului WordPress definit aici.
Așa cum am discutat în secțiunea anterioară, obiectivul general al funcției noastre este de a tipări câteva obiecte JavaScript în pagină și de a încărca un anumit script personalizat. Deci, funcția noastră de helper va fi cuplată pe wp_enqueue_scripts acțiune (totuși, am putea spune mai târziu).
add_action ('admin_enqueue_scripts', 'wptuts_pointer_load'); funcția wptuts_pointer_load ($ hook_suffix) // Funcția Helper merge aici Rețineți că, dacă utilizați acest cod într-un plugin sau într-o temă, trebuie să redenumiți funcția, asigurându-vă că este unică și, de preferință, vă prefixează cu plugin-ul sau cu numele temei. Prima parte a acestei funcții filtrează o matrice goală, folosind cârligul wptuts_admin_pointers- screen_id. Acest lucru ne permite să adăugăm pointeri în acea matrice. Dacă nu se adaugă nimic, ne oprim.
// Nu rulați pe WP < 3.3 if ( get_bloginfo( 'version' ) < '3.3' ) return; // Get the screen ID $screen = get_current_screen(); $screen_id = $screen->id; // Obținerea indicatoarelor pentru acest ecran $ pointers = apply_filters ('wptuts_admin_pointers-'. $ Screen_id, array ()); Nu există indicii? Apoi ne oprim. dacă ! $ pointers ||! is_array ($ pointers)) retur; Acum, acești indicatori pot include acelea pe care utilizatorul le-a văzut înainte și "respins". Nu vrem ca acestea să apară din nou pentru acest utilizator, așa că, în continuare, vom obține o serie de indicii pe care ei deja i-au văzut și închis și le vom elimina din matricea noastră. De asemenea, efectuăm niște controale de sănătate pe indicatorii noștri:
// Obțineți indicatori concediați $ dismissed = explode (',', (șir) get_user_meta (get_current_user_id (), 'dismissed_wp_pointers', true)); $ valid_pointers = array (); // Verificați indicatorii și eliminați cei concediați. foreach ($ pointers ca $ pointer_id => $ pointer) // Verificare sanitară dacă (in_array ($ pointer_id, $ dismissed) || gol ($ pointer) || gol ($ pointer_id) || empty ($ pointer [ ']) || goală ($ pointer [' opțiuni '])) continuați; $ pointer ['pointer_id'] = $ pointer_id; // Adăugați pointerul la $ valid_pointers array $ valid_pointers ['pointers'] [] = $ pointer; Nu există indicii valide? Opreste aici. dacă (gol ($ valid_pointers)) retur; În cele din urmă introducem scripturile și stilurile necesare și tipărește pointerii valabili pe pagină folosind wp_localize_script.
// Adăugați stilul pointerilor în coadă. wp_enqueue_style ('wp-pointer'); // Adăugați scriptul de pointeri și propriul script personalizat în coadă. wp_enqueue_script ('wptuts-pointer', plugins_url ('js / wptuts-pointer.js', __FILE__), array ('wp-pointer')); // Adăugați opțiunile pentru pointer pentru script. wp_localize_script ('wptuts-pointer', 'wptutsPointer', $ valid_pointer); add_action ('admin_enqueue_scripts', 'wptuts_pointer_load', 1000); funcția wptuts_pointer_load ($ hook_suffix) // Nu rulează pe WP < 3.3 if ( get_bloginfo( 'version' ) < '3.3' ) return; $screen = get_current_screen(); $screen_id = $screen->id; // Obținerea indicatoarelor pentru acest ecran $ pointers = apply_filters ('wptuts_admin_pointers-'. $ Screen_id, array ()); dacă ! $ pointers ||! is_array ($ pointers)) retur; // Obțineți indicatori concediați $ dismissed = explode (',', (șir) get_user_meta (get_current_user_id (), 'dismissed_wp_pointers', true)); $ valid_pointers = array (); // Verificați indicatorii și eliminați cei concediați. foreach ($ pointers ca $ pointer_id => $ pointer) // Verificare sanitară dacă (in_array ($ pointer_id, $ dismissed) || gol ($ pointer) || gol ($ pointer_id) || empty ($ pointer [ ']) || goală ($ pointer [' opțiuni '])) continuați; $ pointer ['pointer_id'] = $ pointer_id; // Adăugați pointerul la $ valid_pointers array $ valid_pointers ['pointers'] [] = $ pointer; Nu există indicii valide? Opreste aici. dacă (gol ($ valid_pointers)) retur; // Adăugați stilul pointerilor în coadă. wp_enqueue_style ('wp-pointer'); // Adăugați scriptul de pointeri în coadă. Adăugați un script personalizat. wp_enqueue_script ('wptuts-pointer', plugins_url ('js / wptuts-pointer.js', __FILE__), array ('wp-pointer')); // Adăugați opțiunile pentru pointer pentru script. wp_localize_script ('wptuts-pointer', 'wptutsPointer', $ valid_pointers); Scriptul este foarte simplu, deoarece widgetul pointerului face cea mai mare parte a lucrului. La acest pointer, tot ce trebuie să definim este ceea ce se întâmplă atunci când pointerul este demis. În special, trimitem o solicitare ajax cu acțiunea "respingerea-wp-pointer"și indicatorul pentru a seta identificatorul unic pe care îl specificăm atunci când adăugăm pointerul.
(pointer.options, close: function () $ ($) $ ($) .post (ajaxurl, pointer: pointer.pointer_id, acțiune: 'dismiss-wp-pointer');); $ (pointer.target) .pointer (opțiuni) .pointer ;
Acesta este tot codul de care trebuie să adăugăm deoarece WordPress se ocupă de solicitarea ajax.
Așa cum a promis, adăugarea indicatorilor este foarte ușoară. Pentru a adăuga un indicator la ecranul "post", de exemplu:
add_filter ('wptuts_admin_pointers-post', 'wptuts_register_pointer_testing'); ($ p) $ p ['xyz140'] = array ('target' => 'change-permalinks' % s
% s
', __ (' Titlu ',' plugindomain '), __ (' Lorem ipsum dolor sit amet, consectetur adipiscing elit ',' plugindomain ' 'aliniați' => 'mijloc'))); returnați $ p; Notă: Când stocați pointerul respins, WordPress trece prin ID-ul pointerului sanitize_key - deci asigurați-vă că utilizați numai cifre alfabetice cu litere mici, liniuțe și subliniere.
